GWT2.0新特性之UiBinder

最新推荐文章于 2021-05-31 18:10:58 发布

原创

最新推荐文章于 2021-05-31 18:10:58 发布 · 5.8k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#gwt #button #interface #textbox #ui #div

本文详细介绍了GWT2.0的新特性——UiBinder，包括HTML绑定、控件绑定、CSS绑定、事件管理和资源打包的使用方法，通过实例展示了如何创建和使用UiBinder来提高界面开发效率。

在GWT2.0中提供了一个UiBinder类，通过它我们可以使用XML语言对界面进行描述，这种操作叫作绑定。通过UiBinder，可以实现许多功能：HTML绑定、控件绑定、CSS绑定、事件管理、资源打包、创建控件等

一、html绑定

新建一个Google Web Application Project，然后在其client包内新建一个UiBinder，命名为HtmlBind，那么系统会自动的生成一个HtmlBind.java和一个HtmlBind.ui.xml文件，然后将里面的默认生产代码全部清空（等你熟练后可以有选择的进行处理）

将HtmlBind.ui.xml修改成如下代码：

<?xml version="1.0" encoding="UTF-8"?>
<ui:UiBinder xmlns:ui="urn:ui:com.google.gwt.uibinder">
    <div>
        <input type="text"></input>
        <input type="button" value="adc" ui:field="mybutton"></input>
    </div>
</ui:UiBinder>

可以看到这个文件中直接嵌入的一段标准的html代码。然后在HtmlBind.java中实现绑定。代码如下

//自定义控件HtmlBind
public class HtmlBind extends Widget{

    //定义继承自UiBinder的接口
    //第一个泛型参数用来指定对应的xml文件绑定后生成的UI对象的类型，因为在HtmlBind.ui.xml
    //中根节点下是一个div对象，所以这里使用DivElement
    //第二个泛型参数用来指定与生成的UI对象绑定的对象的类型
    interface MyUiBinder extends UiBinder <DivElement,HtmlBind>{}

    //通过GWT的延迟绑定创建MyUiBinder的一个实例
    private static MyUiBinder uiBinder = GWT.create(MyUiBinder.class);

    //这是两步：第一步声明一个InputElement类型的变量，变量名应该与xml文件中的ui:field的值一致。
    //第二步：给这个变量加一个注解，这样在绑定后mybutton就可以代表xml中对应的元素了
    @UiField InputElement mybutton;

    public HtmlBind(String buttonText){

        //通过绑定创建一个UI,并将其添加到HtmlBind中
    &nbs