グループのラベルを用意する

最終更新日: 2022年12月24日
R8 | R9

グループ名のラベル表示

デフォルト設定の場合グループはグレーの枠で囲まれて表示されます。
これをモデル項目と同じようにラベル表示にすることができます。(下図参照)

図1 グループ名のラベル表示

制約

このページで説明するレイアウトは「HTMLレイアウト」のみ対応しています。「CSSレイアウト」には対応していません。

ラベル表示×項目の縦並び

グループをラベル表示とし、その中の項目を縦並びで表示する例です。

図2 ラベル表示×項目の縦並び

設定方法

ここでは「個人情報」というグループを例に説明します。

図3 レイアウトを用意する
  1. モデルの編集画面で「リポジトリ」タブを選択し、さらにその下の「グループ・タブ」タブをクリックして選択します。
    図4 グループ・タブの設定
  2. グループの表示方法を「縦方向にグループ化」を選択し、並び方向は「縦↓」を選択します。
    これで設定は完了です。
    図5 項目の並び方向の設定

ラベル表示×項目の横並び

グループをラベル表示とし、その中の項目を横並びで表示する例です。

図6 ラベル表示×項目の横並び

設定方法

  1. モデルの編集画面で「リポジトリ」タブを選択し、さらにその下の「グループ・タブ」タブをクリックして選択します。
    図7 グループ・タブの設定
  2. グループの表示方法は「縦方向にグループ化」を選択し、並び方向は「横→」を選択します。
    これで設定は完了です。
    図8 項目の並び方向の設定

ラベルの幅を合わせる

複数のグループを組み合わせて表示することができますが、そのままではラベルの幅が不揃いになります。
ここでは、グループ同士のラベル幅を揃える方法を説明します。

図9 ラベル幅を揃える

設定方法

  1. モデルの編集画面で「リポジトリ」タブを選択し、さらにその下の「グループ・タブ」タブをクリックして選択します。
    図10 グループ・タブの設定
  2. レイアウトのラベル幅を指定します。ここでは「100」とします。
    ※数値のみ入力した場合、単位はピクセル(px)と解釈されます。画面幅に対する比率(%)で指定する場合は「10%」のように単位まで入力します。
    図11 レイアウトのラベル幅

参考:モデル項目の幅も合わせる

下図のように、モデル項目のラベル幅も揃える場合の設定方法です。

図12 モデル項目の幅も揃える

  1. モデルの編集画面を開き、歯車アイコン>「詳細定義一括設定」をクリックします。
    図13 詳細定義一括設定を開く
  2. 一括設定ウインドウが開きます。
    リポジトリキー欄で「presentation/displayitem/@labelwidth:ラベルの幅」を指定します。
    (ここに「ラベルの幅」などキーワードを入力すると該当するものがヒットします)
    図14 レイアウトのラベル幅
  3. 各項目の値を、先程レイアウトのラベル幅として指定した数値を入力します。
    ※数値のみ入力した場合、単位はピクセル(px)と解釈されます。画面幅に対する比率(%)で指定する場合は「10%」のように単位まで入力します。
    図15 ラベルの幅を指定する