shuhelohelo’s blog

Xamarin.Forms多めです.

MAUI:画面遷移時のデータの受け渡し

画面遷移のとき、遷移先にデータを渡したいことがあります。

画面Aで選択された内容を画面B側で表示したい、とか、画面B側での処理に使いたい、といったようにです。

MAUIのShellアプリケーションではURIベースのナビゲーションを使います。 WebサイトのURLのようなページの指定方法です。

参考:

www.youtube.com

データの受け渡しのない遷移

まず、遷移先のページを作ります。

AppShell.xaml.csに遷移先のルーティング情報を追加します。 これで、"SecondPage"と指定するとSecondPageへ遷移します。

遷移は以下のようにします。

Shell.Current.GoToAsync(nameof(SecondPage));

戻るときは以下のように遷移先のURIに".."を指定します。パスで相対的に1つ前を表すのと同じです。

データの受け渡しのある遷移(単純な型の場合)

stringやintなどの単純な型の場合、渡す側はとてもシンプルです。 Webと同様に?の後に「クエリパラメータ名 = パラメータ」の形でGoToAsyncにわたすだけです。

例えばクエリパラメータ名を「MessageFrom」とすると、以下のようになります。

受け取り側は以下のようにします。

  • QueryProperty属性をViewModelにつける。
  • QueryProperty(受け取り側のクラスのプロパティ名(SecondPageViewModelクラスの), クエリパラメータ名(送る側のURIで指定したID))

このように単純な型の場合は、URIにクエリパラメータとして埋め込んで渡すことができます。

では、カスタムクラスやListなど複雑な型の場合はどうでしょうか。

データの受け渡しのある遷移(複雑な型の場合)

複雑な型の場合はURIに埋め込むことはできません。

そのかわり、GoToAsyncメソッドはそういったデータを受け渡すためのDictionary<string,object>型の引数を受け取るようにできています。

以下のように渡したいデータを「キーと値」のペアで遷移先に渡すことができます。

注意:ObservableCollectionはそのままでは送れないのでListに変換しています。

受け取り側は単純な型の場合と変わりません。 QueryProperty属性を使って、送り側で指定したキー名と受け取り側のプロパティを結びつけるだけです。

おしまい

これで好きな型のデータを遷移先に送ることができます。