| ページ一覧 | ブログ | twitter |　 書式 | 書式(表) |

MyMemoWiki

Sliverlight 画面遷移

提供: MyMemoWiki
ナビゲーションに移動 検索に移動

Sliverlight 画面遷移

Sliverlight | VisualStudio | C Sharp |

  • http://code.msdn.microsoft.com/10-C-Silverlight-b4de09ed
  • Silverlight のようなプラグインを使って Web ページに組み込まれたアプリケーションは、その状態に関わらず URL が変わりません
  • Silverlight では、ナビゲーション フレームワークという仕組みにより、アプリケーションに配置した複数のページに個別の URL (より広い意味での URI) を与え、ブラウザーの「戻る」「進む」ボタンで切り替えたり、ブックマークが使えるようになります

ナビゲーション フレームワークを使う

  • プロジェクトを右クリックして [参照の追加] を選び、[参照の追加] ダイアログ ボックスの [.NET] タブから「System.Windows.Controls.Navigation」を選んで、[OK] ボタン

手順

ページフォルダの作成

  • ナビゲーションは、Frame コントロールと Page コントロールを組み合わせて実装
  • プロジェクトを右クリックして [追加] - [新しいフォルダー] を選び、「Views」という名前のフォルダーを追加
  • このフォルダーに、新しいページを作成していく

ページの作成

  • Views フォルダーを右クリックして [追加] - [新しい項目] を選び、[Silverlight ページ] を選んで、という名前の新しいページを作成

ハイパーリンクボタンの設置

  • ハイパーリンクボタンを設置し、追加したページへのURIを指定する
<HyperlinkButton Content="Test" Name="hyperlinkButton1" NavigateUri="/Views/Test.xaml" />

ページを表示する、Frameの設置

<navigation:Frame />

実行

  • この状態で、リンクをクリックすると、Frameにページが読み込まれる

URIマッピング

  • URIの指定が長くなるような場合、簡潔な表記を割り当てられる
<UserControl.Resources>
    <uriMapper:UriMapper x:Key="uriMapper">
        <uriMapper:UriMapping Uri="" MappedUri="/Views/HomePage.xaml" />
        <uriMapper:UriMapping Uri="Home" MappedUri="/Views/HomePage.xaml" />
        <uriMapper:UriMapping Uri="Info" MappedUri="/Views/InfoPage.xaml" />
        <uriMapper:UriMapping Uri="About" MappedUri="/Views/AboutPage.xaml" />
    </uriMapper:UriMapper>
</UserControl.Resources>

<Grid x:Name="LayoutRoot">
         :
    <StackPanel Grid.Row="0" Orientation="Horizontal" Background="LightCyan">
        <HyperlinkButton Content="Home" NavigateUri="Home" />
        <HyperlinkButton Content="Info" NavigateUri="Info" />
        <HyperlinkButton Content="About" NavigateUri="About" />
    </StackPanel>

    <navigation:Frame Grid.Row="1" Background="LightYellow"
                UriMapper="{StaticResource uriMapper}"/>
</Grid>

URIマッピングによりパラメータを渡す

  • URI マッピングでは、単純に文字列を置き換えるだけでなく、パラメーターを渡すこともできます
パラメータを渡す
  • Uri プロパティとして「/」を指定した後に「{}」で囲んだ引数を、マッピング先の MappedUri に渡せます
             :
  <uriMapper:UriMapping Uri="About" MappedUri="/Views/AboutPage.xaml" />
  <uriMapper:UriMapping Uri="/{arg}" MappedUri="/Views/InfoPage.xaml?arg={arg}" />
</uriMapper:UriMapper>
  • これは「/」の直後に渡されたパラメーターを「/Views/InfoPage.xaml?arg=」の後ろに追加してナビゲーションするという意味です
パラメータを受け取る
  • OnNavigateTo メソッドを次のように記述
protected override void OnNavigatedTo(NavigationEventArgs e)
{
    if (NavigationContext.QueryString.ContainsKey("arg"))
    {
        textInfo.Text = "Information: " + NavigationContext.QueryString["arg"];
    }
    else
    {
        textInfo.Text = "Information: (empty)";
    }
}

ChildWindowコントロール

手順

ChildWindowを追加

  • フォルダーを右クリックして [追加] - [新しい項目] を選び、[Silverlight 子ウィンドウ] を選択
  • ChildWindowコントロールはファイルそのものがChildWindowコントロールとして定義されています(通常Silverlightで画面を定義する場合はUserControlコントロールとして定義されます)

呼び出す

ChildWindow1 childWindow = new ChildWindow1();
childWindow.Show();

ブラウザーウインドウにSilverlightを表示

  • HtmlPage.Window.Navigateを使う
  • コードによりページを遷移するには、Webブラウザのwindowオブジェクトを示すHtmlWindowクラス（System.Windows.Browser名前空間）のオブジェクトを取得し、そのNavigateメソッドを使用する

手順

../index/index.htmlへ移動

Uri linkUri = new Uri("../index/index.html", UriKind.Relative);
HtmlPage.Window.Navigate(linkUri, "_self");

Googleを別ウィンドウで開く

Uri linkUri = new Uri("http://google.co.jp/");
HtmlPage.Window.Navigate(linkUri, "_blank");

通信方法

System.Windows.Browser名前空間のクラスを利用して、親(opener)側のSilverlightに定義されたメソッドを小画面のSilverlightからHTML(Javascript)経由で動作

Openerの取得
HtmlPage.Window.GetProperty("opener");

ローカルメッセージ通信を利用

「https://www.typea.info/tips_/index.php?title=Sliverlight_画面遷移&oldid=6602」から取得

© 2006 矢木浩人