Silverlight'da Animasyon Oluşturma

Bir Silverlight Application oluşturalım.Solution Explorerden Mainpage.xaml ye sağ tıklayalım ve open in expression blend seçenegine tıklayarak expression blend programında basit bir animation yapalım.Expression Blend, Sliverlight projeleri için görsel bir tool dur.Sol taraftaki menuden Rectangle (M) aracı ile bir dikdörtgen oluşturalım solda çıkan seçeneklerle fill ile dikdörtgenin içini herhangi bir renge boyayabilirz.

Dikdortgen seçili iken aşagıdaki resimde de gösterilen düğme ile storyboard ekleyelim,

Storyboard animasyonumuzun zaman çizelgesidir.0. saniye için record keyframe butonuna basalım,board gostergecini şimdi 1. Saniyeye alalım ve dikdörtgenimizin opacitiy ayarı ile oynayalım,Expression Blendin solunda Apprence kısmında %100 olan opacitiy’i %0 a çekelim,record keyframeden sonra çizelgeyi bu seferde 3. Saniyeye getirerek opacitiyi eski haline %100 e yukseltelim ve tekrar record keyframe.Animasyonumuzu storyboard daki play tuşuna basarak goreblilriz.

Bu animasyonu bir kontrol altında gerçeklemek için Express blendin sol tarafında üst köşede assets->Behaivors->Controlstoryboardı seçip sürükleyerek objcet and time line sekmesindeki rectangle ye bırakıyoruz,kontrolün türünü ise oluşturduğumuz Control storyboard a tıklayarak trigger alanından seçebilirz.(MouseUp,MouseLeftDown vb. kontroller).Bu animasyonda kontrolün dikdörtgenin üstüne tıkladığımızda gerçekleşmesini istediğimiz için storyboardı rectanglenin üstüne sürükleyip bıraktık,ve control ayarını da MouseLeftDown yaptık.

 Bu adımları tamamladıktan sonra Visual Studio tarafında Mainpage.xaml.cs de bazı yazmamız gereken kodlar olacak.

public partial class MainPage : UserControl

    {

        public MainPage()

        {

            InitializeComponent();

            rectangle.MouseLeftButtonDown += new MouseButtonEventHandler(rectangle_MouseLeftButtonDown);

        }

        void rectangle_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)

        {

            //throw new NotImplementedException();

            Storyboard1.Begin();

        }

    }

Bunları yazdıktan sonra storyboard1.Begin() ile animasyonu başlatırız,projeyi çalıştırdığımızda dikdortgeinin animasyonunun çalışmadığını üzerine tıklanınca çalıştıgını göreceğiz.

Uygulama kodu BURADA.