我有一个网格,其可见性绑定到我的视图模型中的属性。这一切都工作正常——网格正确地出现/消失。我的问题是,如何应用过渡,以便网格内容滑入 UI 边缘,而不是立即从屏幕上消失?当它可见时,它应该再次滑出。
<Grid Grid.Row="0" Grid.RowSpan="2"
Grid.Column="0"
Margin="30,30,0,30"
Visibility="{Binding IsSearchEnabled, Converter={StaticResource visibilityConverter}}">
<Grid.RowDefinitions>
<RowDefinition Height="60"></RowDefinition>
<RowDefinition Height="*"></RowDefinition>
</Grid.RowDefinitions>
...
作为一个简单的例子,一种方法是:
<Grid Grid.RowSpan="2" x:Name="TheGrid"
Margin="30,30,0,30"
Visibility="{Binding IsSearchEnabled, Converter={StaticResource visibilityConverter}}">
<Grid.RowDefinitions>
<RowDefinition Height="60"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<!-- Start the magic -->
<Grid.RenderTransform>
<TranslateTransform x:Name="SlideIn" X="750" />
</Grid.RenderTransform>
<Grid.Triggers>
<EventTrigger RoutedEvent="Grid.Loaded">
<BeginStoryboard>
<Storyboard>
<DoubleAnimationUsingKeyFrames Storyboard.TargetName="SlideIn" Storyboard.TargetProperty="X">
<SplineDoubleKeyFrame KeyTime="0:0:1.25" Value="0" />
</DoubleAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Storyboard.TargetName="TheGrid" Storyboard.TargetProperty="Opacity">
<SplineDoubleKeyFrame KeyTime="0:0:1.55" Value="1" />
</DoubleAnimationUsingKeyFrames>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Grid.Triggers>
</Grid>
这会在加载时将其滑入,甚至在加载时淡入。您可能需要使用 SlideIn 上的“X”值才能根据您的喜好将其从屏幕上移开。您可以将其反转到另一个方向。
希望这可以帮助。
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)