Question

我正在寻找一些方法将故事板与XAML中的其他故事板结合起来。

在下面的示例中，Thing1和Thing2是两个分别从顶部和底部滑动到Canvas上的TextBlock。我打算只有一个，另一个，或者两者都不可见，所以我在VisualStateManager中设置了三个状态，在一个VisualStateGroup中，各种状态之间有Transitions。

我希望能够在其他更简单的故事板的上下文中为Thing1ToThing2和Thing2ToThing1编写故事板。例如，有没有办法让故事板Thing1ToThing2调用/调用/引用/由Thing1Out和Thing2In组成？当然，代码可以重复，但我们可以做得更好吗？或者，有没有办法让VisualTransitions做更多？

如果可能的话，我宁愿将其保留在XAML中，并且可以扩展到大量的东西。

谢谢！ -David

<UserControl x:Class="WpfApplication1.UserControl1"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             Width="500" Height="500" Background="PaleTurquoise" >

    <UserControl.Resources>

        <Storyboard x:Key="Thing1In">
            <DoubleAnimation Storyboard.TargetName="Thing1" Storyboard.TargetProperty="(Canvas.Top)" Duration="0:0:2" To="100" />
        </Storyboard>

        <Storyboard x:Key="Thing1Out">
            <DoubleAnimation Storyboard.TargetName="Thing1" Storyboard.TargetProperty="(Canvas.Top)" Duration="0:0:2" To="-100" />
        </Storyboard>

        <Storyboard x:Key="Thing2In">
            <DoubleAnimation Storyboard.TargetName="Thing2" Storyboard.TargetProperty="(Canvas.Bottom)" Duration="0:0:2" To="100" />
        </Storyboard>

        <Storyboard x:Key="Thing2Out">
            <DoubleAnimation Storyboard.TargetName="Thing2" Storyboard.TargetProperty="(Canvas.Bottom)" Duration="0:0:2" To="-100" />
        </Storyboard>

        <Storyboard x:Key="Thing1ToThing2">
            <!--do Thing1Out then (or at the same time as) Thing2In-->
        </Storyboard>

        <Storyboard x:Key="Thing2ToThing1">
            <!--do Thing2Out then (or at the same time as) Thing1In-->
        </Storyboard>

    </UserControl.Resources>

    <VisualStateManager.VisualStateGroups>
        <VisualStateGroup x:Name="ThingStates">

            <VisualState x:Name="NothingInState" />
            <VisualState x:Name="Thing1InState" Storyboard="{StaticResource Thing1In}" />
            <VisualState x:Name="Thing2InState" Storyboard="{StaticResource Thing2In}" />

            <VisualStateGroup.Transitions>
                <VisualTransition From="Thing1InState" To="Thing2InState" Storyboard="{StaticResource Thing1ToThing2}" />
                <VisualTransition From="Thing2InState" To="Thing1InState" Storyboard="{StaticResource Thing2ToThing1}" />
                <VisualTransition From="Thing1InState" To="NothingInState" Storyboard="{StaticResource Thing1Out}" />
                <VisualTransition From="Thing2InState" To="NothingInState" Storyboard="{StaticResource Thing2Out}" />
            </VisualStateGroup.Transitions>
        </VisualStateGroup>
    </VisualStateManager.VisualStateGroups>

    <Canvas ClipToBounds="True">

        <TextBlock x:Name="Thing1" Text="Thing1" FontSize="60" Canvas.Top="-100" Canvas.Left="100" />

        <TextBlock x:Name="Thing2" Text="Thing2" FontSize="60" Canvas.Bottom="-100" Canvas.Left="100" />

    </Canvas>
</UserControl>

如何在XAML中组合故事板？

0 个答案: