1.概要
サブフォームコントロールを用いて作成された、リスト形式で繰り返し表示されるサブ画面をサブフォームリストと呼びます。サブフォームリストを使うと、入力フォームなどを配置したサブ画面をリスト形式で繰り返し表示させることができます。
この記事では、サブフォームリストを活用したアプリの開発について解説します。以下のようなケースに対応できますのでぜひご覧ください。
- 入力項目を繰り返して、表形式で表示したい
- 同じ項目を繰り返し表示させる画面をつくりたい
- データベースと連動した表(リスト)をアプリに設置したい
解説で使用しているサンプルプロジェクトを以下よりダウンロードすることができます。ぜひご活用ください。
2.動作イメージ
3.実装方法(重点事項のみ解説)
画面とデータテーブルを作成のうえで、データフォームの設定をします。データフォームは、画面とテーブルを紐付けることで、データの読み書きなどが実現できるようになる便利な機能です。ぜひ活用してみてください。
3-1.画面の作成
3-1-1.メイン画面
以下の要領で新規に画面を作成し、その中にサブフォームを配置します。サブフォームは、コントロールバーから「サブフォーム」を選択し、画面上でドラッグすることで配置できます。
①メイン画面
②サブフォーム:メイン画面の中に別の子画面を配置したものをサブフォームと呼びます。
3-1-2.サブ画面
今回は、ヘッダー画面とリスト画面の2つのサブ画面を作成します。
ヘッダー画面
サブフォームリストのヘッダー領域です。入力項目の名称として、ユーザーID、ユーザー名、店舗とします。画面を新規に作成し、画面の高さは項目が入力できる程度、幅はサブフォーム領域の幅と合わせます。ラベルを活用して項目を入力します。以下のような横長の画面ができれば完成です。
リスト画面
サブフォームリストの入力領域です。ユーザーID、ユーザー名、店舗の入力を可能とするため、3つの領域を作成します。サンプルではユーザーIDとユーザー名はテキストボックス、店舗はコンボボックスとしています。また削除や編集などのボタンを適宜配置します。
3-1-3.サブフォームのパラメーター設定
3-1-1で作成したメイン画面のサブフォーム領域を選択し、各種パラメーターの設定を行います。
「オブジェクト」>「動作設定」から、「ヘッダー」に3-1-2で作成したヘッダー画面を、「明細」に同じく3-1-2で作成したリスト画面を指定します。その際、下部にある「リスト表示」に必ずチェックを付けておいてください。
3-2.データテーブルの作成
DB機能からデータテーブルの作成および設定を行います。新規にデータテーブルを生成したうえで、ユーザーID、ユーザー名、店舗の入力内容を保存できるように、それぞれ以下の要領で項目を設定します。
3-3.データフォーム設定
3-1で作成したリスト画面を選択し、データフォームの設定を行います。
まず、リスト画面全体を選択した状態で「データ」の「テーブル名」に3-2で作成したデータファイルを指定します。これによりデータフォームが有効となり、リストに入力した情報がデータテーブルへ反映(追加、更新)されるなど、画面とデータテーブルの紐付けがなされます。また、「新規行表示」にチェックを入れることで、未入力のリスト画面がサブフォーム内に自動的に表示されるようになります。
次に、以下のように、リスト画面内に配置した各コントロールにも、データフォームの設定をします。
各コントロールを選択したうえで、「データ」>「内容」から「フォーム」を選択し、「フィールド名」として、テーブル内の該当する項目を指定します。
3-4.削除処理の設定
削除処理はデータフォームだけでは実装することができないため、別途削除ボタンを作成し、削除処理のロジックを実装します。
3-4-1.データ削除ロジックの作成
ロジックは以下となります。重要な点のみ解説します。(緑色の箇所)
#6:★DB削除
選択された行のidと一致するレコードが指定したデータテーブルに存在すれば、当該レコードを削除する処理となります。パラメーターの設定は以下のとおりです。「tbl_User」テーブルの「id」フィールドを検索し、上の#5:「id」の処理で取得したidと同じidのフィールドを削除します。
13:★削除後読込 【重要】
削除した結果を画面に反映するための処理となります。
サブフォーム内を再描画する場合は「データセット>読込」を使用します。「コントロール>更新」ロジックでは再描画されないので注意してください。
3-4-2.ロジックの登録
リスト画面の削除ボタンに、いま作成したロジックを登録します。プロパティーエリアの「オブジェクト」>「動作設定」から「実行処理」にロジックを登録します。
以上でサブフォームリストの設定は完了です。
メニューアイコンの「実行」ボタンからアプリを実行してみましょう。サブフォームリストにテストデータを入力でき、入力後に新しいサブ画面が自動的に表示されることを確認しましょう。
また、メニューアイコンの「停止」ボタンでプロジェクトの実行を停止し、DB設計機能から「格納データ」を確認できます。「Reload」ボタンを押し、先ほど入力したテストデータが確認できれば成功です。サブフォームリストの削除ボタンから、データベースのデータが削除できることも、同様の手順で確かめることができます。