Documentation

構成フォームレンダラー

構成インターフェイスを作成 すると、構成UIが自動的に生成されます。 ただし、UIのルックアンドフィールをカスタマイズしたい場合もあります。 たとえば、会社のデザインの美的感覚に一致するようにUIを変更するとします。 ConfigurationFormRendererの実装でこれを行う方法は次のとおりです。

サンプルプロジェクトを参照する

新しいLiferay DXPインスタンスを起動し、以下を実行します。

docker run -it -m 8g -p 8080:8080 liferay/dxp:7.4.13-u29。

メールアドレス_test@liferay.com_とパスワード_test_を使用して、http://localhost:8080でLiferayにサインインしてください。 プロンプトが表示されたら、パスワードを _learn_に変更します。

次に、以下の手順に従います。

  1. Configuration Form Renderer をダウンロードし、解凍します。

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

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

    注釈

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

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

    STARTED com.acme.b7r2.web_1.0.0 [1034]
    
  4. サンプルのモジュールが機能していることを確認します。 ブラウザでhttps://localhost:8080を開きます。

  5. コントロールパネル] → [設定] → [System Settings] → [Third Party] に移動します。 [B7R2 Configuration] をクリックします。

    システム設定でU2G5構成に移動します。

    このビューはカスタムJSPファイルによって提供されることに注意してください。

構成インターフェースを作成する

構成インターフェイスで構成可能な属性を定義します。 サンプルプロジェクトには、b7r2Colorという1つの構成可能な属性があります。

public interface B7R2WebConfiguration {

	@Meta.AD(deflt = "blue", name = "b7r2-color", required = false)
	public String b7r2Color();

}

ConfigurationFormRendererを使用する場合、生成されたUIを非表示にするためにgenerateUIアノテーションは必要ないことに注意してください。

構成Bean宣言を追加する

構成クラスをConfigurationBeanDeclarationクラスに登録します。 これにより、システムは構成の変更が発生したときにそれを追跡できます。

public class B7R2WebConfigurationBeanDeclaration
	implements ConfigurationBeanDeclaration {

	@Override
	public Class<?> getConfigurationBeanClass() {
		return B7R2WebConfiguration.class;
	}

}

Configuration Form Rendererを実装する

  1. ConfigurationFormRendererの実装を作成します。 @Componentアノテーションで、サービスをConfigurationScreen.classとして宣言します。

    @Component(service = ConfigurationScreen.class)
    
  2. getPid()メソッドをオーバーライドします。 構成クラスの@Meta.OCDアノテーションで指定されている完全な構成IDを必ず返すようにしてください。

    @Override
    public String getPid() {
    	return "com.acme.b7r2.web.internal.configuration.B7R2WebConfiguration";
    }
    
  3. getRequestParameters()メソッドをオーバーライドします。 このメソッドでは、カスタムUIによって送信されたパラメーターを読み取り、それらをマップに配置します。ここで、キーは構成インターフェースにあるフィールドと一致します。

    @Override
    public Map<String, Object> getRequestParameters(
    	HttpServletRequest httpServletRequest) {
    
    	String b7r2Color = ParamUtil.getString(httpServletRequest, "b7r2Color");
    
    	return new HashMap<String, Object>() {
    		{
    			put("b7r2Color", b7r2Color);
    		}
    	};
    }
    
  4. render()メソッドをオーバーライドします。 この例では、 ConfigurationProviderが構成オブジェクトにアクセスします。 サーブレットコンテキストは、リクエストディスパッチャへのアクセスを提供します。これにより、カスタムJSPが構成を読み取ることができます。

  5. 必ず@Referenceアノテーションを使用して、モジュールのシンボリック名を定義してください。

    @Reference(
     target = "(osgi.web.symbolicname=com.acme.b7r2.web)"
    )
    

Web-ContextPathを追加する

bnd.bndファイルでバンドルのWeb-ContextPathを指定します。 たとえば、サンプルプロジェクトのBndファイルにはWeb-ContextPath: /b7r2-webがあります。 これは、configuration form rendererファイルにServletContextオブジェクトを登録するものです。 サーブレットコンテキストはポートレット用に自動的に作成されますが、このサンプルにはポートレットがないため、サーブレットコンテキストをbnd.bndファイルに追加する必要があることに注意してください。

カスタムJSPを作成する

  1. 構成インターフェイスをJSPにインポートします。

    <%@ page import="com.acme.u2g5.web.internal.configuration.B7R2WebConfiguration" %>
    
  2. リクエストオブジェクトから構成値にアクセスします。

    <%
    B7R2WebConfiguration b7r2WebConfiguration = (B7R2WebConfiguration)request.getAttribute(B7R2WebConfiguration.class.getName());
    %>
    
  3. <aui:input> タグを使用して、ユーザーがJSPファイルに送信する新しい構成入力を読み取ります。

    <aui:input name="b7r2Color" value="<%= b7r2WebConfiguration.b7r2Color() %>" />
    

このサンプルプロジェクトは、ConfigurationFormRendererを使用してカスタマイズされた基本的な構成UIを示しています。 アプリケーションでは、独自のコードを記述して、構成UIのルックアンドフィールをさらにカスタマイズしてください。