• IT助成金利用
  • 無料デモ紹介ZOOM等オンラインでのご相談も可能です
  • お問い合わせ

※ ワンダーロボ設計書および関連する自動開発手法について、すべての著作権はワンダフルフライ株式会社に帰属します。

1.4 表形式と単票形式の画面レイアウトを使い分けよう~上級編~

表形式と単票形式の画面レイアウトを使い分けよう!

本記事では、ワンダーシートを利用して、1つのテーブルに対して表(グリッド)形式と単票形式の画面を作成する方法について詳しく解説します。

👥 クラス名簿の例

例として、クラス名簿を作りたいと考えてみてください。 クラスには、たくさんの生徒の名前、出席番号、好きな教科などの情報がありますよね。先生も生徒もその情報を簡単に見たり、入力したりできる方法があると便利です。

✨ ワンダーシートの特徴

ワンダーシートを使えば、1つのクラス名簿(データ)を、2つの「見方」で見られるようにすることができます:

  • 1. 表(グリッド)形式:生徒全員の情報が表のように並んでいる見方です。
  • 2. 単票形式:一人ひとりの情報を詳しく見られるカードのような見方です。

📘 どうやって使い分けるの?

  • 1. 表(グリッド)形式では、クラスのみんなの名前や出席番号を一覧で確認できます。先生が「全員の出席番号や名前を一度に見たい!」と思ったときに便利です。
  • 2. 単票形式では、1人の生徒の情報を詳しく見ることができます。「この生徒の好きな教科やメモを追加したい」というときに便利です。

📘 すべてのデータを1つの名簿に保存

どちらの形式で見ても、すべての情報は1つの「クラス名簿」に保存されるので、データがバラバラにならないのがポイントです。たとえば、表の形式で新しい生徒の情報を追加すると、単票形式でもすぐにその生徒が見られるようになります。

📘 まとめると…

ワンダーシートを使えば、1つのクラス名簿を作るだけで、先生や生徒が見たい形式(一覧表か個別カード)で見ることができます!これで、データをまとめたり、更新したりするのがとても簡単になります。

この方法は、異なる入力画面レイアウトを使用しても、すべてのデータを同じテーブルに保存し、管理を一元化することを可能にします。

⚙️ 設定方法

今回は、以下のような使い方を例として紹介します。

1.表(グリッド)形式⇒管理者側でのデータ照会、編集用の画面 2.単票形式⇒各ユーザー側でのデータ編集用の画面
    • 1.テーブルを作成

      テーブル設計のシートを作成します。

       ※テーブル設計を作成しなくてもテーブルは作れます。こちらを参照してください。
         テーブル設計シートなしで生成してみよう!
    • 2.1つ目の画面を作成

      ここで作成したテーブル設計シートは、次に作成するいずれかの画面レイアウトとまとめて1つのファイルにしてください。

      ↓↓テーブル設計シートを作成↓↓

      テーブル設計シート作成
    • 2.1つ目の画面を作成

      1つ目の画面レイアウトを作成します。例ではまず表(グリッド)形式の画面レイアウトを作成します。この時、1で作成したテーブルの項目を設定します。

      ↓↓1つ目の画面レイアウトを作成↓↓

      1つ目の画面レイアウト作成

      各項目に、1で作成したテーブルとテーブル項目を設定します。

      ↓↓テーブル設計に合わせて画面の各項目を設定↓↓

      テーブル設計に合わせて画面項目を設定

      画面詳細設計のシートも合わせて作成します。

      ↓↓画面詳細設計シートを作成↓↓

      画面詳細設計シート作成
    • 3.2つ目の画面レイアウトを作成

      2つ目の画面レイアウトを作成します。例では単票形式の画面レイアウトを作成します。この時、1つ目の画面レイアウトと同様に、1で作成したテーブルの項目を設定します。 また、画面詳細設計シートの「画面名」が他の画面レイアウトの画面名を重複しないよう注意してください。

      • OK:「資産管理継続」「資産管理_継続」「継続用」etc…
      • NG:「資産管理」※「2.1つ目の画面作成」で作成した画面名と重複するため

      ↓↓2つ目の画面レイアウトを作成↓↓

      2つ目の画面レイアウト作成

      ↓↓各画面レイアウトの画面名が重複しないように設定↓↓

      画面名の設定

      ↓↓テーブル設計に合わせて画面の各項目を設定↓↓

      テーブル設計に合わせて画面項目を設定
    • 4.ファイルをアップロードして生成

      作成した各画面レイアウトをアップロードして、デザインモードで生成します。 この時、テーブル設計シートとセットにしているファイルから生成するようにしてください。 そうすることで先にテーブルが生成されるので、以降の生成がスムーズに実施できます。

      ↓↓ファイルをアップロードして生成↓↓

      ファイルアップロードと生成

      ↓↓使用モードで生成されている事を確認↓↓

      使用モードでの生成確認

      ↓↓他の画面も同様に生成↓↓

      他の画面の生成
  • 5.使用モードからデータを入力

    各画面が生成できていることを確認出来たら、使用モードからデータを入力します。今回は下記の手順でデータを入力します。

    • ①表形式の画面からデータを入力
    • ②単票形式の画面からデータを照会して更新
    • ③表形式の画面で更新されたデータを確認

    ↓↓表形式の画面からデータ入力して保存↓↓

    表形式のデータ入力

    ↓↓単票形式の画面からデータを検索↓↓

    単票形式のデータ検索

    ↓↓〔編集〕から詳細画面を開いて情報を更新して保存↓↓

    詳細画面の情報更新

    ↓↓表形式の画面から更新されたデータを確認↓↓

    更新データの確認

    上記のように、データが保存されるテーブルを同じテーブルに設定することで、表示する画面レイアウトが違っても、同じデータを照会、更新することができます。

  • 6.応用編~「使用モードリンク取得」機能を使う方法~

    「使用モードリンク取得」機能を利用して、単票形式のリンクを各ユーザーに展開⇒それぞれで入力したデータを表形式でまとめて参照といった使い方もできます。
    例えば、各部署ごとにExcelファイルを入力して管理部門に送付後、部署ごとに送られてきたファイルを1ファイルにまとめ直す。というような作業を効率化できます。

    ↓↓ 使用モードリンク取得画面を開く ↓↓  ↓↓ 使用モードリンク取得画面 ↓↓

    • 画面モード選択:表示画面を「新規画面」「更新画面」の設定
    • 有効時間:リンクが有効な時間を設定
    • 時間単位:リンク有効時間の時間単位の設定
    • 読み取り専用:編集の可否を設定。チェックをつけると編集不可
    • パラメータ:表示する際のパラメーターを指定
    「新規画面」「更新画面」イメージ: ↓↓ 新規画面 ↓↓ ↓↓ 更新画面 ↓↓ 実際にリンクを作成する方法: リンク設定の各項目を入力 > 〔使用モードリンク取得〕ボタンをクリック > 〔リンク複製〕ボタンをクリックするとクリップボードにリンクがコピーされます
       
    ↓↓リンク設定画面画面 ↓↓

    ↓↓〔リンク複製〕ボタン ↓↓ これで使用モードのリンクをクリップボードにコピーできたので、ぜひ活用してください!
    また、今回のような表形式と単票形式や、表形式と表形式など、色々な画面レイアウトで利用することができます。

🔍 まとめ

これで、入力設定がもっと簡単に、そして直感的に使えるようになります!
必要な情報は自動で入力され、見せるべき情報はしっかり管理されるので、操作ミスも減り、データの整合性も保たれます。
これらの設定を活用すれば、ユーザーにとっても管理者にとっても、快適でスムーズな作業環境が整います。もう面倒な入力作業に悩まされることはありません!