Question

我正在创建一个过渡效果，可以滑动2个面板（从一侧到另一侧）。

我的计划是有一个网格，窗口的宽度乘以2通过数据绑定，除以2得到2个面板，然后将网格放入其中（所以我将有2个面板用自己的网格平分，你一次只能看到其中一个。现在只需要用动画移动根网格来创建过渡效果。）

所以我试图将Grid的宽度数据绑定到窗口的宽度乘以2（正如我上面用粗体写的那样），但我不知道如何修改数据绑定，并让它不断更新。所以，如果可能的话 - 你是怎么做到的？

我想我可以用事件来做（就像在任何其他.NET应用程序中一样），但这只是错误来临和恶化的更多机会（即我会错过的事件）;所以我真的很感激一个好的和干净的解决方案。

顺便说一句，如果您有更好的转换方式，请在评论中告诉我。我的思想仍然是开放的想法。 谢谢！

Answer 1

我做到了。就像这样：

<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition Width="0" />

<Grid x:Name="Panel1" />
<Grid x:Name="Panel2"/>
</Grid>

现在，这是横向滚动，但重点是相同的。你所做的只是将RenderTransform.TranslateTransform动画应用于Panel2，你将X从0动画到Panel2宽度，基本上它将完全关闭，之后你只需将Panel2 Column设置为“1”。

我明天也可以给你一些代码示例，但是你可以开始了。

当用户切换按钮时，这是用于处理slide2slide动画的Xaml。

    <Grid.Triggers>
<EventTrigger RoutedEvent="ToggleButton.Checked" SourceName="workingPlanButton">
<BeginStoryboard>
<Storyboard Completed="Storyboard_Completed">

<DoubleAnimationUsingKeyFrames BeginTime="00:00:0.1"
                              Duration="0:0:00.5"
                              Storyboard.TargetName="lsView"
                              Storyboard.TargetProperty="RenderTransform.(TranslateTransform.Y)"
                              Timeline.DesiredFrameRate="30">
<LinearDoubleKeyFrame KeyTime="00:00:00.3" Value="{Binding ElementName=bodyGrid, Path=ActualHeight}" />
</DoubleAnimationUsingKeyFrames>


<!--  Hide the panel  -->
<ObjectAnimationUsingKeyFrames BeginTime="0:0:0.5"
                              Storyboard.TargetName="lsView"
                              Storyboard.TargetProperty="Visibility"
                              Timeline.DesiredFrameRate="30">
<DiscreteObjectKeyFrame Value="{x:Static Visibility.Hidden}" />
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</BeginStoryboard>
</EventTrigger>

现在是实际网格：

<Grid x:Name="bodyGrid" Grid.Row="1">

<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="1" />
</Grid.RowDefinitions>
<StudyPlan:StudyPlanControl />
<local:LessonControl x:Name="lsView />
<local:LessonControl.RenderTransform>
<TranslateTransform Y="0" />
</local:LessonControl.RenderTransform>

</local:LessonControl>
</Grid>

修改数据绑定

1 个答案: