画面間の移動

Power Apps 入門

Luise Freese

Azure & Power Platform Architect

1つの画面から複数の画面へ

 

  • 実際のアプリには複数の画面があります
  • 各画面は独自のコントロールとレイアウトを持ちます
  • Power Fx が画面間でユーザーを移動させます

Browse、Detail、Edit の3つのタブレット画面が矢印でつながっており、ヘルプデスクのチケット一覧、詳細表示、編集可能なフォームを示しています。

Power Apps 入門

Navigate()

矢印でつながれた2つのタブレット画面。BrowseScreen で選択したギャラリー行から Navigate() で DetailScreen へ移動する様子を示しています。

 

  • Navigate(ScreenName) でその画面に移動します
  • Button や Gallery の OnSelect に設定します
  • ユーザーはすぐに新しい画面に切り替わります
Power Apps 入門

Set() でデータを引き継ぐ

ギャラリー行をタップすると、1つの OnSelect 数式内で Set() と Navigate() をチェーンし、selectedTicket のデータを詳細画面に渡します。

  • Set(name, value) でアプリ全体の変数を作成します
  • Set() と Navigate() をセミコロンでつなげます
  • 詳細画面側では selectedTicket.Title や .Priority など、任意の値を読み取れます
Power Apps 入門

Back()

DetailScreen で、Back() に接続されたハイライト表示の戻る矢印アイコン。タップすると直前の BrowseScreen のギャラリー表示に戻ります。

 

  • Back() は直前の画面にユーザーを戻します
  • 引数は不要です。Power Apps が元の画面を記憶しています
  • 戻る矢印アイコンやボタンに設定します
Power Apps 入門

変数のスコープ、どこに属する？

 

  • App.Formulas：アプリ全体の定数で、常に利用できます
  • App.OnStart：起動時に一度だけ実行され、ClearCollect を記述する場所です
  • Screen.OnVisible：画面が開くたびに実行されます
  • Button の OnSelect：ユーザー操作時に実行されます

 

値が存在する範囲を示す4段のタイムライン。App.Formulas は常に利用可能、App.OnStart は起動時に一度だけ実行、Screen.OnVisible は画面が開くたびに実行、OnSelect はユーザーのタップ時に実行されることを表しています

Power Apps 入門

プロのようにコントロールに名前を付けましょう

$$ Label1 のような汎用的なデフォルト名と、lblTitle、btnSubmit、galTickets のような分かりやすいプレフィックス付きの名前を比較する Tree View パネル。

 

  • デフォルト名の Label1、Button2、Gallery1 は分かりにくい
  • 種類ごとにプレフィックスを付けます：lblTitle、btnSubmit、galTickets
  • 画面に15個以上のコントロールがあるときに役立ちます
Power Apps 入門

これから作るもの

 

  • browse → detail のフローを構築します
  • 行をタップすると詳細が表示されます
  • 戻る矢印でギャラリーに戻ります

チケットギャラリーのある Browse 画面と、チケット項目を表示する Detail 画面、紺色のヘッダーバーにある戻る矢印。

Power Apps 入門

練習しましょう！

Power Apps 入門

Preparing Video For Download...