とっくの昔に記事にしたつもりがしていなかったことに気づきまして、今さらながら記事にしております。

動的フォームの便利さは知りつつも、「なんだかレイアウトが気に入らないわ」と思われていたそこのあなたへ、今日の記事をお届けします。

◇ SALESFORCE ヘルプ＞ドキュメント＞SALESFORCE リリースノート＞Salesforce　Summer'23 リリースノート＞カスタマイズ＞Lightningアプリケーションビルダー＞項目セクションの項目の横揃え

項目セクションの項目の横揃え

動的フォームの項目セクションコンポーネントの新しいプロパティを使用して、列全体の項目の配置を制御します。 [項目を横に揃える] プロパティを使用すると、項目の高さに差がある場合に複数列の項目セクションの項目が上方に折りたたまれなくなります。同じ行の隣接する項目が横に揃った状態になります。ただし、このプロパティが選択されていても、表示ルールによって特定の項目が非表示になっていると、列の項目は空白を埋めるために上に折りたたまれます。

対象: この変更は、Group Edition、Professional Edition、Enterprise Edition、Performance Edition、Unlimited Edition、Developer Edition の Lightning Experience に適用されます。

方法: 新しいプロパティを表示するには、Lightning アプリケーションビルダーで動的フォーム対応ページの項目セクションコンポーネントをクリックします。

たとえば、取引先項目が含まれる同じ項目セクションの 2 つのバージョンを次に示します。左の画像は、新しいプロパティが選択されたいない状態の動作を表しています。右は、[配置(横位置)] 設定が選択されていて、[Web サイト] 項目が上に折りたたまれずに [取引先名] 項目と水平に並んだ状態になっています。

最初に結論（？）から言いますと、
こうだったものが

こうなります。

中原中也の『夏の日の歌』です

スッキリ綺麗なレイアウトに！

プレリリース組織で設定箇所を確認しました

Lightningページを編集し、動的フォームの設定画面を表示します。
※基本的な流れは「動的フォームで状況にあわせた項目を表示する」でご紹介しております。現在は、最初の有効化の作業は不要です。

今回は、
カスタムチェックボックス項目「カスタムチェック」にチェックが入ったら、ロングテキストエリア「説明」が表示される

のように動的フォームを設定します。

ここまではこれまでの動的フォームと変わりありません。

そして、今回の項目セクションの項目の横揃えのための設定を行います。

一応拡大しておきます。
コレにチェックを入れます。

あとはいつものとおり保存して、必要であれば有効化します。

ひとこと

ちょっとしたことですが、ユーザにとっては影響が大きいですよね。あとは「空白スペース」が設定できさえすれば、動的フォームのページレイアウトが自由自在になりますね。
Salesforceさん、引き続きよろしくお願いします！

-------------------------------------------
「空白スペース」問題については↓で取り上げています。
IdeaExchange：Lightningページの項目セクションで「空白スペース」を設定したい

Ideaはこちらです。
◇ Salesforce ＞IdeaExchange ＞Ideas ＞Dynamic Forms: Need Blank Space's in lightning record pages & for field sections
賛同いただけましたら、Upvoteをお願いします。
-------------------------------------------

プレリリース組織で設定箇所を確認しました

ひとこと

Summer'23関連記事

Summer'23 動的フォームの「項目を横に揃える」でお行儀のいいレイアウトになる

プレリリース組織で設定箇所を確認しました

ひとこと

Summer'23関連記事

Summer'23　動的フォームの「項目を横に揃える」でお行儀のいいレイアウトになる