C# WPF 停止故事板
C# WPF Stop Storyboard
我正在为老虎机编程。为了旋转轮子,我有如下动画:
<Border Height="300" Margin="68,434,1506,335">
<Border.Triggers>
<EventTrigger RoutedEvent="Loaded">
<BeginStoryboard >
<Storyboard Name="stb">
<RectAnimation Storyboard.TargetProperty="Background.(ImageBrush.Viewport)"
To="0,0,1,1" RepeatBehavior="Forever" />
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Border.Triggers>
<Border.Background>
<VisualBrush TileMode="Tile" Viewport="0,1,1,1">
<VisualBrush.Visual>
<StackPanel>
<Image Source="test.jpg"></Image>
<Image Source="test.jpg"></Image>
<Image Source="test.jpg"></Image>
</StackPanel>
</VisualBrush.Visual>
</VisualBrush>
</Border.Background>
</Border>
<Button Name="cmdStop"/>
我如何 start/stop 从代码隐藏?感谢您的帮助。
编辑
我想让它通过按钮启动/停止,而不是在加载页面时。我该如何解决这个问题?
问题是按钮应该在边框之外...我如何访问按钮?
一般来说,您可以 start/stop 使用故事板对象的开始和停止方法制作故事板。
在你的例子中应该是 stb.Start() 或 stb.Stop()
你试过暂停动画吗?
找到了一个很好的例子 here,当您想从代码隐藏中暂停它时,请使用 DataTrigger
而不是 EventTrigger
。
也许您也对 "Triple the speed of the Storyboard" 感兴趣。
编辑
您的问题 "I want to it to start / stop with a button not when a page is loaded. how can i solve this ?" 无法回答,因为当页面(边框?)未加载时,动画无法 运行。我建议隐藏 Page/Border 并仅在动画暂停时使其可见。
我摆弄了一下,试图用可见性解决它
<!-- This Border is animated. -->
<Border Height="300" Margin="68,434,1506,335" >
<Border.Style>
<Style TargetType="{x:Type Border}">
<!-- Here is your animation -->
<Style.Triggers>
<EventTrigger RoutedEvent="Border.Loaded">
<BeginStoryboard Name="RandomStoryboard">
<Storyboard >
<RectAnimation Storyboard.TargetProperty="Background.(ImageBrush.Viewport)"
To="0,0,1,1" RepeatBehavior="Forever" />
</Storyboard>
</BeginStoryboard>
<!-- Stop the animation at the Start -->
<PauseStoryboard BeginStoryboardName="RandomStoryboard" />
</EventTrigger>
<!-- Control the animation according to the Togglebutton State -->
<DataTrigger Binding="{Binding Path=IsChecked, ElementName=SpinControl}" Value="True">
<DataTrigger.EnterActions>
<ResumeStoryboard BeginStoryboardName="RandomStoryboard" />
</DataTrigger.EnterActions>
<DataTrigger.ExitActions>
<PauseStoryboard BeginStoryboardName="RandomStoryboard" />
</DataTrigger.ExitActions>
<!-- Hide the Border while the animation is running -->
<Setter Property="Border.Visibility" Value="Hidden"/>
</DataTrigger>
</Style.Triggers>
</Style>
</Border.Style>
</Border>
<!-- This Button Controls the Animated Border -->
<ToggleButton Name="SpinControl">
<ToggleButton.Style>
<Style TargetType="{x:Type ToggleButton}">
<Setter Property="Content" Value="Start"/>
<Style.Triggers>
<Trigger Property="IsChecked" Value="True">
<Setter Property="Content" Value="Stop"/>
</Trigger>
</Style.Triggers>
</Style>
</ToggleButton.Style>
</ToggleButton>
注意:ToggleButton
的 Style
部分是可选的,它仅将 Content
从开始更改为停止(反之亦然)。
注意2:不要忘记在Border中插入你的VisualBrush
,否则动画无法识别。
我正在为老虎机编程。为了旋转轮子,我有如下动画:
<Border Height="300" Margin="68,434,1506,335">
<Border.Triggers>
<EventTrigger RoutedEvent="Loaded">
<BeginStoryboard >
<Storyboard Name="stb">
<RectAnimation Storyboard.TargetProperty="Background.(ImageBrush.Viewport)"
To="0,0,1,1" RepeatBehavior="Forever" />
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Border.Triggers>
<Border.Background>
<VisualBrush TileMode="Tile" Viewport="0,1,1,1">
<VisualBrush.Visual>
<StackPanel>
<Image Source="test.jpg"></Image>
<Image Source="test.jpg"></Image>
<Image Source="test.jpg"></Image>
</StackPanel>
</VisualBrush.Visual>
</VisualBrush>
</Border.Background>
</Border>
<Button Name="cmdStop"/>
我如何 start/stop 从代码隐藏?感谢您的帮助。
编辑
我想让它通过按钮启动/停止,而不是在加载页面时。我该如何解决这个问题? 问题是按钮应该在边框之外...我如何访问按钮?
一般来说,您可以 start/stop 使用故事板对象的开始和停止方法制作故事板。
在你的例子中应该是 stb.Start() 或 stb.Stop()
你试过暂停动画吗?
找到了一个很好的例子 here,当您想从代码隐藏中暂停它时,请使用 DataTrigger
而不是 EventTrigger
。
也许您也对 "Triple the speed of the Storyboard" 感兴趣。
编辑 您的问题 "I want to it to start / stop with a button not when a page is loaded. how can i solve this ?" 无法回答,因为当页面(边框?)未加载时,动画无法 运行。我建议隐藏 Page/Border 并仅在动画暂停时使其可见。
我摆弄了一下,试图用可见性解决它
<!-- This Border is animated. -->
<Border Height="300" Margin="68,434,1506,335" >
<Border.Style>
<Style TargetType="{x:Type Border}">
<!-- Here is your animation -->
<Style.Triggers>
<EventTrigger RoutedEvent="Border.Loaded">
<BeginStoryboard Name="RandomStoryboard">
<Storyboard >
<RectAnimation Storyboard.TargetProperty="Background.(ImageBrush.Viewport)"
To="0,0,1,1" RepeatBehavior="Forever" />
</Storyboard>
</BeginStoryboard>
<!-- Stop the animation at the Start -->
<PauseStoryboard BeginStoryboardName="RandomStoryboard" />
</EventTrigger>
<!-- Control the animation according to the Togglebutton State -->
<DataTrigger Binding="{Binding Path=IsChecked, ElementName=SpinControl}" Value="True">
<DataTrigger.EnterActions>
<ResumeStoryboard BeginStoryboardName="RandomStoryboard" />
</DataTrigger.EnterActions>
<DataTrigger.ExitActions>
<PauseStoryboard BeginStoryboardName="RandomStoryboard" />
</DataTrigger.ExitActions>
<!-- Hide the Border while the animation is running -->
<Setter Property="Border.Visibility" Value="Hidden"/>
</DataTrigger>
</Style.Triggers>
</Style>
</Border.Style>
</Border>
<!-- This Button Controls the Animated Border -->
<ToggleButton Name="SpinControl">
<ToggleButton.Style>
<Style TargetType="{x:Type ToggleButton}">
<Setter Property="Content" Value="Start"/>
<Style.Triggers>
<Trigger Property="IsChecked" Value="True">
<Setter Property="Content" Value="Stop"/>
</Trigger>
</Style.Triggers>
</Style>
</ToggleButton.Style>
</ToggleButton>
注意:ToggleButton
的 Style
部分是可选的,它仅将 Content
从开始更改为停止(反之亦然)。
注意2:不要忘记在Border中插入你的VisualBrush
,否则动画无法识别。