【今回はPatch関数を使用して、ギャラリーと併存した便利な追加・修正画面を作成します】
- 従来は「一覧画面」と「追加・修正画面」が分かれており、操作に手間がかかりました。
- 今回は一覧からレコードを選びながら、その場で追加・修正できる便利な画面を作成します。
- 仕組みのポイントは 変数を使って「新規」か「修正」かを判定すること です。
- 変数が空白なら新規追加、値が入っていれば修正更新というシンプルな切り替えです。
- SUBMITボタンの処理には Patch 関数を使用します。
- Patch 関数の文法は以下の通りです：
Patch(データソース, 対象レコード, {列ごとの値}) - 新規の場合は「対象レコード」に Defaults(データソース) を指定します。
- 修正の場合は「対象レコード」に ギャラリーで選択したレコード（変数） を指定します。
- これにより、同じ画面で「新規追加」と「修正更新」を効率的に切り替えられるようになります。
上のGIF画像では、右のギャラリー/一覧から選択したデータが左の画面に設定されています
一方、画面左上の＋ボタンを押すと左の画面には空欄が設定されます
そして、
SUBMITボタンを押すと、右の画面が「新規用」として設定されている場合には「レコードの新規追加」が行われます
右の画面が「修正用」として設定されている場合にはレコードの修正が行われます
今回は「変数」を使って新規か修正かを判定します
次の記事にて紹介する コレクション は役割が少し異なりますので注意が必要です
- 変数：単一の値やレコードを保持し、画面内の状態切り替え（新規／修正）に利用する。
- コレクション：複数のレコードをまとめて保持できる一時的なデータセットで、一覧表示や複数データの操作に活用できる。つまり、変数は「今どのレコードを扱うか」を示すピンポイントの情報、コレクションは「画面内で扱うデータのまとまり」を保持する仕組みです。
目次
ポイント
変数を使用して、新規と修正とを切り替えます
変数が空白の場合は新規。変数が空白でない場合は修正となります
そして、
前述のようにレコードを追加したり、修正したりするPatch関数の中身も変数が空白かどうかにより変更できるようにします
データソース
今回の記事では、アプリのデータソースはSharePointリストを使用します
テーブル名はIDEAになります
TITLE-1行テキスト
NAME-1行テキスト
DECRIPTION-複数行テキスト
CHOICE-選択肢（NEW,FINISH,STOP）
アプリ画面の用意
「作成」⇒「空のアプリ」からアプリを作成します
アプリの名前を付けたら、まずテキストボックスを３つ用意し、加えてギャラリー*も用意します
*データソースの設定が必要です
加えて「SUBMIT」ボタンも加えます
新規追加の仕組み作成
Patch関数
レコードを追加・修正するPatch関数を作成する前にテキストボックスの名前を整理しておきます
上記のtxtはテキストボックスの意味合いになります
そして、txtの後のTitleはテキストボックスの名称になります
各テキストボックスの内容とCHOICEの内容を、SUBMITボタンの「OnSelect」からPatch関数にて追加することになります
Patch(IDEA,Defaults(IDEA),{Title:txtTitle.Text,NAME:txtNAME.Text,DECRIPTION:txtDESCRIPTION.Text,CHOICE:{Value:”NEW”}})
Patch関数の文法は以下の通りとなります
Patch(データソース,データソース内の対象レコード,{追加及び変更内容/列ベース})
2番目の引数、対象のレコードについては新規の場合は「Defaults(テーブル名)」で設定します
追加する列が「選択肢」の場合には「列名:{Value:“選択肢”}」と設定します
修正の仕組みの作成
選択内容にて変数設定
ギャラリーにて修正をしたい内容を選択した場合には、選択内容が変数/varIdeaに設定されるようにします
こちらは「OnSelect」を選択した上で、SET関数により変数を設定します
各テキストボックスは「Default」を選択した場合、変数に連動して内容が反映されるようにします
新規追加と修正の切り替え
＋ボタンを追加し、「OnSelect」にSet関数を設定します
こうすることで＋ボタンを押すと、変数：varIDEAに空白が設定されます
変数に空白が設定されると、各テキストボックスも連動して空白が設定されます
ここで前述のSUBMITボタンの「OnSelect」の内容も変更します
対象レコードを指定する引数の箇所を、変数:varIDEAが空白なら新規レコード、空白でない場合はギャラリーで選択したレコードが変数を通じて間接的に反映されるようにします
これで新規追加と修正の切り替えが行えるようになりました
その他
ギャラリーの並び順の変更
レコードの追加や修正があった場合にはSORT関数を使用し、ギャラリーの一番上に表示されるようにして追加と修正内容の確認を行いやすくします
選択箇所の色を変更
ギャラリーの選択箇所の色が変わるようにします
ギャラリーの「TemplateFill」の欄に次のようにIF関数を設定します
If(ThisItem.IsSelected,AliceBlue,RGBA(0, 0, 0, 0))
これで選択箇所がAliceBlue色に変るようになります
複数行テキストの設定
複数行テキストのテキストボックスのモード設定は「複数行」に設定しておきましょう
＜まとめ＞
今回はPatch関数を使用して、レコードの追加や修正を行う画面を作成しました
変数の内容により、追加と修正を切り替えるのが大きなポイントです
今回の内容は、Patch関数の箇所以外もアプリの内容を充実させるためのヒントが満載です
ぜひ取り組んでみてください
コメントを残す