StoryBoard Nedir ?
ilk konumuz olduğu için storyboardun ne olduğunu  yazma gereği duydum. storyboard animasyonculara yabancı gelmeyen bir kelime. timeline nın bütünlüğü bozmayan her parcasına storyboard denir aynı zamanda işin başlamadan önce gidişadının planlanması anlamına gelir.  wpfte de storyboard yine bu anlamda kullanılmıştır  Her KeyFrame kendisinden önceki KeyTime ile kendisi arasındaki fark ile Valuelar arasındaki farkı oranlayıp o oranda  son haliyle değiştirmeyi dener.  Flash ile uğraşan arkadaşlarımız Expression Blend Programını cok rahat kullanabileceklerdir. ve bu terimlere hiç yabancı kalmayacaklardır. KeyFrame Tween TimeLine,RenderTransform,Scale  vs..

Örnek bir StoryBoard : http://www.tufyta.com/donme-efekti

StoryBoard Nedir ?
yine son çalışmamda kullandığım bir storyboard bu da . hemen hemen her elemanıda olan Opacity ve RenderTransform propertileri için çalışabilecek bu storyboarduben gridvieW için yazdım. istediğiniz gibi düzenleyebiliriniz. 

    

<Storyboard x:Key=”gridCevir”>
<DoubleAnimationUsingKeyFrames BeginTime=”00:00:00″ Storyboard.TargetName=”gridColumnView” Storyboard.TargetProperty=”(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleX)”> 
<SplineDoubleKeyFrame KeyTime=”00:00:01″ Value=”-1.006″/> 
<SplineDoubleKeyFrame KeyTime=”00:00:02″ Value=”1.008″/> 
</DoubleAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames BeginTime=”00:00:00″ Storyboard.TargetName=”gridColumnView” Storyboard.TargetProperty=”(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)”>
<SplineDoubleKeyFrame KeyTime=”00:00:01″ Value=”-3.907″/> <SplineDoubleKeyFrame KeyTime=”00:00:02″ Value=”-1.564″/> </DoubleAnimationUsingKeyFrames>  <DoubleAnimationUsingKeyFrames BeginTime=”00:00:00″ Storyboard.TargetName=”gridColumnView” Storyboard.TargetProperty=”(UIElement.Opacity)”>

<SplineDoubleKeyFrame KeyTime=”00:00:01″ Value=”0.19″/>
<SplineDoubleKeyFrame KeyTime=”00:00:02″ Value=”1″/>
</DoubleAnimationUsingKeyFrames>
</Storyboard> 
  
 

 
 
 

 

 

ilk doubleanimation örneğimiz en sık kullanacağımız propertylerden biri olan Opacity üzerine olacak.

Goster() ve Gizle() fonksiyonlarımız pencere opaklığının azalarak yok olmasını ve çoğalarak görünmesini sağlayabilecek 2 fonksiyon olacak.

0
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
  public void Gizle(int seconds)
        {
            if (!this.AllowsTransparency)
                this.AllowsTransparency = true;
            DoubleAnimation gizleAnimation = new DoubleAnimation(1, 0, new Duration(TimeSpan.FromSeconds(seconds)));
            this.BeginAnimation(OpacityProperty, gizleAnimation);
 
        }
 
        public void Goster(int seconds)
        {
            if (!this.AllowsTransparency)
                this.AllowsTransparency = true;
            DoubleAnimation gosterAnimation = new DoubleAnimation(0, 1, new Duration(TimeSpan.FromSeconds(seconds)));
            this.BeginAnimation(OpacityProperty, gosterAnimation);
        }

gösterimin süreceği aralık (Duration) u saniye cinsiden belirleyip Window türünden bir elemanı opaklık efektiyle gösterip gizleyebiliriz.  iyi çalışmalar

© 2012 Tufan Suffusion theme by Sayontan Sinha