PowerAppsで保存中にスピナーを実装する方法
PowerAppsでアプリを作成する際、
ユーザーがデータを保存する際に「保存中」の状態を視覚的に示すことが重要です。
保存処理が行われている間、スピナー（ローディングアイコン）や進行中のメッセージを表示することで、
ユーザーに処理が進行中であることを明確に伝えることができます。
この記事では、PowerAppsでボタンを押した際に保存処理中にスピナーを表示し、
保存が完了したら非表示にする方法を解説します。
これにより、ユーザーエクスペリエンスが向上しアプリの操作感がスムーズになります。
実装手順
❶
まず、スピナーを表示するためのコントロールを用意します。
PowerAppsでは「Spinner」コントロールを使って簡単にスピナーを作成できます。
- PowerAppsの「挿入」メニューから「ディスプレイ」>「Spinner」を選択します
- アイコンが画面に追加されます。これがスピナーとして機能します。
プロパティの"ラベル"に値を入力すると文字の表示を設定することができます。
※ラベル入力イメージ※
文字の位置についてはプロパティ内の "ラベルの位置" で設定変更ができます。
❷
スピナーの表示・非表示の制御設定
保存処理が開始されるときにスピナーを表示し、保存処理が完了したらスピナーを非表示にするためのロジックを作成します。
ボタンコントロールを設置し、 OnSelect プロパティを以下のように設定します。
今回の例ではFormを送信する想定で設定を行っていきます。
UpdateContext({IsSaving: true});
SubmitForm(Form1)
変数名は分かりやすい名前で設定してください。
１で設定したスピナーコントロールの Visible プロパティを上記で設定した変数名に設定します。
ボタンを押すことにより Visible の値が true となりスピナーが表示されます。
Form の送信が正常に完了したらスピナーを非表示にします。
Form の OnSuccess プロパティを以下のように設定します。
UpdateContext({IsSaving: false})
送信が正常に完了することでスピナーコントロールの Visible プロパティが false となりスピナーは非表示になります。
➌
実装が完了したら、保存ボタンをクリックして動作確認を行ってください。
保存処理中にスピナーが表示され、処理が完了するとスピナーが非表示になることを確認します。
また、保存に失敗した場合はエラーメッセージが表示されることも確認してください。
保存失敗時は Onfailure プロパティにローカル変数の設定を行い、Notify関数でエラーメッセージを表示させてください。
以上のように設定することでデータの処理中はユーザー側で画面操作が行えないようにするのと、視覚的に処理が進行していることが分かりやすくなります。
ぜひこの方法を参考にして、より使いやすいPowerAppsアプリケーションを作成してみてください！