
某天国.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 件のコメント :
コメントを投稿