PowerApps では、モバイル向けやパソコンの Web ブラウザ向けのアプリを作成できるほかに、SharePoint モダンリストのフォームをカスタマイズすることもできます。

フォームのカスタマイズにおいても、基本的な操作は PowerApps でのアプリ作成と変わらないのですが、SharePointIntegration という見慣れないコントロールが追加されています。

これは知っておいた方が良さそうだなというわけで、調べてみました。

この記事は、僕が PowerApps を学びながら書くシリーズです。5 部作を想定していましたので、いちおう最後です。

SharePointIntegration コントロールのアクション

SharePointIntegration コントロールの詳細設定を確認すると、OnNew、OnEdit、OnView、OnSave、OnCancel というアクションがあることがわかります。どうやらこれは、SharePoint の画面で行われたユーザー操作を PowerApps に伝えるもののようです。

たとえば、リストの画面で「新規」がクリックされた時には「OnNew」が実行され、「保存」がクリックされた時には「OnSave」が実行されるといった具合です。

既定の状態では、OnNew、OnEdit、OnView などはそれぞれに NewForm(SharePointForm1) などが設定されていますので、フォームを新規作成モード、編集モード、表示モードなどに切り替えているほか、OnSave では、SubmitForm(SharePointForm1) によりフォームに入力された値を SharePoint リストに登録する操作などが行われます。

SharePointIntegration コントロールのプロパティ

また、SharePointIntegration コントロールには、読取り専用の Selected、SelectedListItemID といったプロパティがあります。Selected は、SharePoint リストでユーザーにより選択されたリストアイテムの全ての情報(レコード)が入っており、また、SelectedListItemID は、ユーザーにより選択されたリストアイテムをリスト内で一意に特定するための ID(数値)が入っています。

既定の状態では、SharePointForm1 コントロールの Item で SharePointIntegration.Selected が利用されていますね。

SharePoint フォームカスタマイズ時特有の作法

SharePointIntegration の話から少し逸れますが、PowerApps で SharePoint リストのフォームをカスタマイズする時の作法として、SharePointForm1 などのフォームコントロールの OnSuccess アクションの最後に RequestHide 関数を含める必要があるようです。

この関数がなにをしてくれるかというと、フォームのデータを SharePoint リストに正常に登録したあとに「フォームを閉じてくれる」というものです。ためしにこの関数を消してみると、SharePoint の画面から「保存」ボタンを押した後はデータは更新されるもののフォームは閉じません。

また、SharePointIntegration コントロールの OnCancel アクションでは、必ず ResetForm 関数を含める必要があるようです。

SharePointIntegration コントロールの設定変更は必要?

単純にフォームの見た目を整えたりといった場合には、SharePointIntegration コントロールは既定の設定のままで良さそうです。それでは、どういったときに SharePointIntegration コントロールの設定変更が必要になるのでしょうか?

フォームを開いたタイミングで任意の処理を実行させたいとき

ひとつは、ユーザーがフォームを開いたタイミングで任意の処理や関数を実行させたい場合です。いつもの PowerApps アプリ作成時に、OnStart や OnVisible アクションで行っていたような処理がある場合ですね。

新規作成・編集・表示フォームを別スクリーンで作成したいとき

こちらのシナリオは良くあるかもしれません。新規作成フォームや編集フォームで画面レイアウトを大きく異なるものにしたい場合などは、SharePointIntegration コントロールの OnNew、OnEdit、OnView を利用することでを利用することで実現できます。

たとえば、新規作成フォームを別の画面で作成してみます。そのためには、まずは既定で作成されている画面を複製し、複製した画面でレイアウトを少し編集してみます。

次に、SharePointIntegration コントロールの OnNew、OnEdit、OnView アクションをそれぞれ次のように編集します。SharePoint リストでのユーザー操作によって Navigation 関数を使い分けて表示する画面を切り替えています。また、新たにグローバル変数を作成し、ユーザーがどのフォームを利用しているかの情報も保存しておきます。

OnNew

NewForm(SharePointForm1_1);
Set(ActiveForm, "NewForm");
Navigate(FormScreen1_1, ScreenTransition.None)

OnEdit

EditForm(SharePointForm1);
Set(ActiveForm, "EditForm");
Navigate(FormScreen1, ScreenTransition.None)

OnView

ViewForm(SharePointForm1);
Set(ActiveForm, "ViewForm");
Navigate(FormScreen1, ScreenTransition.None)

そして、SharePointIntegration コントロールの OnSave アクションでは、さきほどの変数に格納された値によって送信元のフォームコントロールを切り替えます。

OnSave

If(ActiveForm="NewForm", SubmitForm(SharePointForm1_1), SubmitForm(SharePointForm1))

さらに、OnCancel アクションも同様に変更しておきます。

OnCancel

If(ActiveForm="NewForm", ResetForm(SharePointForm1_1), ResetForm(SharePointForm1))

と、こんな感じかと思います。公式ブログでも同じものが紹介されていますので、詳細はそちらもご確認ください。

SharePoint custom forms: Build separate forms to create, show or edit the list item.
https://powerapps.microsoft.com/ja-jp/blog/separate-custom-forms/

さいごに

PowerApps で SharePoint モダンリストのフォームをカスタマイズするのは、PowerApps の基本的な使い方を知っていれば簡単です。ただし、SharePoint モダンリスト フォームのカスタマイズ特有の SharePointIntegration コントロールや、作法もありますので、知っておくと助かる機会が多くありそうでした。

公式の情報は下記のリンク先にあります。

SharePoint フォームの統合について
https://docs.microsoft.com/ja-jp/powerapps/maker/canvas-apps/sharepoint-form-integration

SharePoint でも PowerApps を活用してより便利にしたいところですね。