#setlinebreak(on);
[[WP TIPS に戻る>wp7/tips]]
*ページトランジションの合間にメッセージを表示する [#a0f2b49f]
サンプルプロジェクト [[RootFrameBackGround.zip>https://skydrive.live.com/redir.aspx?cid=793b87c06d2f0cd5&resid=793B87C06D2F0CD5!1914&parid=793B87C06D2F0CD5!223]]
PhoneApplicationPage に様々なコントロールやビヘイビア、ストーリーボードなどを追加していくと、だんだん重くなってページを開くまでに時間がかかるようになります。[[Silverlight Toolkit>http://silverlight.codeplex.com/]] のページトランジションを使用すると、次のページに遷移する間、真っ黒な(もしくは真っ白な) 画面が表示されます。
次へボタンなどを押したときに、2～3秒待って開くようになったら合間にメッセージを表示してみたらどうでしょうか？
次へのページ遷移が遅くなってしまった場合、この動画のようにメッセージを表示してみたらどうでしょうか？
#htmlinsert(u2b,id=ErKj2h414X8,width=480,height=360;)
**PhoneApplicationFrame クラスについて [#tb1017de]
WP7 での画面は PhoneApplicationPage クラスですが、これは PhoneApplicationFrame クラスの上に乗っかったコントロールとして動作していて、ページの遷移というのは PhoneApplicationFrame クラス上で PhoneApplicationPage が入れ替わっているだけです。
※ ページの遷移を行う NavigationService.Navigate メソッドなども PhoneApplicationFrame クラスのメンバとして用意されていて、PhoneApplicationFrame で画面の遷移をしている事が分かります。
と言うわけで例えばすべてのPhoneApplicationPage 背景色を統一したい場合などは、PhoneApplicationFrame.Background プロパティに色を設定しておくとすべてのページで統一した色を設定することが出来ます。
**PhoneApplicationFrame.Background に画像を表示する [#b310ce93]
''トランジションの合間の真っ黒な(もしくは真っ白な) 画面 == ページが表示されていない''、と言うことは PhoneApplicationFrame が表示されているわけです。
ですので上記の動画のようにするには、PhoneApplicationFrame.Background に「ロード中画像」を設定し、PhoneApplicationPage.Background を設定すれば OK です。
+PhoneApplicationFrame.Backgroud の設定
まず App.xaml.cs 内で PhoneApplicationFrame(RootFrame) のインスタンスかが行われているので、ここに以下のようにコードを追加します。
このコードは、ページが遷移する直前に PhoneApplicationFrame 背景画像を表示するようにし、ページ遷移が終了したら透明色に変更して背景画像を消しています。
また戻る場合のページ遷移は高速に行われるので、この場合は背景画像を設定していません(ちらつき防止)。
&br;
// フレームを作成しますが、まだ RootVisual に設定しないでください。これによって、アプリケーションがレンダリングできる状態になるまで、
// スプラッシュ スクリーンをアクティブなままにすることができます。
//RootFrame = new PhoneApplicationFrame();
RootFrame = new TransitionFrame();
RootFrame.Navigated += CompleteInitializePhoneApplication;
RootFrame.Navigating += (s, args) =>
{
if (args.NavigationMode != NavigationMode.Back)
{
RootFrame.Background =
new ImageBrush
{
ImageSource = new BitmapImage { UriSource = new Uri("frameinterval.jpg", UriKind.Relative) }
};
}
};
RootFrame.Navigated += (s, args) =>
{
if (args.NavigationMode != NavigationMode.Back)
{
RootFrame.Background = new SolidColorBrush(Colors.Transparent);
}
};
// ナビゲーション エラーを処理します
RootFrame.NavigationFailed += RootFrame_NavigationFailed;
&br;
+PhoneApplicationPage.Backgroud の設定
次に PhoneApplicationPage.Background に Transparent 以外の色を設定しておいて下さい。
というのも PhoneApplicationPage.Background はデフォルト が Transparent になっているため、以下の画像のように PhoneApplicationPage の背景にある PhoneApplicationFrame が透けてしまいます。
透け防止のために PhoneApplicationPage.Backgroud に PhoneBackGroundBrush を設定しておけば良いかと思います。
&br;
#ref(rootframebackground-01.jpg,nolink);
