点滅するボタンを作っています。色は、グラデーションで、マウスオーバー時と通常時では、色が異なります。
今のままだと、0からマウスオーバーのアニメーションが開始してしまうため、点滅がずれてしまいます。5時間調べたのですが、もうお手上げです。
ノーマルのアニメーションの終了位置から開始して、点滅のずれをなくす方法はないでしょうか。
以下、現在のコードです。
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="False">
<Trigger.EnterActions>
<BeginStoryboard Name="AAA">
<Storyboard RepeatBehavior="Forever" AutoReverse="True" >
<ColorAnimation Storyboard.TargetName="border" Storyboard.TargetProperty="(Background).(LinearGradientBrush.GradientStops)[0].(GradientStop.Color)" To="#CCCCCC"
Duration="0:0:0.5" />
<ColorAnimation Storyboard.TargetName="border" Storyboard.TargetProperty="(Background).(LinearGradientBrush.GradientStops)[1].(GradientStop.Color)" To="#F0F0F0"
Duration="0:0:0.5" />
<ColorAnimation Storyboard.TargetProperty="Foreground.Color" To="#232323"
Duration="0:0:0.5" />
</Storyboard>
</BeginStoryboard>
</Trigger.EnterActions>
<Trigger.ExitActions>
<StopStoryboard BeginStoryboardName="AAA" />
</Trigger.ExitActions>
</Trigger>
<Trigger Property="IsMouseOver" Value="true">
<Setter Property="Background" TargetName="border" Value="{StaticResource Sample}" />
<Trigger.EnterActions>
<BeginStoryboard Name="BBB">
<Storyboard RepeatBehavior="Forever" AutoReverse="True">
<ColorAnimation Storyboard.TargetName="border" Storyboard.TargetProperty="(Background).(LinearGradientBrush.GradientStops)[0].(GradientStop.Color)" To="#CCCCCC"
Duration="0:0:0.5" />
<ColorAnimation Storyboard.TargetName="border" Storyboard.TargetProperty="(Background).(LinearGradientBrush.GradientStops)[1].(GradientStop.Color)" To="#FAFAFA"
Duration="0:0:0.5" />
<ColorAnimation Storyboard.TargetProperty="Foreground.Color" To="#232323"
Duration="0:0:0.5" />
</Storyboard>
</BeginStoryboard>
</Trigger.EnterActions>
<Trigger.ExitActions>
<StopStoryboard BeginStoryboardName="BBB" />
</Trigger.ExitActions>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>

あなたの回答
tips
プレビュー