Silverlight 3: Error Button Loaded value is out of range

Silverlight 3: Error Button Loaded value is out of range

I am using Silverlight 3 - Visual studio 2010

I want animate button in Grid Load.

In Silverlight I am getting the error "Button Loaded value is out of range".

But the Same code is worked in WPF

To make this code to work in silverlight do i need to any change?

Please help.

<UserControl xmlns:data="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Data"  x:Class="DataGridEx1.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    d:DesignHeight="300" d:DesignWidth="400">
    
    <Grid x:Name="LayoutRoot" Background="White">
        <StackPanel>
            <data:DataGrid x:Name="dataGrid"  AutoGenerateColumns="False">
                <data:DataGrid.Columns>
                    <data:DataGridTextColumn Binding="{Binding ID}" Header="ID" IsReadOnly="True"></data:DataGridTextColumn>
                    <data:DataGridTextColumn Binding="{Binding Name}" Header="Job Name" IsReadOnly="True"></data:DataGridTextColumn>
                    <data:DataGridTemplateColumn Header="Job Status">
                        <data:DataGridTemplateColumn.CellTemplate>
                            <DataTemplate>
                                <Button VerticalAlignment="Center" Loaded="btnLayout_Loaded" Content="{Binding Des}" HorizontalAlignment="Left" Width="50" Height="20"  Name="btnLayout">
                                    <Button.RenderTransform>
                                        <RotateTransform Angle="180" />
                                    </Button.RenderTransform>
                                    <Button.Triggers>
                                        <EventTrigger RoutedEvent="Button.Loaded">
                                            <EventTrigger.Actions>
                                                <BeginStoryboard>
                                                    <Storyboard>
                                                        <DoubleAnimation Storyboard.TargetProperty="(Button.RenderTransform).(RotateTransform.Angle)"
                     From="0" To="180" Duration="0:0:2"  />
                                                    </Storyboard>
                                                </BeginStoryboard>
                                            </EventTrigger.Actions>
                                        </EventTrigger>
                                    </Button.Triggers>
                                </Button>
                            </DataTemplate>
                        </data:DataGridTemplateColumn.CellTemplate>
                    </data:DataGridTemplateColumn>
                </data:DataGrid.Columns>
            </data:DataGrid>
        </StackPanel>
    </Grid>
</UserControl>

Answers & Comments...

Answer: 1

Hi sekarcse,

As far as I know, Silverlight does not support Triggers like WPF does. You can perform the task in code behind, please try the code below:

 <data:DataGrid x:Name="dataGrid"  AutoGenerateColumns="False" ItemsSource="{Binding}" >                  <data:DataGrid.Columns>                      <data:DataGridTextColumn Binding="{Binding Age}" Header="ID" ></data:DataGridTextColumn>                      <data:DataGridTextColumn Binding="{Binding Name}" Header="Job Name" ></data:DataGridTextColumn>                                           <data:DataGridTemplateColumn Header="Job Status">                          <data:DataGridTemplateColumn.CellTemplate>                              <DataTemplate>                                  <Button VerticalAlignment="Center"  Content="{Binding Des}" HorizontalAlignment="Left" Width="50" Height="20" Foreground="Red"  Name="btnLayout" Loaded="btnLayout_Loaded" >                                      <Button.Resources>                                          <Storyboard x:Name="startstoryboard">                                              <DoubleAnimation Storyboard.TargetProperty="(Button.RenderTransform).(RotateTransform.Angle)" Storyboard.TargetName="btnLayout"                       From="0" To="180" Duration="0:0:2"  />                                            </Storyboard>                                      </Button.Resources>                                      <Button.RenderTransform>                                          <RotateTransform Angle="0" />                                      </Button.RenderTransform>                                  </Button>                              </DataTemplate>                          </data:DataGridTemplateColumn.CellTemplate>                      </data:DataGridTemplateColumn>                  </data:DataGrid.Columns>              </data:DataGrid>  

 private void btnLayout_Loaded(object sender, RoutedEventArgs e)          {              Button btn = sender as Button;              Storyboard startsb = btn.FindName("startstoryboard") as Storyboard;              startsb.Begin();                    }

 

PS: Please note the values of the bold property.

Best Regards,

Answer: 2

Here is article that shows Behaviors and Triggers, if it helps:

http://www.silverlightshow.net/items/Behaviors-and-Triggers-in-Silverlight-3.aspx

Answer: 3

Thanks Haixia for your reply

---