Marshal's Blog

gwt编写简单的树形结构

使用gwt编写web页面，十分简单。因为不需要写javascript代码，直接用java几行就可以实现一个下面样子的树形结构。

主要是需要需要生成一个EntryPoint类，用于将树形结构的对象加入到html中，代码如下：

package com.easymorse.client;

import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.user.client.ui.CheckBox;
import com.google.gwt.user.client.ui.RootPanel;
import com.google.gwt.user.client.ui.Tree;
import com.google.gwt.user.client.ui.TreeItem;

/**
* Entry point classes define <code>onModuleLoad()</code>.
*/
public class Gwt_hello implements EntryPoint {
     public void onModuleLoad() {
            // Create a tree with a few items in it.
            TreeItem root = new TreeItem("北京市");
            root.addItem(new CheckBox("东城区"));
            root.addItem(new CheckBox("西城区"));
            root.addItem("宣武区");

            Tree t = new Tree();
            t.addItem(root);
            root = new TreeItem("河北省");
            t.addItem(root);
            t.setAnimationEnabled(true);

            RootPanel.get().add(t);
          }
}

 

分析了一下对应的html文件，Gwt_hello.html，文件的前面部分基本上是有gwt自动生成，一般不做修改了。后面部分，是可以自己定义的：

    <table align="center">
      <tr>
        <td colspan="2" style="font-weight:bold;">Please enter your name:</td>       
      </tr>
      <tr>
        <td id="nameFieldContainer"></td>
        <td id="sendButtonContainer"></td>
      </tr>
    </table>
  </body>
</html>

 

再通过firebug查看Tree部分加入的位置，在table标签后面，也就是默认使用RootPanel.get()方法做add（）的时候，将加入到后面。

   发送文章为PDF