Stop WPF animation, storyboard begin in xaml but stopping it in codebehind?
Solution 1
I am thankful for Timothy for giving nice Idea. Here I am posting my working code
/*create this resources as global to that perticular xaml. Need not to be put it in App.xaml
MyControl could be Window or Page or UserControl */
<MyControl.Resources>
<Storyboard x:Key="MovingServer" Storyboard.TargetName="MyImage" RepeatBehavior="Forever" >
<DoubleAnimation Storyboard.TargetProperty="(Canvas.Left)" Duration="0:0:2" From="30" To="300" BeginTime="0:0:0" />
<DoubleAnimation Storyboard.TargetProperty="(Canvas.Left)" Duration="0:0:5" From="300" To="300" BeginTime="0:0:5" />
<DoubleAnimation Storyboard.TargetProperty="(Canvas.Left)" Duration="0:0:2" From="300" To="600" BeginTime="0:0:7" />
<DoubleAnimation Storyboard.TargetProperty="Opacity" Duration="0:0:2" From="1" To="0" BeginTime="0:0:7" />
</Storyboard>
</MyControl.Resources>
/* <!-- Now use those animation resources, the place where you want. You can use it as static resource and begin stop animation from code behind OR use it as trigger event --> */
/* <!-- Static resources--> */
<Canvas>
<Image Canvas.Left="0" Canvas.Top="-2" Height="32" Name="MyImage" Width="32" Source="/CCTrayHelper;component/Images/ServerIcon.png" Visibility="Hidden"/>
<Canvas.Resources>
<BeginStoryboard x:Key="serverAnimate" Storyboard="{StaticResource MovingServer}" />
</Canvas.Resources>
</Canvas>
<Button x:Name="ScanButton" onClick="Scanbutton_Click" />
/* ****************************************************************** */
/* Code behind to start/stop animation*/
//Get the resource value first on current object, so that when you start/stop the animation, it work only on current object
Storyboard sbImageAnimate = (Storyboard)this.ServerView.FindResource("MovingServer");
//Start the animation on Button Click
protected void Scanbutton_Click(object Sender, EventArgs e)
{
this.MyImage.Visibility = System.Windows.Visibility.Visible;
sbImageAnimate.Begin();
}
//Stop animation on my own even. You can use it on any event
private void EventPublisher_OnFinish(object sender, EventArgs args)
{
Dispatcher.Invoke(DispatcherPriority.Normal, (Action)delegate() { this.StopScanningAnimation(); });
}
private void StopScanningAnimation()
{
sbImageAnimate.Stop();
this.MyImage.Visibility = System.Windows.Visibility.Hidden;
}
Solution 2
Define the storyboard as a static resource,
<MyControl.Resources>
<Storyboard Key="MovingServer" Storyboard.TargetName="ImageMove" RepeatBehavior="Forever" >
<DoubleAnimation Storyboard.TargetProperty="(Canvas.Left)" Duration="0:0:2" From="30" To="300" BeginTime="0:0:0" />
<DoubleAnimation Storyboard.TargetProperty="(Canvas.Left)" Duration="0:0:5" From="300" To="300" BeginTime="0:0:5" />
<DoubleAnimation Storyboard.TargetProperty="(Canvas.Left)" Duration="0:0:2" From="300" To="600" BeginTime="0:0:7" />
<DoubleAnimation Storyboard.TargetProperty="Opacity" Duration="0:0:2" From="1" To="0" BeginTime="0:0:7" />
</Storyboard>
</MyControl.Resources>
and reference it from your backend code as follows :
StoryBoard board = (StoryBoard)this.FindResource("MovingServer");
board.stop();
start the animation from the 'click' event of the button (i don't know if you defined in xaml, but here's how it would be done if you did)
<Button x:Name="ScanButton" onClick="Scanbutton_Click"></button>
protected void Scanbutton_Click(object Sender, EventArgs e)
{
StoryBoard board = (StoryBoard)this.FindResource("MovingServer");
board.start();
}
Solution 3
I solve the problem with using the Stop()
method of Storyboard class like this
myStoryBoard.Stop(this.LayoutRoot);
with this solution you don't have to declare Storyboard at the resource.
Related videos on Youtube
Comments
-
PawanS over 3 years
I created an animation storyboard in xaml file. That story board begins on Button.Click. But to stop the animation I am trying to stop storyboard on my custom event in code behind. The code is not throwing any exception but When my event got fired the animation still goes continue.
I think the issue is with the Stop method. Stop required the same object that begins the animation to stop it. But here the storyboard is begin in WPF xaml and I am stopping it in code behind.
Any Solution, how to get Xaml object in code behind or Any alternative solution for this??
XAML CODE:
<Canvas.Triggers> <EventTrigger RoutedEvent="Button.Click" SourceName="ScanButton"> <EventTrigger.Actions> <BeginStoryboard > <Storyboard Name="MovingServer" Storyboard.TargetName="ImageMove" RepeatBehavior="Forever" > <DoubleAnimation Storyboard.TargetProperty="(Canvas.Left)" Duration="0:0:2" From="30" To="300" BeginTime="0:0:0" /> <DoubleAnimation Storyboard.TargetProperty="(Canvas.Left)" Duration="0:0:5" From="300" To="300" BeginTime="0:0:5" /> <DoubleAnimation Storyboard.TargetProperty="(Canvas.Left)" Duration="0:0:2" From="300" To="600" BeginTime="0:0:7" /> <DoubleAnimation Storyboard.TargetProperty="Opacity" Duration="0:0:2" From="1" To="0" BeginTime="0:0:7" /> </Storyboard> </BeginStoryboard> </EventTrigger.Actions> </EventTrigger>
Code Behind:
private void EventPublisher_OnScanningFinish(object sender, EventArgs args) { Dispatcher.Invoke(DispatcherPriority.Normal, (Action)delegate() { this.StopScanningAnimation(); }); } private void StopScanningAnimation() { ServerView.StoryBoardServerScrolling.Stop(this); //---------- Not Working //this.ServerView.Server1Static.Visibility = System.Windows.Visibility.Hidden; //this.ServerView.Server2Static.Visibility = System.Windows.Visibility.Hidden; //this.ServerView.Server3Scrolling.Visibility = System.Windows.Visibility.Hidden; //this.ServerView.SearchingGlass.Visibility = System.Windows.Visibility.Hidden; }
-
H.B. about 13 yearsDid you test this?
StaticResources
? Did you mean justResources
? What about thex:Key
? -
PawanS about 13 yearsI test for a sample code that works, but my current real code is too lengthy, so I am seaching for alternatives
-
Timothy Groote about 13 years@H.B. Sorry, can't test this code right now. you're right with the StaticResources, it should be 'resources', i'll change it right now. The x:Key ; the 'x:' portion is optional
-
H.B. about 13 yearsJust meant to point to the fact that you need to add a key instead of the name. Also: I had the same idea and tried it, does not seem to stop the animation either.
-
PawanS about 13 years@ I tried with windows resource... This not working... K Update it
-
PawanS about 13 years@ Tim I did that, Actually I was getting error on FindResource. But I solved this
-
Timothy Groote over 10 yearsGood to hear! sorry i wasn't available to help with that, but i'm glad you sorted it out!
-
Sonhja over 9 yearsIn able to do so, when you start the animation you must set the second parameter to true: Begin(DependencyObject..., allowsModification).