Documentation

DDMフォームのアノテーション

自動生成された configuration interface UIは、構成によっては単純すぎる場合があります。 動的データマッピング(DDM)フォームのアノテーションを使用して、レイアウトのUIをカスタマイズできます。

サンプルの構成UIを参照する

  1. Liferay DXPを起動します。 まだDockerコンテナがない場合は、以下を使用します。

    docker run -it -m 8g -p 8080:8080 liferay/portal:7.4.3.22-ga22
    
  2. DDMフォームのアノテーション をダウンロードして解凍します。

    curl https://learn.liferay.com/dxp/latest/en/building-applications/core-frameworks/configuration-framework/liferay-v3d9.zip -O
    
    unzip liferay-v1d9.zip
    
  3. モジュールのルートから、ビルドおよびデプロイします。

    ./gradlew deploy -Ddeploy.docker.container.id=$(docker ps -lq)
    

    注釈

    このコマンドは、デプロイされたjarをDockerコンテナの/opt/liferay/osgi/modulesにコピーするのと同じです。

  4. Liferay Dockerコンテナコンソールでデプロイを確認します。

    STARTED com.acme.v1d9.impl_1.0.0 [1650]
    
  5. ブラウザでhttps://localhost:8080 を開き、 [コントロールパネル] → [設定] → [システム設定] に移動します。 [プラットフォーム]で [サードパーティー] をクリックします。 左側の [V1D9 Configuration] をクリックします 。

    UIレイアウトは、DDMフォームのアノテーションによってカスタマイズされます。

DDMフォームのアノテーションの仕組みを以下に示します。

構成フォームを作成する

設定UIのすべてのフォーム項目を含む構成フォームインターフェイスを作成します。 フィールドごとに@DDMFormFieldアノテーションを使用します。 各フィールドのlabelpropertiestypeなどの属性を定義します。

@DDMFormField(label = "%checkbox", properties = "showAsSwitcher=true")
public boolean checkbox();

@DDMFormField(label = "%date", type = "date")
public String date();

@DDMFormField(
	label = "%numeric", properties = "placeholder=%seconds",
	type = "numeric",
	validationErrorMessage = "%please-enter-an-integer-between-0-and-60-seconds",
	validationExpression = "(numeric >= 0) && (numeric <= 60)"
)
public String numeric();

@DDMFormField(
	label = "%select", optionLabels = {"%foo", "%bar"},
	optionValues = {"foo", "bar"}, type = "select"
)
public String select();

@DDMFormField(label = "%text")
public String[] text();

使用可能なすべての項目タイプの詳細については、Form Field Types Referenceにアクセスしてください。 各項目タイプのtype変数名については、 Field Type Constants を参照してください。

各フォーム項目にアノテーションを付けた後、DDMFormLayoutアノテーションを使用してクラス宣言のすぐ上にフォームのレイアウトを定義します。

@DDMForm
@DDMFormLayout(
	paginationMode = com.liferay.dynamic.data.mapping.model.DDMFormLayout.SINGLE_PAGE_MODE,
	value = {
		@DDMFormLayoutPage(
			{
				@DDMFormLayoutRow(
					{
						@DDMFormLayoutColumn(size = 6, value = "text"),
						@DDMFormLayoutColumn(size = 6, value = "checkbox")
					}
				),
				@DDMFormLayoutRow(
					{
						@DDMFormLayoutColumn(size = 6, value = "select"),
						@DDMFormLayoutColumn(size = 6, value = "numeric")
					}
				),
				@DDMFormLayoutRow(
					{@DDMFormLayoutColumn(size = 12, value = "date")}
				)
			}
		)
	}
)

DDMFormLayoutRowアノテーションとDDMFormLayoutColumnを使用して、UIに必要な行と列にフォーム項目を配置します。

フォーム宣言を書く

ConfigurationDDMFormDeclarationの新しい実装を作成して、新しい構成フォームクラスを登録します。

@Component(
	property = "configurationPid=com.acme.v1d9.internal.configuration.V1D9Configuration",
	service = ConfigurationDDMFormDeclaration.class
)
public class V1D9ConfigurationDDMFormDeclaration
	implements ConfigurationDDMFormDeclaration {

	@Override
	public Class<?> getDDMFormClass() {
		return V1D9ConfigurationForm.class;
	}

}

ComponentアノテーションのconfigurationPidは、構成インターフェイスの完全修飾クラス名と一致する必要があることに注意してください。