====== 024 トランジションアニメーションによるページ遷移 ======

===== 概要 =====
トランジションを使用してiPhoneでよく見る横スライドでのページ遷移を実現します。

==== MainPage.xaml ====
<code xml>
<phone:PhoneApplicationPage 
	x:Class="BaseApp.MainPage"
	xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
	xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
	xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
	xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
	xmlns:toolkit="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit"
	xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
	xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
	mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="768"
	FontFamily="{StaticResource PhoneFontFamilyNormal}"
	FontSize="{StaticResource PhoneFontSizeNormal}"
	Foreground="{StaticResource PhoneForegroundBrush}"
	SupportedOrientations="Portrait" Orientation="Portrait"
	shell:SystemTray.IsVisible="True">
	
	<toolkit:TransitionService.NavigationInTransition>
		<toolkit:NavigationInTransition>
			<toolkit:NavigationInTransition.Backward>
				<toolkit:SlideTransition Mode="SlideRightFadeIn"/>
			</toolkit:NavigationInTransition.Backward>
			<toolkit:NavigationInTransition.Forward>
				<toolkit:SlideTransition Mode="SlideLeftFadeIn"/>
			</toolkit:NavigationInTransition.Forward>
		</toolkit:NavigationInTransition>
	</toolkit:TransitionService.NavigationInTransition>
	<toolkit:TransitionService.NavigationOutTransition>
		<toolkit:NavigationOutTransition>
			<toolkit:NavigationOutTransition.Backward>
				<toolkit:SlideTransition Mode="SlideRightFadeOut"/>
			</toolkit:NavigationOutTransition.Backward>
			<toolkit:NavigationOutTransition.Forward>
				<toolkit:SlideTransition Mode="SlideLeftFadeOut"/>
			</toolkit:NavigationOutTransition.Forward>
		</toolkit:NavigationOutTransition>
	</toolkit:TransitionService.NavigationOutTransition>
	
	<!--LayoutRoot is the root grid where all page content is placed-->
	<Canvas x:Name="LayoutRoot" Background="Black">
		<Button Canvas.Left="116" Canvas.Top="121" Content="サブページへ" Height="130" Name="button1" Width="300" Click="ChangePage_Click" />
	</Canvas>
</phone:PhoneApplicationPage>
</code>

==== App.xaml.cs ====
<code csharp>
private void InitializePhoneApplication()
{
	if (phoneApplicationInitialized)
		return;
		
	// Create the frame but don't set it as RootVisual yet; this allows the splash
	// screen to remain active until the application is ready to render.
//			RootFrame = new PhoneApplicationFrame();
	RootFrame = new TransitionFrame();  // トランジションアニメーションを使用する。
	RootFrame.Navigated += CompleteInitializePhoneApplication;
	
	// Handle navigation failures
	RootFrame.NavigationFailed += RootFrame_NavigationFailed;
	
	// Ensure we don't initialize again
	phoneApplicationInitialized = true;
}
</code>