WPFのページ切り替えエフェクトを実装する方法を教えてください。

WPFでは、VisualStateManagerとVisualStateを使用することでページ遷移を実装することができます。以下の例は簡単なサンプルです。

XAML内で、まず2つのページのレイアウトを以下のように定義します。

<Grid>
    <!-- 页面1 -->
    <Grid x:Name="Page1" Visibility="Visible">
        <!-- 页面1的内容 -->
    </Grid>

    <!-- 页面2 -->
    <Grid x:Name="Page2" Visibility="Collapsed">
        <!-- 页面2的内容 -->
    </Grid>
</Grid>

次に、ページのコードビハインドでVisualStateManagerとVisualStateを使用してページの遷移を実装できます。たとえば、ボタンをクリックしてページ1からページ2に遷移します。

private void SwitchPageButton_Click(object sender, RoutedEventArgs e)
{
    // 设置页面1的状态为隐藏
    VisualStateManager.GoToElementState(Page1, "HideState", true);

    // 设置页面2的状态为显示
    VisualStateManager.GoToElementState(Page2, "ShowState", true);
}

XAML でページの VisualStateGroup と VisualState を定義する

<Grid>
    <VisualStateManager.VisualStateGroups>
        <VisualStateGroup>
            <VisualState x:Name="HideState">
                <Storyboard>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Page1" Storyboard.TargetProperty="Visibility">
                        <DiscreteObjectKeyFrame KeyTime="0" Value="{x:Static Visibility.Collapsed}" />
                    </ObjectAnimationUsingKeyFrames>
                </Storyboard>
            </VisualState>
            <VisualState x:Name="ShowState">
                <Storyboard>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Page2" Storyboard.TargetProperty="Visibility">
                        <DiscreteObjectKeyFrame KeyTime="0" Value="{x:Static Visibility.Visible}" />
                    </ObjectAnimationUsingKeyFrames>
                </Storyboard>
            </VisualState>
        </VisualStateGroup>
    </VisualStateManager.VisualStateGroups>
</Grid>

上記の手順で、ボタンをクリックすると、ページ1が非表示となり、ページ2が表示され、ページの切り替え効果が実現します。必要に応じて、追加のVisualStateを定義することで、異なる切り替え効果を実現できます。

bannerAds