Automatically Begin Storyboard (C#)

Question

i want Storyboard automatically begin if something is changed :- E.g I have text block which can contain text "On" or "Off"

<TextBlock Name="BindedTextBlock" />

for checking text block text is on or off i created DispatcherTimer (Suggest me anyother way if which can check Text block text)

if textblock text is ON then NextStoryBoardIn.Begin(); should begin, if textblock text is OFF then PrevStoryBoardOut.Begin(); should begin. so i done this way:

DispatcherTimer timer = new DispatcherTimer { Interval = TimeSpan.FromSeconds(0) }; timer.Tick += delegate (object sender, object e) { if(BindedTextBlock.Text.Equals("On")) { PrevStoryBoardIn.Begin(); } else if(BindedTextBlock.Text.Equals("Off")) { PrevStoryBoardOut.Begin(); } }; timer.Start();

it works fine but storyboard triggers continuously, it should begin once. and if i write

if(BindedTextBlock.Text.Equals("On")) { PrevStoryBoardIn.Begin(); } else if(BindedTextBlock.Text.Equals("Off")) { PrevStoryBoardOut.Begin(); } timer.Stop();

then it will never check text block text again even if text block text if updated.

Update

if any one intrested in view Xaml codes for testing purpose , so i shared some sample of my xaml

<Page.Resources> <Storyboard x:Name="PrevStoryBoardIn"> <DoubleAnimation Storyboard.TargetName="AppearStackPanel" Storyboard.TargetProperty="Opacity" From="0" To="1" Duration="0:0:1"/> </Storyboard> <Storyboard x:Name="PrevStoryBoardOut"> <DoubleAnimation Storyboard.TargetName="AppearStackPanel" Storyboard.TargetProperty="Opacity" From="1" To="0" Duration="0:0:1"/> </Storyboard> </Page.Resources> <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"> <TextBlock x:Name="DogWatcherTextBlock" Height="50" Width="100" VerticalAlignment="Top"/> <StackPanel x:Name="AppearStackPanel" BorderThickness="1" BorderBrush="Crimson" Height="150" Width="150" Opacity="0" HorizontalAlignment="Center" VerticalAlignment="Center"> <!-- My Items --> </StackPanel> </Grid>

How do you can the TextBlock text?

Vijay Nirmal
– Vijay Nirmal

2017-10-22 06:50:37 +00:00
Commented Oct 22, 2017 at 6:50 — Vijay Nirmal
– Vijay Nirmal, Commented Oct 22, 2017 at 6:50

Vijay Nirmal · Accepted Answer · 2017-10-22 15:48:46Z

Using DispatcherTimer is not a good idea.

There is no TextChanged event for TextBlock. So we can create one and perform your task in it.

public MainPage() { this.InitializeComponent(); //Register PropertyChangedCallback MyTextBlock.RegisterPropertyChangedCallback(TextBlock.TextProperty, OnTextChanged); } private void OnTextChanged(DependencyObject sender, DependencyProperty dp) { if(((TextBlock)sender).Text == "On") PrevStoryBoardIn.Begin(); else if(((TextBlock)sender).Text == "Off") PrevStoryBoardOut.Begin(); }

i am getting error "OnTextChanged" does not exist in current context
@ArpitJain That's the point. You want to create it. Just copy past my code. It will work
@ArpitJain Make it as ((TextBlock)sender).Text. I have updated my answer.

Romasz · Accepted Answer · 2017-10-22 15:21:32Z

If you are playing with animations, consider doing it in XAML itself. There are plenty of options, not mentioning Behaviors. Take a look at this sample:

<Page.Resources> <local:EqualParamConverter x:Key="EqualParamConverter"/> </Page.Resources> <StackPanel Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"> <VisualStateManager.VisualStateGroups> <VisualStateGroup x:Name="TextStates"> <VisualState x:Name="Normal"/> <VisualState x:Name="OnState"> <Storyboard> <DoubleAnimation Duration="0:0:1" Storyboard.TargetName="myRectangle" Storyboard.TargetProperty="Opacity" To="1.0"/> </Storyboard> <VisualState.StateTriggers> <StateTrigger IsActive="{Binding ElementName=myTextBlck, Path=Text, Converter={StaticResource EqualParamConverter}, ConverterParameter='On'}"/> </VisualState.StateTriggers> </VisualState> <VisualState x:Name="OffState"> <Storyboard> <DoubleAnimation Duration="0:0:1" Storyboard.TargetName="myRectangle" Storyboard.TargetProperty="Opacity" To="0.5"/> </Storyboard> <VisualState.StateTriggers> <StateTrigger IsActive="{Binding ElementName=myTextBlck, Path=Text, Converter={StaticResource EqualParamConverter}, ConverterParameter='Off'}"/> </VisualState.StateTriggers> </VisualState> </VisualStateGroup> </VisualStateManager.VisualStateGroups> <TextBlock x:Name="myTextBlck" Text="Something"/> <Rectangle x:Name="myRectangle" Width="300" Height="100" Fill="Green" Opacity="0.75"/> <ToggleButton Content="Switcher" Click="ToggleButton_Click"/> </StackPanel>

Code behind:

public class EqualParamConverter : IValueConverter { public object Convert(object value, Type targetType, object parameter, string language) => value.ToString() == parameter.ToString(); public object ConvertBack(object value, Type targetType, object parameter, string language) => throw new NotImplementedException(); } public sealed partial class MainPage : Page { public MainPage() { this.InitializeComponent(); } private void ToggleButton_Click(object sender, RoutedEventArgs e) => myTextBlck.Text = (bool)(sender as ToggleButton).IsChecked ? "On" : "Off"; }

okay but i have a text block which will get text automatically either "On" or "Off" so app should aware of this text so story board begin accordingly as dispatcher time aware of this activity but it triggers storyboard continuously
in your example you are done this through toggle switch which can be easily done but i want it automatically trigger ,and i am ready to use either textblock or textbox which will help me to do this
@ArpitJain ToggleButton has nothing to do here, it only changes the value of TextBlock, which technically should be done via Binding. This is only short sample which shows how it can be done different way. Details of course depend on your needs.
okay okay let me check, but app will aware of this change not from that switch only from that textblock or textbox. okay wait checking

Link · Accepted Answer · 2017-10-22 07:29:10Z

You initialize your timer with TimeSpan.FromSeconds(0). So your Tick-callback will be called permanently.

One possible solution would be to have a viewmodel

First the ViewModel itself:

public class ViewModel : INotifyPropertyChanged { private bool _someVariable; public bool SomeVariable { get { return _someVariable; } set { //// simplified code _someVariable = value; PropertyChanged(this, new PropertyChangedEventArgs(nameof(SomeVariable))); SomeVariableChanged(this, EventArgs.Empty); } } public event EventHandler SomeVariableChanged = delegate { }; /// <summary> /// Needed for updating the binding /// </summary> public event PropertyChangedEventHandler PropertyChanged = delegate { }; }

And here the logic part. As you can see, you don't need a timer, which checks every x seconds if something changes.

var viewModel = new ViewModel(); _textBlock.DataContext = viewModel; //// Here you bind your viewmodel to the TextBlock viewModel.SomeVariableChanged += (s, e) => { if(viewModel.SomeVariable == true) { PrevStoryBoardIn.Begin(); } else { PrevStoryBoardOut.Begin(); } }

Now you can define a trigger or a converter to display "ON" or "OFF" depending on the value of your ViewModel.

If you want to read some more:

MVVC-Pattern from MSDN

Data-Bindings in UWP

Although this solves the problem, it does clutter the viewmodel, imagine there're lots of properties to track. Doesn't play well with separation of concerns.
This is a simplified example. Normally you have a presenter and the View just executes the action.

Collectives™ on Stack Overflow

Automatically Begin Storyboard (C#)

3 Answers 3

6 Comments

5 Comments

2 Comments

Linked

Hot Network Questions