给 ListBox 的 DataTemplate 模板中的 元素设置动画
生活随笔
收集整理的這篇文章主要介紹了
给 ListBox 的 DataTemplate 模板中的 元素设置动画
小編覺得挺不錯的,現(xiàn)在分享給大家,幫大家做個參考.
首先定義模板:
<DataTemplate x:Key="ItemTemplate"><Grid Width="470" Margin="0,30,0,0" Tap="Grid_Tap" x:Name="grid"><Grid.ColumnDefinitions><ColumnDefinition Width="370"/><ColumnDefinition Width="100"/></Grid.ColumnDefinitions><Grid.RowDefinitions><RowDefinition Height="60"/><RowDefinition Height="Auto"/><RowDefinition Height="25" /></Grid.RowDefinitions><TextBlock Text="{Binding comments_count}" Width="41" Margin="60,18,0,-4" HorizontalAlignment="Left" Foreground="#FFABD623"/><!--<TextBlock Text="{Binding created_time}" Margin="8,34,145,0" VerticalAlignment="Top" Grid.Row="0"/>--><CheckBox IsChecked="{Binding has_uped, Mode=TwoWay}" Margin="0,8,85,-37" Content="has_uped" Visibility="Collapsed" HorizontalAlignment="Right" Width="63"/><Image Source="{Binding img_url}" Margin="0,20,0,0" Grid.Row="1" VerticalAlignment="Top" Grid.Column="1" HorizontalAlignment="Left" Height="90" Width="90"/><CheckBox IsChecked="{Binding is_break, Mode=TwoWay}" Margin="0,8,-15,0" VerticalAlignment="Top" HorizontalAlignment="Right" Width="66" Content="is_break" Visibility="Collapsed"/><TextBlock Text="{Binding title}" TextWrapping="Wrap" Margin="0,1,0,0" Grid.Row="1" HorizontalAlignment="Left" VerticalAlignment="Top" Foreground="White"/><TextBlock Text="{Binding url}" Grid.Row="2" Margin="60,-4,38,4" Grid.ColumnSpan="2" d:LayoutOverrides="GridBox" Foreground="#FF956020"/><TextBlock HorizontalAlignment="Left" Margin="0,19,0,-1" TextWrapping="Wrap" Text="評論數(shù):" Width="56" FontSize="16" Foreground="#FFABD623"/><TextBlock HorizontalAlignment="Left" Grid.Row="2" TextWrapping="Wrap" Text="網(wǎng)址:" FontSize="16" Foreground="#FF956020" /><Button Content="查看評論" Margin="80,2,152,-1" Style="{StaticResource ButtonStyle}" Tap="Button_Tap"/><!--<TextBlock Grid.Column="1" TextWrapping="Wrap" Text="頂:" Foreground="#FFABD623" Height="56" Padding="15,13,0,0" Margin="0,2,10,2" Tap="TxtbUps_Tap"><Run Text="{Binding ups}"/> </TextBlock>--><Button Grid.Column="1" BorderBrush="{x:Null}" Tap="TxtbUps_Tap"><Button.Resources><Storyboard x:Name="AddOneStoBoard"><DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="image"><EasingDoubleKeyFrame KeyTime="0" Value="0.01"/><EasingDoubleKeyFrame KeyTime="0:0:1" Value="1"/><EasingDoubleKeyFrame KeyTime="0:0:2" Value="0.01"/></DoubleAnimationUsingKeyFrames><DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" Storyboard.TargetName="image"><EasingDoubleKeyFrame KeyTime="0" Value="0"/><EasingDoubleKeyFrame KeyTime="0:0:1" Value="-270.5"/><EasingDoubleKeyFrame KeyTime="0:0:2" Value="0"/></DoubleAnimationUsingKeyFrames><DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateY)" Storyboard.TargetName="image"><EasingDoubleKeyFrame KeyTime="0" Value="0"/><EasingDoubleKeyFrame KeyTime="0:0:1" Value="100"/><EasingDoubleKeyFrame KeyTime="0:0:2" Value="0"/></DoubleAnimationUsingKeyFrames><DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleX)" Storyboard.TargetName="image"><EasingDoubleKeyFrame KeyTime="0" Value="1"/><EasingDoubleKeyFrame KeyTime="0:0:1" Value="100"/><EasingDoubleKeyFrame KeyTime="0:0:2" Value="1"/></DoubleAnimationUsingKeyFrames><DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleY)" Storyboard.TargetName="image"><EasingDoubleKeyFrame KeyTime="0" Value="1"/><EasingDoubleKeyFrame KeyTime="0:0:1" Value="100"/><EasingDoubleKeyFrame KeyTime="0:0:2" Value="1"/></DoubleAnimationUsingKeyFrames></Storyboard></Button.Resources><Grid><Grid.ColumnDefinitions><ColumnDefinition Width="Auto"/><ColumnDefinition Width="Auto"/><ColumnDefinition Width="Auto"/></Grid.ColumnDefinitions><TextBlock Text="頂:" FontSize="16" Grid.Column="0"/><TextBlock Text="{Binding ups}" FontSize="16" Grid.Column="1"/></Grid></Button><Image x:Name="image" Source="images/+1.png" Grid.Column="2" Stretch="Fill" Width="1" Height="1" RenderTransformOrigin="0.5,0.5"><Image.RenderTransform><CompositeTransform/></Image.RenderTransform></Image><TextBlock Margin="0,19,0,8" TextWrapping="Wrap" Text="{Binding created_time,Converter={StaticResource LongToTimeSpanConverter}}" Foreground="#FFCECACA" FontSize="16" HorizontalAlignment="Right" Width="184"/></Grid></DataTemplate>
在 codebehind 頁面中捕獲sender,并播放動畫
點擊按鈕后,動畫播放。
轉載于:https://www.cnblogs.com/hebeiDGL/archive/2012/04/11/2442207.html
總結
以上是生活随笔為你收集整理的给 ListBox 的 DataTemplate 模板中的 元素设置动画的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: [转载]ubuntu 12.10 软件源
- 下一篇: Custom PuTTY Color T