Microsoft Power App（以下、Power Apps）は、専門性の高い技術や開発の経験を持たなくてもビジネス ニーズに対応するモバイル アプリや Webアプリを比較的簡単に作成できるローコード ツールです。
Microsoft Teams（以下、Teams）では、Power Appsアプリを使用して、該当するチームのメンバー全体又は権限を有するメンバーが利用できるアプリを作成することができます。
本サイトでは、Power Appsを利用してアプリを作成する上で役に立つちょっとしたテクニックを紹介しています。
はじめに
この記事では、UpdateContext関数を利用してボタンコントロールでコンテナの表示／非表示を制御する具体的な手順を紹介します。これにより、アプリのユーザーインターフェースを動的に変更し、操作性を向上させることが可能になります。
なお、この記事は、Power Appsを起動してアプリを作成し、スクリーン上にコントロールを配置するなど、ある程度Power Appsの基本操作ができる方を対象にしています。Power Appsの基本操作から学びたい方は、別途関連サイトや書籍を参考にしていただくことをおすすめします。
機能の概要
アプリのユーザーインターフェースを設計する際、ボタンを選択することで何らかの処理を継続するためにメインの画面上にメッセージボックスや別の画面を重ねて表示させたいことがあります。
例えば、[OK]や[キャンセル]のボタンを備えたアラートメッセージボックスやデータの抽出条件を入力するための画面などです。
ここではメイン画面の[抽出]ボタンを選択すると抽出画面が表示され、抽出画面の[決定]ボタンまたは[閉じる]ボタンを選択すると何らかの処理を実行した後に抽出画面が閉じるといった処理を実現します。あわせて抽出画面が開いた時にメイン画面の背景をグレーにする処理も行います。
実装の方法
このような処理を実装する時に考えられるのは、最初は抽出画面を非表示にしておき、メイン画面の[抽出]ボタンを選択すると抽出画面を表示し、抽出画面で[決定]または[閉じる]ボタンを選択すると何らかの処理を実行した後に抽出画面を非表示にするというものです。
そこで、スクリーン上に2つのコンテナを用意しました。コンテナとは、画面上に配置するコントロールのグループをまとめるためのコントロールです。
1つは学生の基本情報を表示する画面を格納する学生基本コンテナ（Container_GakuseiKihon）ともう1つは抽出条件を入力する抽出画面を格納する抽出条件コンテナ（Container_TyusyutuJoken）です。
学生基本コンテナの[抽出]ボタンが選択されたときに抽出条件コンテナを表示させたいので、学生基本コンテナの[抽出]ボタンのOnselectプロパティ（選択したときに実行する動作）にContainer_TyusyutuJoken.Visible=trueと記述したいところですが、これでは正しく動作しません。なぜならコンテナの外部から直接プロパティを変更することができないためです。
そこでUpdateContext 関数を使います。UpdateContext 関数を使用すると、コンテキスト変数を作成できます。コンテキスト変数は、同一スクリーン内で値が保持される変数です。公式ドキュメント（新しいタブで開く）の記載は次の通りです。
UpdateContext( { ContextVariable1: Value1 [, ContextVariable2: Value2 [, ... ] ] } )
ContextVariable1 - 必須。 作成または更新するコンテキスト変数の名前。
Value1 - 必須。 コンテキスト変数に割り当てる値。
ContextVariable2: Value2, ... - オプション。 追加で作成または更新するコンテキスト変数とその値。
学生基本コンテナの[抽出]ボタンのOnselectプロパティでUpdateContext({ExtractionVisibleStatus:true})
加えて、抽出条件コンテナのVisibleプロパティにコンテキスト変数（ExtractionVisibleStatus）を設定すると、学生基本コンテナの[抽出]ボタンの選択で抽出条件コンテナが表示されます。
逆に、抽出条件コンテナの[決定]または[閉じる]ボタンのOnselectプロパティにUpdateContext({ExtractionVisibleStatus:false})と記述することで抽出条件コンテナを非表示にすることができます。
なお、当該スクリーンのOnVisibleプロパティ（スクリーンが表示されるときに実行される動作）にはUpdateContext({ExtractionVisibleStatus:false})と記述することにで抽出条件コンテナはデフォルトで非表示となります。
同様に学生基本コンテナの[抽出]ボタンを選択して抽出条件コンテナを表示させるときに学生基本コンテナ全体をグレーアウトするといった処理を行うことも可能です。
学生基本コンテナの[抽出]ボタンのOnselectプロパティにUpdateContext({Container_GakuseiKihonFillStatus:RGBA(242, 242, 242, 1)})と記述して値を受け渡します。学生基本コンテナのFillプロパティ（背景色）にコンテキスト変数（Container_GakuseiKihonFillStatus）を設定することで、抽出条件コンテナが表示したときに学生基本コンテナの背景色をグレーにすることができます。
あわせて、抽出条件コンテナを閉じたとき及びスクリーンを表示したときに背景色を初期値に設定する処理も忘れずに実装しておきます。
応用例（タブ機能の実現）
前述の方法を応用して、複数のコンテナを使ったタブ機能を実現することもできます。タブ機能とは、画面上に複数の情報をカテゴリーごとに分けて表示し、タブをクリックすることで切り替えることができる機能です。例えば、学生の相談記録、保健記録などをタブで切り替えて確認できるようにすると便利です。
おわりに
この記事では、Power Apps（by Teams）でアプリを作成する際に役立つテクニックの一つとして、ボタンでコンテナの表示/非表示を制御する方法を紹介しました。
この方法は、UpdateContext関数を使ってコンテキスト変数の値を変更することで、コンテナのVisibleプロパティやFillプロパティを動的に変更することができます。
これにより、ユーザーインターフェースを設計するうえで不可欠な画面の推移を処理することができますのでいろいろ試してみてください。
この記事が、Power Appsでアプリを作成する皆さんのお役に立てれば嬉しいです。