サポート > リポジトリ > レイアウト > レイアウトラベルを独立して用意する

レイアウトをパネルで表現するのではなく、独立したラベルとして表現する方法を説明します。

レイアウトのラベルを独立して用意した例を図1に示します。

図1 レイアウトラベルを独立して用意する

レイアウトの定義

「個人情報」というレイアウトを用意します。

図2 レイアウトを用意する

リポジトリの編集

「リポジトリ」タブを開きます。「レイアウト名」タブには、用意した「個人情報」が含まれています。ここはそのまま利用します。

図3 レイアウト名の確認

「グループ・タブ」を開きます。グループの表示方法を「縦方向にグループ化」に変更します。

図4 「縦方向にグループ化」を設定する (1)
図5 「縦方向にグループ化」を設定する (2)

レイアウトのラベルを独立し、横並びレイアウトを適用した例を図4に示します。

図4 レイアウトラベルを独立させ、横並びレイアウトを適用する

リポジトリの編集

「個人情報」レイアウトのグループの表示方法を「縦方向にグループ化」とします。また、並び方向を「横」とし、表示比率を指定します。並び比率は50%,50%としています。

図5 リポジトリを編集する

横並びと縦並びのグループを用意し、それぞれレイアウトのラベルを独立した例を図6に示します。

図6 二つのレイアウトを並べて表示

レイアウトの定義

「個人情報」と「会社情報」の二つのレイアウトを用意します。

図7 レイアウトの定義

リポジトリの編集

それぞれのレイアウトを「縦方向にグループ化」とします。

図8 縦方向にグループ化を指定する

ラベル幅を揃えた例を図9に示します。ラベル幅を100(px)としています。

図9 ラベル幅を揃える

リポジトリの編集

レイアウトのラベル幅を指定します。ここでは「100」とします。数値のみを記述してください。単位はピクセル(px)です。

図10 レイアウトのラベル幅

あわせて、レイアウト外の「面会日」「メールアドレス」項目のラベル幅も調整します。 「出力制御>詳細画面」タブにある「スタイル>ラベルの幅」を指定します。数値のみを指定すると、単位がピクセル(px)と解釈されます。

図11 モデル項目詳細定義
Wagby Developer Day 2018