[C#/WINUI3/.NET6] NavigationTransitionInfo 클래스 : 페이지간 시각적 피드백을 제공하는 페이지 전환 만들기

■ NavigationTransitionInfo 클래스의 파생 클래스들을 사용해 페이지간 시각적 피드백을 제공하는 페이지 전환을 만드는 방법을 보여준다.

▶ SimplePage1.xaml


<Page x:Class="TestProject.SamplePage1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    FontFamily="나눔고딕코딩"
    FontSize="16">
    <ScrollViewer>
        <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
            <Grid.Resources>
                <x:Double x:Key="TileHeightKey">150</x:Double>
            </Grid.Resources>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="Auto" />
                <ColumnDefinition Width="*"    />
                <ColumnDefinition Width="*"    />
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto" />
                <RowDefinition Height="Auto" />
                <RowDefinition Height="Auto" />
                <RowDefinition Height="*"    />
            </Grid.RowDefinitions>
            <Grid Grid.Row="1" Grid.Column="1"
                Margin="5"
                MinHeight="{StaticResource TileHeightKey}"
                Background="DarkGray" />
            <Grid Grid.Row="1" Grid.Column="2"
                Margin="5"
                MinHeight="{StaticResource TileHeightKey}"
                Background="LightGray" />
            <Grid Grid.Row="2" Grid.Column="1"
                Margin="5"
                MinHeight="{StaticResource TileHeightKey}"
                Background="LightGray" />
            <Grid Grid.Row="2" Grid.Column="2"
                Margin="5"
                MinHeight="{StaticResource TileHeightKey}"
                Background="DarkGray" />
            <Grid Name="sourceGrid" Grid.Row="1" Grid.RowSpan="2" Grid.Column="0"
                Margin="5"
                MinWidth="250"
                MinHeight="{StaticResource TileHeightKey}"
                Background="{ThemeResource SystemAccentColor}" />
            <Grid Grid.Row="3" Grid.ColumnSpan="3"
                Margin="5 10">
                <TextBlock
                    Style="{ThemeResource BodyTextBlockStyle}"
                    TextWrapping="WrapWholeWords"
                    Text="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum." />
            </Grid>
        </Grid>
    </ScrollViewer>
</Page>

<Page x:Class="TestProject.SamplePage1"

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

FontFamily="나눔고딕코딩"

FontSize="16">

<Grid.Resources>

<x:Double x:Key="TileHeightKey">150</x:Double>

</Grid.Resources>

<Grid.ColumnDefinitions>

</Grid.ColumnDefinitions>

<Grid.RowDefinitions>

</Grid.RowDefinitions>

<Grid Grid.Row="1" Grid.Column="1"

Margin="5"

MinHeight="{StaticResource TileHeightKey}"

Background="DarkGray" />

<Grid Grid.Row="1" Grid.Column="2"

Margin="5"

MinHeight="{StaticResource TileHeightKey}"

Background="LightGray" />

<Grid Grid.Row="2" Grid.Column="1"

Margin="5"

MinHeight="{StaticResource TileHeightKey}"

Background="LightGray" />

<Grid Grid.Row="2" Grid.Column="2"

Margin="5"

MinHeight="{StaticResource TileHeightKey}"

Background="DarkGray" />

<Grid Name="sourceGrid" Grid.Row="1" Grid.RowSpan="2" Grid.Column="0"

Margin="5"

MinWidth="250"

MinHeight="{StaticResource TileHeightKey}"

Background="{ThemeResource SystemAccentColor}" />

<Grid Grid.Row="3" Grid.ColumnSpan="3"

Margin="5 10">

<TextBlock

Style="{ThemeResource BodyTextBlockStyle}"

TextWrapping="WrapWholeWords"

Text="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum." />

</Grid>

</ScrollViewer>

</Page>

▶ SimplePage1.xaml.cs


using Windows.Foundation.Metadata;

using Microsoft.UI.Xaml.Controls;
using Microsoft.UI.Xaml.Media.Animation;
using Microsoft.UI.Xaml.Navigation;

namespace TestProject
{
    /// <summary>
    /// 샘플 페이지 1
    /// </summary>
    public sealed partial class SamplePage1 : Page
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 생성자 - SamplePage1()

        /// <summary>
        /// 생성자
        /// </summary>
        public SamplePage1()
        {
            InitializeComponent();
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Method
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 연결 애니메이션 준비하기 - PrepareConnectedAnimation(configuration)

        /// <summary>
        /// 연결 애니메이션 준비하기
        /// </summary>
        /// <param name="configuration">연결 애니메이션 구성</param>
        public void PrepareConnectedAnimation(ConnectedAnimationConfiguration configuration)
        {
            ConnectedAnimation animation = ConnectedAnimationService.GetForCurrentView().PrepareToAnimate("ForwardConnectedAnimation", this.sourceGrid);

            if(configuration != null && ApiInformation.IsApiContractPresent("Windows.Foundation.UniversalApiContract", 7))
            {
                animation.Configuration = configuration;
            }
        }

        #endregion

        ////////////////////////////////////////////////////////////////////////////////////////// Protected

        #region 탐색되는 경우 처리하기 - OnNavigatedTo(e)

        /// <summary>
        /// 탐색되는 경우 처리하기
        /// </summary>
        /// <param name="e">이벤트 인자</param>
        protected override void OnNavigatedTo(NavigationEventArgs e)
        {
            base.OnNavigatedTo(e);

            ConnectedAnimation animation = ConnectedAnimationService.GetForCurrentView().GetAnimation("BackwardConnectedAnimation");

            if(animation != null)
            {
                animation.TryStart(this.sourceGrid);
            }
        }

        #endregion
    }
}

using Windows.Foundation.Metadata;

using Microsoft.UI.Xaml.Controls;

using Microsoft.UI.Xaml.Media.Animation;

using Microsoft.UI.Xaml.Navigation;

namespace TestProject

{

/// <summary>

/// 샘플 페이지 1

/// </summary>

public sealed partial class SamplePage1 : Page

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - SamplePage1()

/// <summary>

/// 생성자

/// </summary>

public SamplePage1()

{

InitializeComponent();

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 연결 애니메이션 준비하기 - PrepareConnectedAnimation(configuration)

/// <summary>

/// 연결 애니메이션 준비하기

/// </summary>

/// <param name="configuration">연결 애니메이션 구성</param>

public void PrepareConnectedAnimation(ConnectedAnimationConfiguration configuration)

{

ConnectedAnimation animation = ConnectedAnimationService.GetForCurrentView().PrepareToAnimate("ForwardConnectedAnimation", this.sourceGrid);

if(configuration != null && ApiInformation.IsApiContractPresent("Windows.Foundation.UniversalApiContract", 7))

{

animation.Configuration = configuration;

}

#endregion

////////////////////////////////////////////////////////////////////////////////////////// Protected

#region 탐색되는 경우 처리하기 - OnNavigatedTo(e)

/// <summary>

/// 탐색되는 경우 처리하기

/// </summary>

/// <param name="e">이벤트 인자</param>

protected override void OnNavigatedTo(NavigationEventArgs e)

{

base.OnNavigatedTo(e);

ConnectedAnimation animation = ConnectedAnimationService.GetForCurrentView().GetAnimation("BackwardConnectedAnimation");

if(animation != null)

{

animation.TryStart(this.sourceGrid);

}

#endregion

}

▶ SimplePage2.xaml


<Page x:Class="TestProject.SamplePage2"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    <ScrollViewer>
        <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
            <Grid.Resources>
                <x:Double x:Key="TileHeightKey">150</x:Double>
            </Grid.Resources>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="Auto" />
                <ColumnDefinition Width="*"    />
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto" />
                <RowDefinition Height="Auto" />
            </Grid.RowDefinitions>
            <Grid Name="targetGrid" Grid.Row="1" Grid.Column="0"
                VerticalAlignment="Top"
                Margin="10"
                Width="150"
                Height="200"
                MinHeight="{StaticResource TileHeightKey}"
                Background="{ThemeResource SystemAccentColor}" />
            <StackPanel Name="contentStackPanel" Grid.Row="1" Grid.Column="1"
                Margin="10"
                MinHeight="200">
                <TextBlock
                    Style="{ThemeResource TitleTextBlockStyle}"
                    Margin="0 0 0 10"
                    TextWrapping="WrapWholeWords"
                    Text="Lorem ipsum dolor sit amet, consectetur adipiscing elit" />
                <TextBlock
                    TextWrapping="WrapWholeWords"
                    Text="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum." />
            </StackPanel>
        </Grid>
    </ScrollViewer>
</Page>

<Page x:Class="TestProject.SamplePage2"

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">

<Grid.Resources>

<x:Double x:Key="TileHeightKey">150</x:Double>

</Grid.Resources>

<Grid.ColumnDefinitions>

</Grid.ColumnDefinitions>

<Grid.RowDefinitions>

</Grid.RowDefinitions>

<Grid Name="targetGrid" Grid.Row="1" Grid.Column="0"

VerticalAlignment="Top"

Margin="10"

Width="150"

Height="200"

MinHeight="{StaticResource TileHeightKey}"

Background="{ThemeResource SystemAccentColor}" />

<StackPanel Name="contentStackPanel" Grid.Row="1" Grid.Column="1"

Margin="10"

MinHeight="200">

<TextBlock

Style="{ThemeResource TitleTextBlockStyle}"

Margin="0 0 0 10"

TextWrapping="WrapWholeWords"

Text="Lorem ipsum dolor sit amet, consectetur adipiscing elit" />

<TextBlock

TextWrapping="WrapWholeWords"

</StackPanel>

</Grid>

</ScrollViewer>

</Page>

▶ SimplePage2.xaml.cs


using Windows.Foundation.Metadata;

using Microsoft.UI.Xaml.Controls;
using Microsoft.UI.Xaml.Media.Animation;
using Microsoft.UI.Xaml.Navigation;

namespace TestProject
{
    /// <summary>
    /// 생성자
    /// </summary>
    public sealed partial class SamplePage2 : Page
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 생성자 - SamplePage2()

        /// <summary>
        /// 생성자
        /// </summary>
        public SamplePage2()
        {
            InitializeComponent();
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Method
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 연결 애니메이션 준비하기 - PrepareConnectedAnimation(configuration)

        /// <summary>
        /// 연결 애니메이션 준비하기
        /// </summary>
        /// <param name="configuration">연결 애니메이션 구성</param>
        public void PrepareConnectedAnimation(ConnectedAnimationConfiguration configuration)
        {
            ConnectedAnimation animation = ConnectedAnimationService.GetForCurrentView().PrepareToAnimate("BackwardConnectedAnimation", this.targetGrid);

            if(configuration != null && ApiInformation.IsApiContractPresent("Windows.Foundation.UniversalApiContract", 7))
            {
                animation.Configuration = configuration;
            }
        }

        #endregion

        ////////////////////////////////////////////////////////////////////////////////////////// Protected

        #region 탐색되는 경우 처리하기 - OnNavigatedTo(e)

        /// <summary>
        /// 탐색되는 경우 처리하기
        /// </summary>
        /// <param name="e">이벤트 인자</param>
        protected override void OnNavigatedTo(NavigationEventArgs e)
        {
            base.OnNavigatedTo(e);

            ConnectedAnimation animation = ConnectedAnimationService.GetForCurrentView().GetAnimation("ForwardConnectedAnimation");

            if(animation != null)
            {
                this.contentStackPanel.Transitions = new TransitionCollection { new EntranceThemeTransition() };

                animation.TryStart(this.targetGrid);
            }
        }

        #endregion
    }
}

using Windows.Foundation.Metadata;

using Microsoft.UI.Xaml.Controls;

using Microsoft.UI.Xaml.Media.Animation;

using Microsoft.UI.Xaml.Navigation;

namespace TestProject

{

/// <summary>

/// 생성자

/// </summary>

public sealed partial class SamplePage2 : Page

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - SamplePage2()

/// <summary>

/// 생성자

/// </summary>

public SamplePage2()

{

InitializeComponent();

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 연결 애니메이션 준비하기 - PrepareConnectedAnimation(configuration)

/// <summary>

/// 연결 애니메이션 준비하기

/// </summary>

/// <param name="configuration">연결 애니메이션 구성</param>

public void PrepareConnectedAnimation(ConnectedAnimationConfiguration configuration)

{

ConnectedAnimation animation = ConnectedAnimationService.GetForCurrentView().PrepareToAnimate("BackwardConnectedAnimation", this.targetGrid);

if(configuration != null && ApiInformation.IsApiContractPresent("Windows.Foundation.UniversalApiContract", 7))

{

animation.Configuration = configuration;

}

#endregion

////////////////////////////////////////////////////////////////////////////////////////// Protected

#region 탐색되는 경우 처리하기 - OnNavigatedTo(e)

/// <summary>

/// 탐색되는 경우 처리하기

/// </summary>

/// <param name="e">이벤트 인자</param>

protected override void OnNavigatedTo(NavigationEventArgs e)

{

base.OnNavigatedTo(e);

ConnectedAnimation animation = ConnectedAnimationService.GetForCurrentView().GetAnimation("ForwardConnectedAnimation");

if(animation != null)

{

this.contentStackPanel.Transitions = new TransitionCollection { new EntranceThemeTransition() };

animation.TryStart(this.targetGrid);

}

#endregion

}

▶ MainPage.xaml


<?xml version="1.0" encoding="utf-8"?>
<Page x:Class="TestProject.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"
    FontFamily="나눔고딕코딩"
    FontSize="16">
    <Grid Margin="10">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*"    />
            <ColumnDefinition Width="10"   />
            <ColumnDefinition Width="Auto" />
        </Grid.ColumnDefinitions>
        <Frame x:Name="frame">
            <Frame.ContentTransitions>
                <TransitionCollection>
                    <NavigationThemeTransition />
                </TransitionCollection>
            </Frame.ContentTransitions>
        </Frame>
        <StackPanel Grid.Column="2"
            HorizontalAlignment="Center"
            VerticalAlignment="Center">
            <RadioButtons Header="Transition modes">
                <RadioButton Name="defaultTransitionRadioButton"
                    Content="Default" />
                <RadioButton Name="entranceTransitionRadioButton"
                    Content="Entrance" />
                <RadioButton Name="drillTransitionRadioButton"
                    Content="DrillIn" />
                <RadioButton Name="suppressTransitionRadioButton"
                    Content="Suppress" />
                <RadioButton Name="slideFromRightTransitionRadioButton"
                    Content="Slide from Right" />
                <RadioButton Name="slideFromLeftTransitionRadioButton"
                    Content="Slide from Left" />
            </RadioButtons>
            <TextBlock Margin="0 10 0 0">Navigate</TextBlock>
            <Button Name="navigateForwardButton"
                Margin="0 10 0 0"
                Content="Navigate Forward" />
            <Button Name="navigateBackwardButton"
                Margin="0 10 0 0"
                Content="Navigate Backward" />
        </StackPanel>
    </Grid>
</Page>

<?xml version="1.0" encoding="utf-8"?>

<Page x:Class="TestProject.MainPage"

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"

FontFamily="나눔고딕코딩"

FontSize="16">

<Grid.ColumnDefinitions>

</Grid.ColumnDefinitions>

<Frame.ContentTransitions>

</TransitionCollection>

</Frame.ContentTransitions>

</Frame>

<StackPanel Grid.Column="2"

HorizontalAlignment="Center"

VerticalAlignment="Center">

<RadioButton Name="defaultTransitionRadioButton"

Content="Default" />

<RadioButton Name="entranceTransitionRadioButton"

Content="Entrance" />

<RadioButton Name="drillTransitionRadioButton"

Content="DrillIn" />

<RadioButton Name="suppressTransitionRadioButton"

Content="Suppress" />

<RadioButton Name="slideFromRightTransitionRadioButton"

Content="Slide from Right" />

<RadioButton Name="slideFromLeftTransitionRadioButton"

Content="Slide from Left" />

</RadioButtons>

<TextBlock Margin="0 10 0 0">Navigate</TextBlock>

<Button Name="navigateForwardButton"

Margin="0 10 0 0"

Content="Navigate Forward" />

<Button Name="navigateBackwardButton"

Margin="0 10 0 0"

Content="Navigate Backward" />

</StackPanel>

</Grid>

</Page>

▶ MainPage.xaml.cs


using System;

using Microsoft.UI.Xaml;
using Microsoft.UI.Xaml.Controls;
using Microsoft.UI.Xaml.Media.Animation;

namespace TestProject
{
    /// <summary>
    /// 메인 페이지
    /// </summary>
    public sealed partial class MainPage : Page
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Field
        ////////////////////////////////////////////////////////////////////////////////////////// Private

        #region Field

        /// <summary>
        /// 탐색 전환 정보
        /// </summary>
        private NavigationTransitionInfo navigationTransitionInfo = null;

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 생성자 - MainPage()

        /// <summary>
        /// 생성자
        /// </summary>
        public MainPage()
        {
            InitializeComponent();

            this.defaultTransitionRadioButton.Checked        += transitionRadioButton_Checked;
            this.entranceTransitionRadioButton.Checked       += transitionRadioButton_Checked;
            this.drillTransitionRadioButton.Checked          += transitionRadioButton_Checked;
            this.suppressTransitionRadioButton.Checked       += transitionRadioButton_Checked;
            this.slideFromRightTransitionRadioButton.Checked += transitionRadioButton_Checked;
            this.slideFromLeftTransitionRadioButton.Checked  += transitionRadioButton_Checked;
            this.navigateForwardButton.Click                 += navigateForwardButton_Click;
            this.navigateBackwardButton.Click                += navigateBackwardButton_Click;

            this.defaultTransitionRadioButton.IsChecked = true;

            this.frame.Navigate(typeof(SamplePage1));
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Method
        ////////////////////////////////////////////////////////////////////////////////////////// Private

        #region 전환 라디오 버튼 체크시 처리하기 - transitionRadioButton_Checked(sender, e)

        /// <summary>
        /// 전환 라디오 버튼 체크시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void transitionRadioButton_Checked(object sender, RoutedEventArgs e)
        {
            string transitionString = (sender as RadioButton).Content.ToString();

            if(transitionString != "Default")
            {
                if(transitionString == "Entrance")
                {
                    this.navigationTransitionInfo = new EntranceNavigationTransitionInfo();
                }
                else if(transitionString == "DrillIn")
                {
                    this.navigationTransitionInfo = new DrillInNavigationTransitionInfo();
                }
                else if(transitionString == "Suppress")
                {
                    this.navigationTransitionInfo = new SuppressNavigationTransitionInfo();
                }
                else if(transitionString == "Slide from Right")
                {
                    this.navigationTransitionInfo = new SlideNavigationTransitionInfo()
                    {
                        Effect = SlideNavigationTransitionEffect.FromRight
                    };
                }
                else if(transitionString == "Slide from Left")
                {
                    this.navigationTransitionInfo = new SlideNavigationTransitionInfo()
                    {
                        Effect = SlideNavigationTransitionEffect.FromLeft
                    };
                }
            }
            else
            {
                this.navigationTransitionInfo = null;
            }
        }

        #endregion
        #region Navigate Forward 버튼 클릭시 처리하기 - navigateForwardButton_Click(sender, e)

        /// <summary>
        /// Navigate Forward 버튼 클릭시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void navigateForwardButton_Click(object sender, RoutedEventArgs e)
        {
            Type pageType = this.frame.BackStackDepth % 2 == 1 ? typeof(SamplePage1) : typeof(SamplePage2);

            if(this.navigationTransitionInfo == null)
            {
                this.frame.Navigate(pageType, null);
            }
            else
            {
                this.frame.Navigate(pageType, null, this.navigationTransitionInfo);
            }
        }

        #endregion
        #region Navigate Backward 버튼 클릭시 처리하기 - navigateBackwardButton_Click(sender, e)

        /// <summary>
        /// Navigate Backward 버튼 클릭시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void navigateBackwardButton_Click(object sender, RoutedEventArgs e)
        {
            if(this.frame.BackStackDepth > 0)
            {
                this.frame.GoBack();
            }
        }

        #endregion
    }
}

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

using System;

using Microsoft.UI.Xaml;

using Microsoft.UI.Xaml.Controls;

using Microsoft.UI.Xaml.Media.Animation;

namespace TestProject

{

/// <summary>

/// 메인 페이지

/// </summary>

public sealed partial class MainPage : Page

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Field

////////////////////////////////////////////////////////////////////////////////////////// Private

#region Field

/// <summary>

/// 탐색 전환 정보

/// </summary>

private NavigationTransitionInfo navigationTransitionInfo = null;

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - MainPage()

/// <summary>

/// 생성자

/// </summary>

public MainPage()

{

InitializeComponent();

this.defaultTransitionRadioButton.Checked += transitionRadioButton_Checked;

this.entranceTransitionRadioButton.Checked += transitionRadioButton_Checked;

this.drillTransitionRadioButton.Checked += transitionRadioButton_Checked;

this.suppressTransitionRadioButton.Checked += transitionRadioButton_Checked;

this.slideFromRightTransitionRadioButton.Checked += transitionRadioButton_Checked;

this.slideFromLeftTransitionRadioButton.Checked += transitionRadioButton_Checked;

this.navigateForwardButton.Click += navigateForwardButton_Click;

this.navigateBackwardButton.Click += navigateBackwardButton_Click;

this.defaultTransitionRadioButton.IsChecked = true;

this.frame.Navigate(typeof(SamplePage1));

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Private

#region 전환 라디오 버튼 체크시 처리하기 - transitionRadioButton_Checked(sender, e)

/// <summary>

/// 전환 라디오 버튼 체크시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void transitionRadioButton_Checked(object sender, RoutedEventArgs e)

{

string transitionString = (sender as RadioButton).Content.ToString();

if(transitionString != "Default")

{

if(transitionString == "Entrance")

{

this.navigationTransitionInfo = new EntranceNavigationTransitionInfo();

}

else if(transitionString == "DrillIn")

{

this.navigationTransitionInfo = new DrillInNavigationTransitionInfo();

}

else if(transitionString == "Suppress")

{

this.navigationTransitionInfo = new SuppressNavigationTransitionInfo();

}

else if(transitionString == "Slide from Right")

{

this.navigationTransitionInfo = new SlideNavigationTransitionInfo()

{

Effect = SlideNavigationTransitionEffect.FromRight

};

}

else if(transitionString == "Slide from Left")

{

this.navigationTransitionInfo = new SlideNavigationTransitionInfo()

{

Effect = SlideNavigationTransitionEffect.FromLeft

};

}

else

{

this.navigationTransitionInfo = null;

}

#endregion

#region Navigate Forward 버튼 클릭시 처리하기 - navigateForwardButton_Click(sender, e)

/// <summary>

/// Navigate Forward 버튼 클릭시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void navigateForwardButton_Click(object sender, RoutedEventArgs e)

{

Type pageType = this.frame.BackStackDepth % 2 == 1 ? typeof(SamplePage1) : typeof(SamplePage2);

if(this.navigationTransitionInfo == null)

{

this.frame.Navigate(pageType, null);

}

else

{

this.frame.Navigate(pageType, null, this.navigationTransitionInfo);

}

#endregion

#region Navigate Backward 버튼 클릭시 처리하기 - navigateBackwardButton_Click(sender, e)

/// <summary>

/// Navigate Backward 버튼 클릭시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void navigateBackwardButton_Click(object sender, RoutedEventArgs e)

{

if(this.frame.BackStackDepth > 0)

{

this.frame.GoBack();

}

#endregion

}

TestProject.zip