storyboard is not working - wpf

Question

I'm trying to rotate Arrow according to angle which is determined by a random number.
the arrow angle does change but the animation is not working.
<Grid>
<ed:BlockArrow x:Name="blockArrow" Fill="Black" HorizontalAlignment="Left" Height="13.299" Orientation="Left" Stroke="Black" VerticalAlignment="Top" Width="100" Margin="84.571,165.951,0,0" RenderTransformOrigin="1,0.5">
<ed:BlockArrow.RenderTransform>
<TransformGroup>
<ScaleTransform/>
<SkewTransform/>
<RotateTransform x:Name="ArrowTransform" Angle="{Binding ElementName=MeterValueTextBox, Path=Text}" />
<TranslateTransform/>
</TransformGroup>
</ed:BlockArrow.RenderTransform>
</ed:BlockArrow>
<Ellipse Fill="Black" HorizontalAlignment="Left" Height="25" Stroke="Black" VerticalAlignment="Top" Width="25" Margin="172.865,159.568,0,0"/>
<TextBlock
Text="Type value:"
FontSize="16"
HorizontalAlignment="Left"
VerticalAlignment="Top"
Margin="57.976,245.873,0,0"
/>
<TextBox
x:Name="MeterValueTextBox"
HorizontalAlignment="Left"
VerticalAlignment="Top"
Width="100"
Margin="140,245.873,0,0"
Text="{Binding Meter, UpdateSourceTrigger=PropertyChanged}"
>
<TextBox.Triggers>
<EventTrigger RoutedEvent="TextBox.TextChanged">
<BeginStoryboard>
<Storyboard>
<DoubleAnimation
Storyboard.TargetName="ArrowTransform"
Storyboard.TargetProperty="(RotateTransform.Angle)"
From="{Binding OldMeterValue}" To="{Binding Meter}" Duration="0:0:0:1"
/>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</TextBox.Triggers>
</TextBox>
</Grid>
and the view model is:
public class MainViewModel : ViewModelBase
{
private float _meter;
public float Meter
{
get { return _meter; }
set
{
if (!Equals(_meter, value))
{
OldMeterValue = _meter;
_meter = value;
OnPropertyChanged();
}
}
}
private float _oldMeterValue;
public float OldMeterValue
{
get { return _oldMeterValue; }
set
{
if (_oldMeterValue != value)
{
_oldMeterValue = value;
OnPropertyChanged();
}
}
}
public MainViewModel()
{
DisplayName = "Benchmark Application";
OldMeterValue = 0;
Meter = 0;
var meterTimer = new Timer
{
Interval = 1000
};
meterTimer.Elapsed += MeterTimerOnElapsed;
meterTimer.Start();
}
private void MeterTimerOnElapsed(object sender, ElapsedEventArgs elapsedEventArgs)
{
var randomNumber = new Random();
var meterValue = randomNumber.Next(0, 180);
Meter = meterValue;
}
}
as for now, the arrow bounces from old value to new value but without animation.
please assist...

Answer 1

Duration property of your animation seems too fast (one milisecond??). Try to set it to a greater value to make it obvious, for example, 5 seconds :
<DoubleAnimation
Storyboard.TargetName="ArrowTransform"
Storyboard.TargetProperty="(RotateTransform.Angle)"
From="{Binding OldMeterValue}" To="{Binding Meter}" Duration="0:0:5"
/>
[Reference]