GWT：任意のタグウィジェットを作成する方法
GWTには、画面構築に最低限必要と思われるパネル類は備わっており、これは内部的には主にdivタグで表現されている。しかし、内部的に任意のhtmlタグを持つウィジェットは用意されていない。ここでは、任意のhtmlタグを持つウィジェットの作成方法について述べるが、とりあえず利用できるというレベルなので、本当はもっとやることがあるのかもしれない。
最終的な目的
目的としては、プログラム側からul, ol, liタグを持つウィジェットを自由にその場で作り出すことである。適用するスタイルシートの都合上、これらのタグがどうしても必要だった。
しかし、これらのタグを持つGWTのウィジェットというものは存在しない。そこで、専用のウィジェットを作成する必要がある。
基本的なコード
基本的には以下になる。
HtmlList.java
import com.google.gwt.dom.client.*;
import com.google.gwt.user.client.ui.*;
public class HtmlList extends Widget {
private final Element element;
private final Set<ListItem>items = new HashSet<>();
public HtmlList(boolean ordered) {
if (!ordered) element = Document.get().createULElement();
else element = Document.get().createOLElement();
setElement(element);
}
/** 追加するのはListItemのみ */
public void add(ListItem item) {
element.appendChild(item.getElement());
}
}
ListItem.java
public class ListItem extends Widget {
final Element element;
public ListItem() {
element = Document.get().createLIElement();
setElement(element);
}
/** 任意のウィジェットを追加可能 */
public void add(Widget widget) {
element.appendChild(widget.getElement());
}
}
何のことは無い、Widgetを継承し、その中でDocument.get().create**を呼び出してタグを作成し、それをsetElementで設定するだけである。
アタッチされていない問題
しかしここに問題がある。先のHtmlListをGWTのパネル等に付け加えると、このHtmlList自体はイベントを取得することができるが（例えばマウスクリック）、それ以下のウィジェットは全くイベントを受け取れないのである。これらのウィジェットがすべて表示されているにもかかわらずだ。
この理由としては、こうだ。
- element.appendChildによってブラウザ中のDOMツリーは作成されるため、表示はされる。
- しかし、これとは別にGWTのツリーが構成されなければならない。
GWTでは、DOMツリーを構築するほかに、「アタッチ」という作業を行わなければならないのだが、これはツリーのトップから呼び出され、下の階層に伝播される。この例では、HtmlList（ULもしくはLI）のonAttachが呼び出され、最初のHtmlListはアタッチされるのだが、それ以下のListItem等はアタッチされていない。
これがために、それ以下ではイベントを受け取る準備ができていない。どうすればいいのか。
onAttachを呼び出す
HtmlListのonAttachが呼び出されたら、それ以下のListItemのonAttachを呼び出し、さらにListItemに追加されているウィジェットについてのonAttachを呼び出さねばならない。
つまり、HtmlListは以下のようにしないといけない。つまり、追加されたListItemを覚えておき、onAttachが呼び出されたら、これらのListItemについてonAttachを呼び出す。
public class HtmlList extends Widget {
private final Element element;
private final Set<ListItem>items = new HashSet<>();
public HtmlList(boolean ordered) {
if (!ordered) element = Document.get().createULElement();
else element = Document.get().createOLElement();
setElement(element);
}
public void add(ListItem item) {
assert !items.contains(item);
element.appendChild(item.getElement());
items.add(item);
}
/** このメソッドはWidget#onAttach()から呼び出される */
@Override
protected void doAttachChildren() {
items.forEach(item->item.onAttach()); // ※実際にはこの呼出はできない。
}
ListItemも同様である。
public class ListItem extends Widget {
final Element element;
Set<Widget>widgets = new HashSet<>();
public ListItem() {
element = Document.get().createLIElement();
setElement(element);
}
public void add(Widget widget) {
assert !widgets.contains(widget);
element.appendChild(widget.getElement());
widgets.add(widget);
}
/** これはWidget#onAttachから呼び出される。 */
@Override
protected void doAttachChildren() {
widgets.forEach(item->item.onAttach()); // ※実際にはこの呼出はできない。
}
しかし、※の部分は実際にはこのように書けない。onAttachはprotectedメソッドだからである。つまり、Widgetと同じcom.google.gwt.user.client.uiというパッケージのクラスからは呼び出せるが、それ以外のパッケージからアクセスするには、すべてのウィジェットをサブクラス化してonAttach()をpublicにしてしまうしか方法が無い。
GWTではリフレクションは使えないので、このいずれかの条件を満たすしかないのである。
後者の方法ではいかにも面倒だ。前者の方法を使うしかない。
リフレクション無しでパッケージプライベートを突破する方法
リフレクション無しでパッケージプライベートを突破する方法としては、故意にそのパッケージのクラスを作成してしまうことである。つまりこうだ、
package com.google.gwt.user.client.ui; // 故意にこのパッケージにする
public class AttachAccess {
public static void onAttach(Widget w) {
// アクセス可能になる
w.onAttach();
}
public static void onDetach(Widget w) {
// アクセス可能になる
w.onDetach();
}
}
したがって、先のアクセスは以下になる。
items.forEach(item->AttachAccess.onAttach(item));
デタッチも同様の処理を行う
ここではアタッチのみについて取り上げたが、これとは逆のデタッチについても同じ処理が必要になる。