2010/02/15

Wicketでページテンプレートを利用

Apache WicketStrutsのTilesのように画面のレイアウトを共通化する方法を調べてみました。
(via Apache Wicket -> Examples -> Markup inheritance

1. BasePage.html
まずベースとなるHTMLを作成します。ここではBasePage.htmlとします。




ここに本文が入ります。




ポイントとなるのは<wicket:child/>です。
このタグで囲った部分が各コンテンツによって差し替えられますので、上記の場合だとヘッダーとフッターはこのままで、ボディの部分がコンテンツによって変化することになります。

2. BasePage.java
次にBasePage.htmlのページクラスを作成します。

/**
* 共通テンプレート用のページクラスです。
*
* @author namiki
*
*/
public abstract class BasePage extends WebPage {
public BasePage() {
}
public BasePage(final PageParameters params) {
}
}

見ての通り特に何もしていません。今後、ヘッダーやフッターに共通の機能を埋め込む場合は必要となりますが、今のところは何もしないままにしておきます。

3. SubPage.html
次にBasePage.htmlにコンテンツを埋め込む側のSubPage.htmlを作成します。




テンプレートを利用したページのサンプルです。






ポイントとなるのは<wicket:extend/>です。
BasePage.htmlの<wicket:child/>で囲まれた部分に、SubPage.htmlの<wicket:extend/>で囲まれた部分が埋め込まれます。ここでは独自のヘッダーやフッターを定義していますが、実際に動作させた場合はBasePage.htmlのヘッダー・フッターが利用されます。

4. SubPage.java
最後にSubPage.htmlのページクラスを作成します。このクラスではBasePage.javaを継承する必要があります。それによってBasePage.htmlとSubPage.htmlの継承関係を表します。

/**
* SubPage.html用のページクラスです。
*
* @author namiki
*
*/
public class SubPage extends BasePage {
public HelloWicketPage(final PageParameters params) {
add(new Label("messages", "Hello, wicket world!!"));
}
}

これで画面レイアウトを共通化することができました。

0 件のコメント:

コメントを投稿