---
sourceDocument: Yokohama モバイル構成とナビゲーション
sourceDocumentLink: https://servicenow-prod.fluidtopics.net/r/ja-JP/yokohama/mobile

 Release :

    - yokohama

ft:locale :

    - ja-JP

ft:publication_title :

    - Yokohama モバイル構成とナビゲーション

ft:clusterId :

    - mobile

bundleId :

    - mobile

workflow :

    - evelopment, Data and Analytics


---

# 入力フォーム画面の説明要素の構成

# 入力フォーム画面の説明要素の構成 {#ariaid-title1}

* リリースバージョン: Yokohama
* 
* 更新日 2025年03月05日
* 
* ![](https://www.servicenow.com/docs/portal-asset/ico-clock) 所要時間：5分

入力フォーム画面内の入力フィールドの前に、単純なテキスト、リッチテキスト、画像などの説明要素を追加します。この追加の画面情報は、ユーザーにコンテキストを提供し、ユーザーが入力フォームにデータを入力するときに何が必要かをよりよく理解できるようにします。

## 始める前に

必要なロール：アドミン

## このタスクについて

入力フィールド、入力フィールドを含むセクション、または入力のない入力フォームセクションに説明要素を追加できます。説明要素には、単純なテキスト、リッチテキスト、または入力の前にある画像を選択できます。  
説明要素を作成する前に、次の要素を構成する必要があります。

* 少なくとも 1 つの要素識別子を含むデータソース。データソースを使用すると、説明要素から入力フォーム画面へのマッピングが容易になります。詳細については、「[データソース](https://servicenow-prod.fluidtopics.net/tI8ap~8~udoqxy6MwBfjYg "データソースは、要素識別子を使用して UI 要素を特定のデータベースフィールドにマップするロードメカニズムです。データソースを使用してデータを取得し、入力フォーム画面に表示します。")」を参照してください。
* 入力セクションまたは入力フォームセクションのいずれかになることができるレコードセクション:
  * 入力フォームセクションは、入力フォーム画面の定義された領域にある入力のグループで、通常は定義されたヘッダーを使用します。
  * 入力は、ユーザーが入力フォーム画面内で入力する個々のフィールドです。入力は、セクション内に配置することも、セクションから独立して配置することもできます。
  {#descriptive-elements-script__ul_lfl_bbn_p2c}

{#descriptive-elements-script__ul_cdy_z1n_p2c}  
注:  
各入力または各入力フォームセクションに複数の説明要素が存在する場合があります。ただし、すべての入力の説明要素ごとに個別のレコードを作成する必要があります。
説明要素を作成する場合は、次のステージが必要です。まず、説明要素の内容と関連内容を宣言します。次に、説明要素が入力セクションまたは入力フォームセクションに関連付けられているかどうかを判断します。次に、選択した説明要素の各タイプの属性を作成します。最後に、説明要素を入力フォーム画面の UI 要素にマップします。{#descriptive-elements-script__table_pw5_xys_p2c__entry__2}

| 入力フォーム画面上の画像とリッチテキストの説明要素 | 入力フォーム画面上の画像とプレーンテキストの説明要素 |
|-|-|
|   |   |
[ ]

{#descriptive-elements-script__table_pw5_xys_p2c}

## 手順

1. 移動先 すべてシステムモバイルモバイルアプリビルダー.  
   モバイルアプリビルダー が新しいブラウザータブで開き、アプリケーションスコープ選択画面が表示されます。
2. 作業しているアプリケーションスコープを検索し、アプリケーションスコープの名前を選択します。  
   モバイルアプリビルダー カテゴリのホーム画面が表示されます。
3. メニューから \[ すべてのモバイルレコード \] を選択します。
4. \[レコード タイプ\] フィールドから、説明要素 \[sys_sg_descriptive_element\] を選択し、 \[新規\] を選択します。
5. 必要に応じて、次のフィールドに入力します。  
   {#descriptive-elements-script__table_msb_ybn_p2c__entry__2}

   | フィールド | 値 |
   |-|-|
   | プロパティ ||
   | 名前 | 説明要素の一意の名前。 |
   | ラベル | 説明要素の上に表示されるラベル。 |
   | 設定 ||
   | 説明要素タイプ | 次の 3 つの説明要素を使用できます。 * リッチテキスト:太字、下線、斜体、箇条書き、番号付きリスト、フォントの色などの HTML タグをサポートします。 * テキスト:リッチテキスト要素のないプレーンテキスト。 * 画像:説明要素に付随する 1 枚の画像。 {#descriptive-elements-script__ul_jll_3cn_p2c} 注: \[ 説明要素 \] で利用可能な属性 属性フィールドは、選択した説明要素によって異なります。 |
   | 順序 | この説明要素が入力の前に表示される順序。 |
   | 説明要素の配置 ||
   | 親テーブル | 指定した領域内に説明要素を配置するオプション。次のオプションが使用可能です。 * 入力:説明要素が入力の前にあります。 * 入力フォームセクション:説明要素は特定のセクション内に存在します。 {#descriptive-elements-script__ul_ndx_qcn_p2c} 注: 通常、説明要素はセクションの上部に配置されます。ただし、入力を表示せずにセクション内に説明要素を含めるオプションもあります。構成手順については、ステップ 8 を参照してください。 |
   | 親レコード | 親テーブルが関連する入力セクションまたは入力フォームセクション。 |
   | 説明要素の属性 | 属性を使用して、説明要素がモバイルデバイスでどのように表示されるかを決定します。\[ 新規 \] を選択して属性を追加します。次の属性は、すべての説明要素タイプ (リッチテキスト、テキスト、および画像) で使用できます。 <var class="keyword varname">DataSourceId</var> :   作業しているデータソースの一意の識別子。この属性は、説明要素に使用する必要があります。 <var class="keyword varname">ElementIdentifier</var> :   各 UI 要素の一意の識別子。この属性は、説明要素に使用する必要があります。 注: この識別子は、データソーススクリプトで <var class="keyword varname">valuesMapper.addRecordMapping</var> としてリストされます <var class="keyword varname">MergeWithNextUIElement</var> :   入力フォーム画面には説明要素がこのように表示されます。入力または入力セクションの間にギャップを作成するには、 <kbd class="ph userinput">true</kbd> としてマークします。 注: 次のデフォルト値が存在します。 * <kbd class="ph userinput">入力</kbd>タイプの親テーブルの値は <kbd class="ph userinput">false</kbd> です。 * <kbd class="ph userinput">入力フォームセクション</kbd>タイプの親テーブルの値は <kbd class="ph userinput">true</kbd> です。 {#descriptive-elements-script__ul_kqj_tdn_p2c} 次の属性は、説明要素タイプ (画像) でも使用できます。 <var class="keyword varname">AlternativeText</var> :   代替テキストを入力してユーザーに読み上げる機能。 <var class="keyword varname">MediaHeight</var> :   画像の高さ。デフォルト値は 210 ピクセルです。 <var class="keyword varname">スケーリング</var> :   \[ 合わせる\] を選択して、フレームが画像に収まり、アスペクト比が維持されるようにします。\[ 塗りつぶし\] を選択すると、画像がトリミングされてフレーム全体に表示されます。これがデフォルト値です。 |
   [ ]

   {#descriptive-elements-script__table_msb_ybn_p2c}
6. 説明要素の \[名前 \] を入力します。
7. 入力値の前に表示する説明 要素タイプ (リッチテキスト、テキスト、または画像) を選択します。
8. \[ 親テーブル\] フィールドで、説明要素を入力の前またはセクションの先頭に表示するかどうかを選択します。  
   注:  
   通常、説明要素はセクションの上部に配置されます。ただし、入力を表示せずにセクション内に説明要素を含めるオプションもあります。このレイアウトを適用するには、次の構成を適用する必要があります。
   1. Web ベースの UI を開きます。
   2. 移動先 すべてsys_sg_section_attribute.list.
   3. \[新規\] を選択します。
   4. \[ 名前 \] フィールドに、属性名 <var class="keyword varname">HideIfDescriptiveOnly</var> を追加し、値を <kbd class="ph userinput">false</kbd> に設定します。この設定は、そのセクションに入力がない場合でも説明要素が表示されるように設定します。
   5. \[ 選択\] フィールドで、この属性が適用される入力フォームのセクションを選択します。
   6. \[送信\] を選択します。
   {#descriptive-elements-script__ol_j2f_dmj_rfc}
9. \[ 親レコード\] フィールドで、親テーブルが関連する入力セクションまたは入力フォームセクションを選択します。
10. \[ 説明要素の属性 \] フィールドで、\[ 新規 \] を選択し、次の操作を行います。  
    1. \[名前\] フィールドで \[DataSourceID\] を選択します。
    2. \[ 値\] フィールドで、データソーススクリプトにリストされている値を選択します。
    3. \[保存\] をクリックします。
    4. \[名前\] フィールドで \[ElementIdentifier\] を選択します。
    5. データソーススクリプトに記述されているとおりに、要素識別子を入力します。
    6. \[保存\] をクリックします。

    {#descriptive-elements-script__ol_a4l_p2n_p2c}  
    注:  
    データソースと要素識別子に使用できる値は、データソーススクリプトに詳細が記載されています。この説明要素に使用する要素識別子へのマッピングを含むデータソースを選択します。
11. **オプション:** 作業している説明要素に関連するその他の説明要素の属性を選択します。
12. \[保存\] をクリックします。