ui:Binder

ここでの基本のプロジェクト構成は以下のようになっています.

ui:binderを使ってみる.

[右クリック]-[New]-[UiBinder] からファイルを追加します.Name をUiSample とすると, UiSample.java と UiSample.ui.xml の二種類のファイルができます.
sampleui01.png
UiSample.ui.xml の中身をみると以下のようになっています.

<!DOCTYPE ui:UiBinder SYSTEM "http://dl.google.com/gwt/DTD/xhtml.ent">
<ui:UiBinder xmlns:ui="urn:ui:com.google.gwt.uibinder"
	xmlns:g="urn:import:com.google.gwt.user.client.ui">
	<ui:style>
		.important {
			font-weight: bold;
		}
	</ui:style>
	<g:HTMLPanel>
		Hello,
		<g:Button styleName="{style.important}" ui:field="button" />
	</ui:HTMLPanel>
<ui:UiBinder>

ui:style タグ内でスタイルを作成し, g:Button 要素のstyleName 属性でimportant スタイルを適用してます.
また,g:Button 要素に ui:field 属性を設定すると, UiSample.java 内で@UiField アノテーションによりひも付けすることができます.
とりあえず,表示してみるとこんな感じに

sampleui02.png

memo