Question

我有一个超级基本的UWP应用程序。我需要显示一个带有良好过渡的弹出窗口，但似乎无法使其工作？！？我做错了吗？我使用popup1.IsOpen = true

打开后面代码中的弹出窗口

PS：请不要建议我使用其他控件。

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">

        <Popup x:Name="popup1">
            <Popup.Transitions>
                <TransitionCollection>
                    <PopupThemeTransition FromHorizontalOffset="100"/>
                </TransitionCollection>
            </Popup.Transitions>

            <Border x:Name="brd1" Background="Blue" >
                <Button x:Name="btnClose" Background="White" Click="btnClose_Click"  Margin="100">test</Button>
            </Border>
        </Popup>

        <Button x:Name="btnOpen" Click="btnOpen_Click">go</Button>

    </Grid>

Answer 1

有几种方法可以解决这个问题。您可以使用interactivity和behaviors替换您的活动，但由于您未在示例代码中使用它们，因此我不会分享。所以我写了一个代码示例来让你的动画工作。

我创建了一些包含native和storyboard动画的示例代码：

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
    <Grid.Resources>
        <Storyboard x:Name="ShowPopup">
            <PopInThemeAnimation Storyboard.TargetName="MyPopup" />
        </Storyboard>
        <Storyboard x:Name="HidePopup">
            <PopOutThemeAnimation Storyboard.TargetName="MyPopup" />
        </Storyboard>
    </Grid.Resources>
    <Popup x:Name="MyPopup" IsOpen="True"
       HorizontalAlignment="Center" VerticalAlignment="Center">
        <Popup.Transitions>
            <TransitionCollection>
                <PopupThemeTransition />
            </TransitionCollection>
        </Popup.Transitions>
        <Grid Height="200" Width="200" Background="Red">
            <StackPanel>
                <Button Content="Hide (Native)" HorizontalAlignment="Center" Click="hide_native_click"/>

                <Button Content="Hide (Storyboard)" HorizontalAlignment="Center" Click="hide_storyboard_click"/>
            </StackPanel>
        </Grid>
    </Popup>
    <StackPanel>
        <Button Content="Show Popup (Native)" HorizontalAlignment="Left" VerticalAlignment="Top" Click="show_native_click"/>

        <Button Content="Show Popup (Storyboard)" HorizontalAlignment="Left" VerticalAlignment="Top" Click="show_storyboard_click"/>
    </StackPanel>
</Grid>

后面的代码如下所示：

private void hide_native_click(object sender, RoutedEventArgs e)
{
    MyPopup.IsOpen = false;
}

private void hide_storyboard_click(object sender, RoutedEventArgs e)
{
    HidePopup.Begin();
}

private void show_native_click(object sender, RoutedEventArgs e)
{
    MyPopup.IsOpen = true;
}

private void show_storyboard_click(object sender, RoutedEventArgs e)
{
    ShowPopup.Begin();
}

uwp基本过渡不起作用

1 个答案: