
某天国.xaml より(わかりやすいように背景のみにしています)
元ネタ Rainbow color Animation by GradientStops[index].offset : Color « Windows Presentation Foundation « VB.Net Tutorial
<Rectangle Margin="15,50,15,15"> <Rectangle.Fill> <LinearGradientBrush x:Name="brush"> <LinearGradientBrush.GradientStops> <GradientStop Color="Red"/> <GradientStop Color="Orange"/> <GradientStop Color="Yellow"/> <GradientStop Color="Green"/> <GradientStop Color="Blue"/> <GradientStop Color="Indigo"/> <GradientStop Color="Violet"/> </LinearGradientBrush.GradientStops> </LinearGradientBrush> </Rectangle.Fill> <Rectangle.Triggers> <EventTrigger RoutedEvent="Rectangle.Loaded"> <BeginStoryboard> <Storyboard SpeedRatio="3" TargetName="brush"> <DoubleAnimation Duration="0:0:7" RepeatBehavior="Forever" Storyboard.TargetProperty="GradientStops[0].Offset" To="1"/> <DoubleAnimation BeginTime="0:0:1" Duration="0:0:7" RepeatBehavior="Forever" Storyboard.TargetProperty="GradientStops[1].Offset" To="1"/> <DoubleAnimation BeginTime="0:0:2" Duration="0:0:7" RepeatBehavior="Forever" Storyboard.TargetProperty="GradientStops[2].Offset" To="1"/> <DoubleAnimation BeginTime="0:0:3" Duration="0:0:7" RepeatBehavior="Forever" Storyboard.TargetProperty="GradientStops[3].Offset" To="1"/> <DoubleAnimation BeginTime="0:0:4" Duration="0:0:7" RepeatBehavior="Forever" Storyboard.TargetProperty="GradientStops[4].Offset" To="1"/> <DoubleAnimation BeginTime="0:0:5" Duration="0:0:7" RepeatBehavior="Forever" Storyboard.TargetProperty="GradientStops[5].Offset" To="1"/> <DoubleAnimation BeginTime="0:0:6" Duration="0:0:7" RepeatBehavior="Forever" Storyboard.TargetProperty="GradientStops[6].Offset" To="1"/> </Storyboard> </BeginStoryboard> </EventTrigger> </Rectangle.Triggers> </Rectangle>コピペコードですが スキンロード時に タイミングをずらしながら7色の基準位置を変更するアニメーションを開始して 虹スクロールするようになっています
そのため最初は単色なのと 左右両端で色が変わる時に ちょっと期待(画像を無限スクロールするようなイメージ)と違う動作になっていますが まあそんなに目立たないでしょう
単独で使う場合は何か他の方法がいいかもしれませんが 思いついていませんw
EventTrigger と Storyboard は非常に強力なので何かいいアイデアを思いついたら どんどん活用したいですね
0 件のコメント :
コメントを投稿