ソースデータを追加して、データバィンディングまねーじゃーを活性化した後は、要求されている UI オブジェクトを定義し、それらをデータソースと関連付けます。ZUML アノテーションを使用してデータバィンディングマネージャーにデータソースと UI コンポーネント間の関係を知らせます。その使用法は全く直線的で、直接コンポーネントの属性内にアノテーションを宣言するだけです。
<component-name
attribute-name="@{bean-name.attribute-name}
"
/>
component-name は UI コンポーネントです。
attribute-name は UI コンポーネントの属性もしくはデータソースです。
bean-name はデータソースです。
サンプルとして、Grid を使用して、データソースの Person インスタンスと関連付けます。この例ではデータバィンディングマネージャーは UI コンポーネントとデータソース間の同期を自動化します。
<?init class="org.zkoss.zkplus.databind.AnnotateDataBinderInit" ?>
<window>
<zscript>
//prepare the example person object
Person person = new Person();
person.setFirstName("George");
person.setLastName("Bush");
</zscript>
<grid width="400px">
<rows>
<row> First Name: <textbox value="@{person.firstName}"/></row>
<row> Last Name: <textbox value="@{person.lastName}"/></row>
<row> Full Name: <label value="@{person.fullName}"/></row>
</rows>
</grid>
</window>