uwp transition de base ne fonctionne pas

Question

J'ai une application UWP super basique. J'ai besoin d'afficher un popup avec une belle transition, mais je n'arrive pas à le faire fonctionner?!? Est-ce que je fais quelque chose de mal? J'ouvre le popup dans le code derrière en utilisant popup1.IsOpen = true

PS: S'il vous plaît ne me suggère pas d'utiliser un autre contrôle.

<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

Il y a plusieurs façons de s'y prendre. vous pouvez remplacer vos événements par interactivity et behaviors mais comme vous ne les avez pas utilisés dans votre exemple de code, je ne le partagerai pas. J'ai donc écrit un échantillon de code pour que votre animation fonctionne.

J'ai créé quelques exemples de code qui a native et storyboard animations:

<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> 

et le code regarde derrière comme ci-dessous:

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(); 
}