I am trying to mimic a game of bingo (lotto) and i am having problems with my display grid. The way i have done it is by showing a design for 1 - a number not called (notCalled) 2 - the number which is being called (myLabelJustCalled) 3 - numbers that have been called in the past. (myLabelCalled)
The issue of have is when the number is called i have animated it to spin in a circle however when it changes to the style 3 the next number (which should take on style 2) does not spin it freezes. I think i need to stop my storyboard and rerun it with the new label.
Hope this makes sense!
code attached:
<Label Name="labelNumber" Content="{Binding Number}" Height="50" Width="70"/>
<Style x:Key="numberDesign" TargetType="{x:Type Label}">
<Setter Property="Foreground" Value="Red"/>
</Style>
<Style x:Key="notCalled" TargetType="{x:Type Label}">
<Setter Property="Margin" Value="2,2,2,2"/>
<Setter Property="FontFamily" Value="Arial Black"/>
<Setter Property="Foreground" Value="Red"/>
<Setter Property="FontSize" Value="18"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Label}">
<Border BorderBrush="Red"
BorderThickness="2"
Background="Transparent"
CornerRadius="10">
<ContentPresenter
HorizontalAlignment="Center"
VerticalAlignment="Center"
/>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="myLabelJustCalled" TargetType="{x:Type Label}">
<Setter Property="Margin" Value="2,2,2,2"/>
<Setter Property="FontFamily" Value="Arial Black"/>
<Setter Property="FontSize" Value="18"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Label}">
<Border BorderBrush="Red"
BorderThickness="2"
Background="Blue"
CornerRadius="10">
<Canvas
x:Name="canvas2"
Height="50"
Width="70"
Visibility="Visible"
>
<Canvas.RenderTransform>
<RotateTransform x:Name="spin" Angle="90" CenterX="25" CenterY="25" />
</Canvas.RenderTransform>
<ContentPresenter
HorizontalAlignment="Center"
VerticalAlignment="Center"
Canvas.Top="13"
Canvas.Right="25"
Name="labelNumber"
/>
</Canvas>
</Border>
<ControlTemplate.Triggers>
<EventTrigger RoutedEvent="Canvas.LayoutUpdated">
<BeginStoryboard Name="myStoryBoard">
<Storyboard x:Name="spinningAnimation">
<DoubleAnimation
Storyboard.TargetName="canvas2"
Storyboard.TargetProperty="(Canvas.RenderTransform).(RotateTransform.Angle)"
From="0"
To="360"
SpeedRatio="1"
RepeatBehavior="Forever"
/>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="myLabelCalled" TargetType="{x:Type Label}">
<Setter Property="Margin" Value="2,2,2,2"/>
<Setter Property="VerticalContentAlignment" Value="Center"/>
<Setter Property="HorizontalContentAlignment" Value="Center"/>
<Setter Property="FontFamily" Value="Arial Black"/>
<Setter Property="FontSize" Value="18"/>
<Setter Property="Background" Value="Green"/>
</Style>