有没有人能帮我在WPF DataGrid行打开和关闭时给它添加动画效果(例如,当行被选中时,幻灯片像手风琴一样打开,而当行未被选中时,幻灯片关闭)?我需要一个简单的概念证明。
提前感谢您的帮助:)
发布于 2011-04-07 21:43:19
冗长但有效:
<DataGrid.RowStyle>
<Style TargetType="{x:Type DataGridRow}">
<Setter Property="DetailsVisibility" Value="Collapsed"/>
<Style.Triggers>
<Trigger Property="IsSelected" Value="True">
<Trigger.EnterActions>
<BeginStoryboard>
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="DetailsVisibility">
<DiscreteObjectKeyFrame KeyTime="0:0:0" Value="{x:Static Visibility.Visible}"/>
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</BeginStoryboard>
</Trigger.EnterActions>
<Trigger.ExitActions>
<BeginStoryboard>
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="DetailsVisibility">
<DiscreteObjectKeyFrame KeyTime="0:0:0.4" Value="{x:Static Visibility.Collapsed}"/>
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</BeginStoryboard>
</Trigger.ExitActions>
</Trigger>
</Style.Triggers>
</Style>
</DataGrid.RowStyle>
<DataGrid.RowDetailsTemplate>
<DataTemplate>
<Grid>
<Grid.LayoutTransform>
<ScaleTransform ScaleY="0"/>
</Grid.LayoutTransform>
<Grid.Style>
<Style TargetType="Grid">
<Style.Triggers>
<DataTrigger Binding="{Binding IsSelected, RelativeSource={RelativeSource AncestorType=DataGridRow}}"
Value="True">
<DataTrigger.EnterActions>
<BeginStoryboard>
<Storyboard>
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="LayoutTransform.ScaleY">
<EasingDoubleKeyFrame KeyTime="0:0:0.4" Value="1">
<EasingDoubleKeyFrame.EasingFunction>
<CubicEase EasingMode="EaseInOut" />
</EasingDoubleKeyFrame.EasingFunction>
</EasingDoubleKeyFrame>
</DoubleAnimationUsingKeyFrames>
</Storyboard>
</BeginStoryboard>
</DataTrigger.EnterActions>
<DataTrigger.ExitActions>
<BeginStoryboard>
<Storyboard>
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="LayoutTransform.ScaleY">
<EasingDoubleKeyFrame KeyTime="0:0:0.4" Value="0">
<EasingDoubleKeyFrame.EasingFunction>
<CubicEase EasingMode="EaseInOut" />
</EasingDoubleKeyFrame.EasingFunction>
</EasingDoubleKeyFrame>
</DoubleAnimationUsingKeyFrames>
</Storyboard>
</BeginStoryboard>
</DataTrigger.ExitActions>
</DataTrigger>
</Style.Triggers>
</Style>
</Grid.Style>
<Grid.Children>
<TextBlock Text="Lorem ipsum dolor sit"/>
</Grid.Children>
</Grid>
</DataTemplate>
</DataGrid.RowDetailsTemplate>
编辑:通过在RowStyle
中手动处理DetailsVisibility
,返回动画现在也可以工作了。
请注意,一旦细节折叠,DataGrid的高度就不会收缩,这可能会有一点问题。这是VirtualizingStackPanel的一个已知问题,如果您负担得起,您可以将DataGrid.ItemsPanel
更改为正常的StackPanel (如果您有大量数据,这将大大减慢应用程序,因为每一行都将立即创建,即使不可见)。
还有:按下Ctrl +A非常有趣。
https://stackoverflow.com/questions/5587374
复制