複数画面の作成方法（新規追加と複製）
PowerAppsで画面遷移を実現するには、まず複数の画面を用意する必要があります。新しい画面を追加する方法としては、上部メニューの「挿入」から「新しい画面」を選択します。これにより、まっさらなキャンバスが追加され、自由にレイアウトやコントロールを配置できます。また、用途に応じて「空白画面」「フォーム付き画面」「ギャラリー画面」などのテンプレートから選ぶこともでき、効率的に開発を始められます。さらに、既存の画面を複製して使う場合は、画面を右クリックして「複製」を選択します。複製は元のレイアウトや配置したコントロール、設定したプロパティまでそのまま引き継ぐため、似た構成の画面を複数作るときに非常に便利です。例えば、入力フォーム画面を複製して編集画面や確認画面に流用することで、作業時間を大幅に短縮できます。このように新規追加と複製を使い分けることで、アプリの開発スピードと品質を両立させることが可能です。
Navigate関数の基本構文
PowerAppsで画面遷移を行うための基本的な関数がNavigate関数です。この関数は、ユーザーの操作やアプリの条件に応じて柔軟に遷移先を制御できる強力な機能です。構文は以下のようになります。
Navigate(画面名, 遷移効果, パラメータ)画面名には遷移先のスクリーン名を正確に指定します。遷移効果にはScreenTransition.Fadeなどのアニメーション効果を設定でき、これにより画面切り替えの演出を変えることが可能です。Fade以外にも、スライドやカバーなど複数の効果が用意されています。パラメータは省略可能ですが、画面間で値やコンテキスト変数を受け渡したい場合に非常に有効です。例えば、ログイン画面からユーザー名をメイン画面に渡す、選択した商品のIDを詳細画面に送るなどの用途があります。これらを組み合わせることで、単なる画面切り替え以上に動的でインタラクティブなアプリを構築できます。
Navigate(画面名, ScreenTransition.Fade) の例
もっともシンプルな例として、フェード効果を使った画面遷移があります。例えば、Button1をクリックするとScreen2に遷移する場合、Button1の「OnSelect」プロパティに次のコードを設定します。
Navigate(Screen2, ScreenTransition.Fade)このように記述するだけで、フェード効果付きの滑らかな画面切り替えが実現できます。さらに、同じ構文を利用して他の画面や複数のボタンに適用することで、アプリ全体に統一感のある遷移体験を提供できます。フェード効果はユーザーにとって視覚的に心地よく、特に情報の切り替えを自然に見せたい場合に効果的です。また、遷移先の画面に事前にデータを読み込む処理を組み合わせると、画面切り替えと同時に最新情報を表示でき、操作性が向上します。開発段階では、テスト用に複数の遷移パターンを設定して比較し、最も適した演出を選ぶのがおすすめです。
画面遷移に条件を加える方法（ボタンで条件分岐）
単純な画面遷移だけでなく、条件によって遷移先を変えることもできます。例えば、ユーザーが入力した値に応じて異なる画面へ遷移する場合、If関数を組み合わせます。
If(TextInput1.Text = "A", Navigate(ScreenA, ScreenTransition.Fade), Navigate(ScreenB, ScreenTransition.Fade))このコードでは、入力が「A」であればScreenAに、それ以外の場合はScreenBに遷移します。条件分岐を加えることで、アプリの動作をより柔軟にできます。さらに、この仕組みを拡張して複数の条件分岐を設定すれば、入力値や選択内容に応じて3画面以上に振り分けることも可能です。例えば、ユーザーの役割に応じて管理画面、一般ユーザー画面、ゲスト画面へと分岐させることができます。加えて、条件に合致しなかった場合のデフォルト動作を設定しておくことで、予期せぬ入力にも対応でき、アプリの信頼性が高まります。開発時には、テストデータを用いて条件ごとの遷移先が正しく動作するかを検証することが重要です。
アニメーション付きの画面切り替え方法
Navigate関数では、Fade以外にもさまざまな遷移効果を選べます。例えば、ScreenTransition.Noneでアニメーションなし、ScreenTransition.Coverで横方向のスライド、ScreenTransition.UnCoverで反対方向のスライドなどがあります。アプリのデザインや操作感に合わせて適切な効果を選ぶと、ユーザー体験が向上します。以下に公式サイトの解説も載せておきます。
公式サイトBack および Navigate 関数
パラメータを使った画面間のデータ受け渡し
Navigate関数の3つ目の引数には、コンテキスト変数としてデータを渡すことができます。例えば、次のように記述します。
Navigate(Screen2, ScreenTransition.Fade, {UserName: TextInput1.Text})この場合、Screen2側でUserNameという変数を利用できます。表示用のラベルにUserNameを設定すれば、前の画面で入力した内容を引き継ぐことが可能です。さらに、この方法は単一の値だけでなく複数の値を同時に渡すこともできます。例えば、ユーザーIDや選択した商品コード、フラグ情報などをまとめてコンテキスト変数として送ることで、遷移先の画面で必要なデータを即座に利用できるようになります。こうすることで、別途データソースを再取得する必要がなくなり、画面遷移の速度や操作感が向上します。また、渡された変数はUpdateContextやSet関数と組み合わせることで、さらに加工や利用の幅を広げることができます。
まとめと次回予告
PowerAppsでの画面遷移は、Navigate関数を使えば簡単に実装できます。基本構文からアニメーション効果、条件分岐、パラメータ渡しまで覚えることで、より高度なアプリ開発が可能になります。
次回は、PowerAppsのギャラリーコントロールの使い方とデザイン変更のポイントについて解説します。これにより、一覧表示やデータ操作の幅が大きく広がります。
コメント