フォームビルダー入門ガイド creating-an-adaptive-form
AEM Formsのフォームビルダーを使用すると、魅力的でレスポンシブ、かつ動的でアダプティブなフォームを作成できます。 プロフェッショナルなフォームを作成するフォーム作成者であっても、レスポンシブフォームをすばやく作成する必要があるフォーム作成者であっても、AEM Formsは使いやすいウィザードを提供します。 このウィザードはクイックタブナビゲーションを備えており、事前設定済みのテンプレート、スタイル設定、フィールド、送信オプションを簡単に選択できます。
開始する前に、使用可能な Forms コンポーネントのタイプについて学習します。
-
アダプティブフォームコアコンポーネント：標準化されたデータキャプチャコンポーネントです。 これらのコンポーネントは、デジタル登録エクスペリエンスのカスタマイズ機能を提供し、開発時間を短縮し、メンテナンスコストを削減します。 開発者は、これらのコンポーネントを簡単にカスタマイズし、スタイルを設定できます。 次にアクセスできます： https://aemcomponents.dev/ 使用可能なコアコンポーネントの動作を表示するには Adobeでは、アダプティブFormsの開発に、最新の拡張可能なコンポーネントを使用することをお勧めします.
-
アダプティブフォーム基盤コンポーネント：従来の（古い）データキャプチャコンポーネントです。 引き続きこれらを使用して、既存の基盤コンポーネントベースのアダプティブフォームを編集できます。 新しいフォームを作成する場合は、アダプティブフォームコアコンポーネントを使用してアダプティブフォームを作成することをお勧めします。
アダプティブフォームを作成するには、以下が必要です。
-
お使いの環境でのアダプティブフォームコアコンポーネントの有効化：アダプティブフォームコアコンポーネントは、プログラムを作成した時点でお使いの環境で有効になります。 お使いの AEM Cloud Service 環境でアダプティブフォームコアコンポーネントを有効にするには、最新版をインストールします。ご利用の環境でコアコンポーネントを有効にすると、アダプティブフォーム（コアコンポーネント） のテンプレートとキャンバステーマが環境に追加されます。AEM SDK バージョンが 2023.02.0 より前の場合は、2023.02.0 リリースより前にアダプティブフォームのコアコンポーネントがプレリリースの一部であったので、お使いの環境で
prereleaseフラグが有効になっていることを確認してください。 -
アダプティブフォームテンプレート：テンプレートは基本構造を提供し、アダプティブフォームのアピアランス（レイアウトとスタイル）を定義します。 これには、特定のプロパティやコンテンツ構造を有するフォーマット済みのコンポーネントが含まれます。 また、テーマと送信アクションを定義するオプションも提供されます。 テーマは、ルックアンドフィールと送信アクションを定義し、アダプティブフォームの送信時に実行するアクションを定義します。 例えば、収集したデータをデータソースに送信する場合などです。 クラウドサービスでは、空白という名前の OOTB テンプレートが提供されます。
blankテンプレートは、すべての新しい AEM Forms as a Cloud Service プログラムに含まれています。- パッケージマネージャーを使用して参照パッケージをインストールし、AEM Forms as a Cloud Service プログラムに
blankテンプレートを追加できます。 - 最初からアダプティブフォームテンプレート（コアコンポーネント）を作成することもできます。
-
アダプティブフォームのテーマ：テーマには、コンポーネントとパネル向けのスタイル設定の詳細が含まれます。 スタイルには、背景カラー、ステートカラー、透明度、配置、サイズなどのプロパティが含まれます。 テーマを適用すると、指定したスタイルが対応するコンポーネントに反映されます。
Canvasテンプレートは、すべての新しい AEM Forms as a Cloud Service プログラムに含まれています。 -
権限：forms-users グループにユーザーを追加します。forms-users グループのメンバーには、アダプティブフォームを作成する権限があります。 フォーム専用のユーザーグループの詳細なリストについて詳しくは、グループと権限を参照してください。
アダプティブフォームを作成 create-an-adaptive-form-core-components
-
Experience Manager Forms オーサーインスタンスにログインします。 Cloud インスタンスまたはローカル開発インスタンスの場合があります。
-
Experience Manager のログインページに資格情報を入力します。 ログイン後、左上隅の Adobe Experience Manager／Forms／フォームとドキュメント を選択します。
-
作成／アダプティブフォーム を選択します。 ウィザードが開きます。 ソースタブで、テンプレートを選択します。
テンプレートを選択すると、テンプレートで指定されたテーマと送信アクションが自動的に選択され、作成 ボタンが有効になります。 「スタイル」または「送信」タブを使用して、別のテーマや送信アクションを選択することができます。 選択したテンプレートでテーマが指定されていない場合、作成ボタンは無効のままです。 「スタイル」タブに進み、テーマを手動で選択することができます。
note note NOTE ご利用の環境に アダプティブフォーム（コアコンポーネント） テンプレートがない場合は、ご利用の環境のアダプティブフォームコアコンポーネントを有効にします。 ご利用の環境でコアコンポーネントを有効にすると、アダプティブフォーム（コアコンポーネント） テンプレートが環境に追加されます。 -
「スタイル」タブで、テーマを選択します。
-
選択したテンプレートでテーマを指定すると、ウィザードでテーマが自動的に選択されます。 「スタイル」タブから別のテーマを選択することもできます。
-
選択したテンプレートにテーマが指定されていない場合は、「スタイル」タブを使用してテーマを選択することができます。 この「作成」ボタンは、テーマが選択された後にのみ有効になります。
-
-
（オプション）「データ」タブで、データモデルを選択します。
-
フォームデータモデル：フォームデータモデル（FDM）を使用すると、異なるデータソースのエンティティやサービスをアダプティブフォームに統合することができます。作成するアダプティブフォームで、複数のデータソースに対するデータの取得と書き込みが必要になる場合は、フォームデータモデル（FDM）を選択します。
-
JSON スキーマ：JSON スキーマ コアコンポーネントベースのアダプティブフォームは、生成または消費されるデータの構造を表す JSON スキーマを関連付ける機能により、自社のバックエンドシステムとシームレスに統合できます。 この関連付けにより、作成者はスキーマの要素を使用して、アダプティブフォームにコンテンツを動的に追加できます。 スキーマの要素には、オーサリングプロセスでコンテンツブラウザーの「データモデルオブジェクト」タブから容易にアクセスできます。すべてのフィールドは、作成されたアダプティブフォームに自動的に追加されます。
デフォルトでは、関連付けられた JSON スキーマのすべてのフィールドが自動的に選択され、対応するアダプティブフォームコンポーネントに変換されるので、オーサリングプロセスを合理化できます。 ウィザードでは、チェックボックスを使用してアダプティブフォームに含めるフィールドを選択できる、さらに便利な機能が用意されています。
-
-
「送信」タブで、送信アクションを選択します。
-
テンプレートを選択すると、テンプレートで指定された送信アクションが自動選択されます。 「送信」タブから、別の送信アクションを選択することができます。 「送信」タブには、使用可能なすべての送信アクションが表示されます。
-
選択したテンプレートで送信アクションが指定されていない場合は、「送信」タブを使用して送信アクションを選択することができます
-
-
（オプション）「配信」タブで、アダプティブフォームの公開日または非公開日を指定することができます。
-
「作成」を選択します。 アダプティブフォームを保存するためのタイトル、名前および場所を指定するためのダイアログが表示されます。
- タイトル：フォームの表示名を指定します。 タイトルを指定すると、Experience Manager Forms ユーザーインターフェイス内のフォームを特定しやすくなります。
- 名前： フォームの名前を指定します。 指定された名前のノードがリポジトリーに作成されます。 タイトルを入力し始めると、名前フィールドの値が自動的に生成されます。 候補として入力された値は変更可能です。 「ドキュメント名」フィールドには、英数字、ハイフン、アンダースコアのみを使用できます。 無効な入力は、すべてハイフンに置き換えられます。
- パス：アダプティブフォームを保存する場所を指定します。 アダプティブフォームは、
/content/dam/formsanddocumentsに直接保存することができます。または、/content/dam/formsanddocuments/adaptiveformsなどのフォルダーを作成して、アダプティブフォームを保存することができます。 フォルダーをパスで使用する前に、必ずフォルダーを作成してください。 「パス」フィールドでは、フォルダーは自動的には作成されません。
-
「作成」を選択します。 アダプティブフォームが作成され、アダプティブフォームエディターで開きます。 エディターに、テンプレートで使用可能なコンテンツが表示されます。 アダプティブフォームのタイプに応じて、関連する JSON スキーマまたはフォームデータモデル（FDM）に存在するフォーム要素が、サイドバーの コンテンツブラウザー の「データモデルオブジェクト」タブに表示されます。
これで、 アダプティブFormsコアコンポーネント またはスキーマ要素を使用してアダプティブフォームを構築します。
アダプティブフォームのフォームモデルプロパティの編集 edit-form-model-core-components-based-adaptive-forms
-
アダプティブフォームを選択し、
-
「フォームモデル」タブをクリックし、フォームモデルを選択します。 アダプティブフォームにフォームモデルがない場合は、JSON スキーマまたはフォームデータモデル（FDM）を選択できます。 一方、アダプティブフォームが既にフォームモデルに基づいている場合は、同じタイプの別のフォームモデルに切り替えることもできます。 例えば、フォームが JSON スキーマを使用している場合、別の JSON スキーマに容易に切り替えることができます。同様に、フォームがフォームデータモデル（FDM）を使用している場合は、別のフォームデータモデル（FDM）に切り替えることができます。
-
「保存」を選択して、プロパティを保存します。
アダプティブフォームを作成するには、以下が必要です。
-
権限：ユーザーを forms-users に追加し、アダプティブフォームを作成するための権限をユーザーに付与します。フォーム専用のユーザーグループの詳細なリストについては、グループと権限を参照してください。
-
アダプティブフォームのテーマ：テーマには、コンポーネントとパネル向けのスタイル設定の詳細が含まれます。 スタイルには、背景カラー、ステートカラー、透明度、配置、サイズなどのプロパティが含まれます。テーマを適用すると、指定したスタイルが対応するコンポーネントに反映されます。テーマを作成するか、既存のテーマを読み込むことができます。一部のサンプル テーマでは、最新のアーキタイプをデプロイすることもできます。
-
アダプティブフォームテンプレート：テンプレートは基本構造を提供し、アダプティブフォームのアピアランス（レイアウトとスタイル）を定義します。 これには、特定のプロパティやコンテンツ構造を有するフォーマット済みのコンポーネントが含まれます。 また、テーマと送信アクションを定義するオプションも提供されます。 テーマは、ルックアンドフィールと送信アクションを定義し、アダプティブフォームの送信時に実行するアクションを定義します。 例えば、収集したデータをデータソースに送信する場合などです。 Cloud Service は、2 種類のテンプレートをサポートしています。
-
編集可能テンプレート：編集可能テンプレートを作成するか、既存の編集可能テンプレートを読み込むことができます。また、最新のアーキタイプをデプロイして、編集可能なテンプレートのサンプルを取得することもできます。
-
静的テンプレート：これらは従来のテンプレートで、Adobe Managed Services（AMS）およびオンプレミスの AEM Forms のインストール（AEM 6.5 Forms 以前）から移行する顧客にのみ推奨されます。 静的テンプレートに対する既存の投資を引き続き使用することができます。アダプティブフォームを作成する際には、編集可能なテンプレートを使用します。
-
アダプティブフォームを作成 create-an-adaptive-form-foundation-components
-
Experience Manager Forms オーサーインスタンスにアクセスします。Cloud インスタンスまたはローカル開発インスタンスの場合があります。
-
Experience Manager のログインページに資格情報を入力します。
ログイン後、左上隅の Adobe Experience Manager／Forms／フォームとドキュメント を選択します。
-
作成／アダプティブフォーム を選択します。ウィザードが開きます。
-
ソースタブで、テンプレートを選択します。
-
編集可能なテンプレートを選択すると、テンプレートで指定されたテーマと送信アクションが自動的に選択され、「作成」ボタンが有効になります。「スタイル」または「送信」タブを使用して、別のテーマや送信アクションを選択することができます。 選択した編集可能テンプレートでテーマが指定されていない場合、作成ボタンは無効のままです。 「スタイル」タブに進み、テーマを手動で選択することができます。
note note NOTE アダプティブフォームエディターを使用して、レコードのドキュメントテンプレートを作成することもできます。詳しくは、「アダプティブフォームエディターでのレコードのドキュメントのサポート」を参照してください。 -
静的テンプレートを選択すると、データ、スタイル、送信、配信、プレビューの各オプションは使用できなくなります。 アダプティブフォームを作成する場合は、編集可能なテンプレートを使用することをお勧めします。
-
-
「スタイル」タブで、テーマを選択します。
- 選択したテンプレートでテーマを指定すると、ウィザードでテーマが自動的に選択されます。 「スタイル」タブから別のテーマを選択することもできます。
- 選択したテンプレートにテーマが指定されていない場合は、「スタイル」タブを使用してテーマを選択することができます。 この「作成」ボタンは、テーマが選択された後にのみ有効になります。
-
（オプション）「データ」タブで、データモデルを選択します。
-
フォームデータモデル：フォームデータモデル（FDM）を使用すると、異なるデータソースのエンティティやサービスをアダプティブフォームに統合することができます。作成するアダプティブフォームで、複数のデータソースに対するデータの取得と書き込みが必要になる場合は、フォームデータモデル（FDM）を選択します。
-
JSON スキーマ：JSON スキーマは、組織内のバックエンドシステムによってデータが作成または使用される構造を表します。アダプティブフォームにスキーマを関連付けて、そのスキーマの要素を使用することにより、アダプティブフォームに動的コンテンツを追加できます。スキーマの要素は、アダプティブ フォームを作成するときにコンテンツブラウザーの「データモデルオブジェクト」タブで使用することができ、すべてのフィールドも作成されたアダプティブフォームに追加されます。
デフォルトでは、データモデルのすべてのフィールドが選択されます。 アダプティブフォームを作成すると、選択したすべてのデータモデルフィールドが、対応するアダプティブフォームのコンポーネントに変換されます。 ウィザードには、アダプティブフォームに含める必要のあるフィールドのみを選択するチェックボックスが表示されます。
-
-
「送信」タブで、送信アクションを選択します。
-
テンプレートを選択すると、テンプレートで指定された送信アクションが自動選択されます。 「送信」タブから、別の送信アクションを選択することができます。 「送信」タブには、使用可能なすべての送信アクションが表示されます。
-
選択したテンプレートで送信アクションが指定されていない場合は、「送信」タブを使用して送信アクションを選択することができます。
-
-
（オプション）「配信」タブで、アダプティブフォームの公開日または非公開日を指定することができます。
-
「作成」を選択します。アダプティブフォームを保存するためのタイトル、名前および場所を指定するためのダイアログが表示されます。
- タイトル：フォームの表示名を指定します。 タイトルを指定すると、Experience Manager Forms ユーザーインターフェイス内のフォームを特定しやすくなります。
- 名前： フォームの名前を指定します。 指定された名前のノードがリポジトリーに作成されます。 タイトルを入力し始めると、名前フィールドの値が自動的に生成されます。 候補として入力された値は変更可能です。 「ドキュメント名」フィールドには、英数字、ハイフン、アンダースコアのみを使用できます。 無効な入力は、すべてハイフンに置き換えられます。
- パス：アダプティブフォームを保存する場所を指定します。 アダプティブフォームは、
/content/dam/formsanddocumentsに直接保存することができます。または、/content/dam/formsanddocuments/adaptiveformsなどのフォルダーを作成して、アダプティブフォームを保存することができます。 フォルダーをパスで使用する前に、必ずフォルダーを作成してください。 「パス」フィールドでは、フォルダーは自動的には作成されません。
-
「作成」を選択します。アダプティブフォームが作成され、アダプティブフォームエディターで開きます。エディターに、テンプレートで使用可能なコンテンツが表示されます。 作成されたフォームを必要に応じてカスタマイズするためのサイドバーも表示されます。
アダプティブフォームのタイプに応じて、関連する JSON スキーマまたはフォームデータモデル（FDM）に存在するフォーム要素が、サイドバーの コンテンツブラウザー の「データモデルオブジェクト」タブに表示されます。これらの要素もドラッグ＆ドロップしてアダプティブフォームを作成できます。
アダプティブフォームのフォームモデルプロパティの編集 edit-form-model-foundation-components
アダプティブフォーム（JSON ベースまたはフォームデータモデル（FDM））のフォームモデルを変更することができます。フォームモデルを別のフォームモデルに変更することはできません。
-
アダプティブフォームを選択し、「プロパティ」アイコンをクリックします。
-
「フォームモデル」タブを開き、以下のいずれかを実行します。
- アダプティブフォームにフォームモデルがない場合、別のフォームモデルを選択し、それに従い XML スキーマ、JSON スキーマ、フォームデータモデル（FDM）を選択することもできます。
- アダプティブフォームがフォームモデルをベースとしている場合は、同じフォームモデルに別の XML スキーマ、JSON スキーマ、フォームデータモデル（FDM）を選択することもできます。
-
「保存」を選択して、プロパティを保存します。
アダプティブフォームビルダーまたはアダプティブフォームテンプレートビルダーから、フォームモデルプロパティを変更することもできます。
-
アダプティブフォームコンテナ（ルート） コンポーネントを選択します。
-
-
「データモデル」タブを選択し、以下のいずれかを実行します。
- アダプティブフォームにフォームモデルがない場合、フォームモデルを選択し、それに従い XML スキーマ、JSON スキーマ、フォームデータモデル（FDM）を選択することもできます。
- アダプティブフォームがフォームモデルに基づいている場合、そのフォームモデルを変更することはできません。別の XML スキーマまたは JSON スキーマを選択するか、同じフォームモデルのフォームデータモデル（FDM）を適宜選択することができます。
-
「
| note note |
|---|
| NOTE |
| アダプティブフォームをテンプレートとして保存することもできます。 詳しくは、アダプティブフォームを使用したテンプレートの作成を参照してください。 |