`

zk中zul页面中组件的id和java类中的变量绑定实现

阅读更多
zul 页面 index.zul
<?xml version="1.0" encoding="UTF-8"?>
<zk>
 <window title="zk使用apply属性关联后台Java类" border="normal"
  apply="com.civcse.main.MainLayoutComposer" width="300px">
  <vbox>
   <label id="resultLab" value="默认值" />
   <textbox id="inputTextbox" />
   <button id="runButton" label="运行" />
  </vbox>
 </window>
</zk>

 

在window组件里面使用apply属性关联到后台java类。

方法1:继承 GenericForwardComposer 抽象类
package com.civcse.main;
import org.zkoss.zk.ui.Component;
import org.zkoss.zk.ui.util.GenericForwardComposer;
import org.zkoss.zul.Label;
import org.zkoss.zul.Textbox;

public class MainLayoutComposer extends GenericForwardComposer {
 /**
  * zul组件对象映射
  */
 private Label resultLab;
 private Textbox inputTextbox;
 /*
  * (non-Javadoc)
  *
  * @see org.zkoss.zk.ui.util.GenericForwardComposer#doAfterCompose(org.zkoss.zk.ui.Component)
  */
 public void doAfterCompose(Component comp) throws Exception {
  super.doAfterCompose(comp); // 必须的,作用:变量和页面中zk组件绑定进行初始化变量
  System.out.println("渲染后执行自定义初始化");
 }
/**
  * onClick$runButton
  *  onClick=事件名称
  *    runButton=对应的Component id
  *  $必须的!
  */ public void onClick$runButton() {
  System.out.println("button click 事件");
  if (!inputTextbox.getText().trim().equals("")) {
   resultLab.setValue(inputTextbox.getText());
  }
 }
}
 

创建过程:1 新建类 MainLayoutComposer 继承 抽象类GenericForwardComposer;
                2 手动添加方法public void doAfterCompose(Component comp) throws Exception {},重写抽象类中的方法;
                3 在doAfterCompose(Componet comp)方法中必须使用super.doAfterCompose(comp); 初始化和zul页面组件关联的属性。

说明:1  把变量绑定到zk组件,变量名必须和zk组件id同名;     
          2  事件绑定格式"事件$zk组件id" 例如onClick$runButton onClick=事件名称, runButton=对应的Component id  $必须的!

方法2:实现接口org.zkoss.zk.ui.util.Composer
package com.cvicse.main;
import org.zkoss.zk.ui.Component;
import org.zkoss.zk.ui.Components;
import org.zkoss.zk.ui.event.Events;
import org.zkoss.zk.ui.util.Composer;
import org.zkoss.zul.Label;
import org.zkoss.zul.Textbox;

public class MyComposer implements Composer {
 /**
  * zul组件对象映射
  */
 private Label resultLab;
 private Textbox inputTextbox;
 /*
  * (non-Javadoc)
  *
  * @see org.zkoss.zk.ui.util.Composer#doAfterCompose(org.zkoss.zk.ui.Component)
  */
 public void doAfterCompose(Component arg0) throws Exception {
  System.out.println("init.........");
  init(arg0);
 }
 /**  固定写法,必须有的
  * @param component
  */
 public void init(Component component) {
  // 将当前对象的变量和参数对象进行绑定
  Components.wireVariables(component, this);
  // 转发一个当前的事件方法到所对应名称的Component()
  Components.addForwards(component, this);
  // 注册一个监听到当前的对象
  Events.addEventListeners(component, this);
 }
 /**
  * onClick$runButton
  *  onClick=事件名称
  *    runButton=对应的Component id
  *  $必须的!
  */
 public void onClick$runButton() {
  System.out.println("button点击了");
  if (!inputTextbox.getText().trim().equals("")) {
   resultLab.setValue(inputTextbox.getText());
  }
 }

 

说明:1 使用org.zkoss.zk.ui.util.Composer接口可以在方法doAfterCompose(Component arg0)执行渲染后的初始化;
           2 init(Component component) 固定写法详细解释请看代码里的注释。init方法使button按钮发生点击事件能够执行onClick$runButton() 方法,实现了zk组件id和变量的绑定。

总结:

           1.  MyComposer extends GenericForwardComposer || GenericAutowireComposer然后再doAfterCompose调用父类的doAfterCompose方法,这样就不用去写init方法了!

            2. zkdemo 3.5.2使用的是这种方式, zk交流论坛中都是使用方法1,如果类A要继承类B就可以考虑import Composer接口来实现数据绑定功能。

分享到:
评论
3 楼 q994539183 2012-10-11  
2 楼 yufylovefl 2011-03-08  
请问如果使用数据源绑定和spring框架如何写这段代码
1 楼 yinger_fei 2011-01-20  
如果使用use,是不是还需要在zul页面写<?init class="">?

相关推荐

    zul页面和java注解

    整理的比较全面的zul页面注解和java注解,初学zk框架的朋友可以看看,了解注解的功能,便于框架的学习。

    zk curd 小例 数据绑定 页面间事件传送 适合初学者

    在ZK中,你可以在列表组件上设置一个事件监听器,当选择项改变时,将选中的ID通过事件发送出去,详情页面则订阅这个事件,接收到ID后加载对应的数据。 **ZK Example** 在压缩包"zkExample"中,可能包含了一个简单...

    Zk中注解的使用(ZkDemo系列)

    `@Wire`可以直接将ZUL页面上的组件与控制器类的字段关联,而`@WireVariable`可以将服务层的对象注入到视图层,实现业务逻辑与视图的解耦。 5. `@Include`:这个注解用于在ZK页面中嵌入其他ZUL页面,类似于HTML中的`...

    zk中文人员开发手册.rar

    4. **表达式语言 (EL)**: ZK 提供了强大的 EL,允许开发者在 XML 配置中直接引用 Java 对象和方法,简化了界面与后台数据的绑定。 5. **ZUL 文件**: ZK 的视图文件使用 ZUL 格式,这是一种标记语言,类似于 HTML,...

    zul studio 安装文件

    在本安装文件中,你将找到所有必要的组件来配置和使用ZUL Studio进行ZK应用的开发。 首先,我们来了解一下ZUL Studio的核心特性: 1. **可视化设计**:ZUL Studio提供了一个直观的拖放式界面,允许开发者直接在...

    zk开发手册和注意事项

    5. ZK组件绑定 ZK框架提供了丰富的组件,如ListBox和Grid等,组件与数据的绑定是开发ZK应用时的常见需求。例如,在ListBox组件中可以绑定一个数据集合,并且利用ZK提供的方法来动态更新ListBox的内容。同样,在Grid...

    zk中文开发手册pdf版(基于3.5.1)

    4. **XML和ZUL**:ZK使用ZUL(ZK User Interface Language)作为其特有的页面描述语言,类似XML,使得页面布局和组件配置更为直观。 5. **性能优化**:ZK使用服务器端渲染和局部更新策略,只将改变的部分发送回...

    zk入门.web框架

    2. **ZUL页面与Window类的交互**:可以使用`&lt;window id="win" use="com.cares.MyWindow"&gt;`或`&lt;window id="win" apply="com.cares.MyApply"&gt;`将ZUL页面与自定义的Java类关联起来,实现数据绑定和业务逻辑处理。...

    zk学习开发

    每个ZK组件都有唯一的ID,用于标识和引用组件,如`id="myLabel"`。 3.2 **IF和unless属性** 这些属性用于条件显示组件,`if`表示当表达式为真时显示,`unless`则相反。 3.3 **use和apply属性** `use`用于引入组件...

    ZK中文开发手册 html

    **ZK中文开发手册**是针对ZK框架的详尽指南,旨在帮助开发者更好地理解和使用这一强大的组件库和事件驱动的Java应用框架。ZK框架主要用于构建富客户端Web应用程序,它提供了一种简单的方式来创建交互式的用户界面,...

    ajax框架 zk开发手册

    - **编写Java控制器**:创建Java类作为控制器,处理ZUL文件中的事件,实现业务逻辑。 - **配置和部署**:配置ZK应用服务器,如Tomcat或Jetty,部署项目并启动服务。 **3. ZK组件和事件处理** - **组件使用**:ZK...

    ZK框架:Ajax开发实战

    5. **Composer**:Composer是ZK中的一个关键概念,它是负责组件行为和状态管理的类。通过实现Composer,开发者可以控制组件的生命周期,监听和响应用户交互,实现复杂的业务逻辑。 6. **Scriplet**:Scriplet是ZK中...

    ZK开发文档中文HTML版

    ZK是一种基于Java语言的组件模型,用于构建可交互的Web应用。ZK框架的核心特性是它使用事件驱动和服务器端的组件模型,这使得开发者能够更高效地处理用户界面和业务逻辑。在这个"ZK开发文档中文HTML版"中,你将找到...

    Publishing.ZK.Developers.Guide pdf 书中代码

    7. **ZK拓展和自定义组件**:如果你看到自定义组件的代码,那将涉及到ZK的组件扩展机制,包括创建新的组件类和注册到ZK环境中。 8. **国际化与本地化**:ZK支持多语言应用,代码中可能包含如何设置和切换语言资源,...

    zk的主界面的树型的源代码

    在ZK中,树组件是通过XML(ZUL文件)和Java类(如Composer或Listener)共同定义的。ZUL文件负责布局和组件定义,而Java类则处理业务逻辑和事件处理。 描述中提到,为了在MyEclipse中重现ZK的主界面,你需要创建一个...

    zk十分钟入门demo

    这个示例通常包括一个简单的ZUL(ZK User Interface Language)文件和一个对应的Java控制器。ZUL文件是ZK的标记语言,用于描述用户界面布局和组件。打开`index.zul`,你会看到类似以下的代码: ```zul ...

    ZK_学习总结 ZK学习的好帮手

    - 创建第一个ZK项目"Hello World"时,通常会通过Eclipse创建一个新的ZK Web项目,然后编写包含简单组件(如Label)的ZUL页面,最后运行并查看结果。 - 分析配置文件,例如web.xml,了解ZK应用如何与Servlet容器...

    ZK MVC与MVVM模式联合实现动态分页

    在ZK中,我们可以用ZUL(ZK User Interface Language)文件定义视图,Java类处理控制器逻辑,而模型则可以通过JavaBean或其他持久化技术实现。 MVVM模式是微软WPF和XAML环境中提出的一种新设计模式,它强调数据绑定...

Global site tag (gtag.js) - Google Analytics