有关gwt的前台例子展示

一个简单的例子:界面显示一个文本框、四个按钮通过按钮实现增删改查!由于现在还没与后台业务处理绑定,运行后仅仅可以看到前台的界面展示。后台业务处理有待完善ing

 

HelloWrod.java

package cn.com.andy.client;

import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.user.client.Window;
import com.google.gwt.user.client.ui.Button;
import com.google.gwt.user.client.ui.ClickListener;
import com.google.gwt.user.client.ui.RootPanel;
import com.google.gwt.user.client.ui.TextBox;
import com.google.gwt.user.client.ui.Widget;

 
public class HelloWorld implements EntryPoint {
 
 public void onModuleLoad() {
   createComponents();
 }

 private void createComponents() {
  
  //final HibernateTest htest = new HibernateTest();

  final TextBox nameField = new TextBox();
     nameField.setText("GWT User");
     nameField.setFocus(true);
  
  Button button1 = new Button("add");
  button1.addStyleName("button1");
    button1.addClickListener(new ClickListener() {
   public void onClick(Widget sender) {   
   
    String userName = nameField.getText();
   // htest.insertUser(userName);
    Window.alert("add=" + userName);
   }
   });
   
   Button button2 = new Button("query");
   button2.addStyleName("button2");
     button2.addClickListener(new ClickListener() {
    public void onClick(Widget sender) {   
     //List list = new HibernateTest().getUsers();
     //User user = (User)list.get(0);
    // Window.alert(user.getId());
     //Window.alert(user.getUsername());
     Window.alert("query");
    }
  });
  Button button3 = new Button("update");
  button3.addStyleName("button3");
    button3.addClickListener(new ClickListener() {
   public void onClick(Widget sender) {   
    //new HibernateTest().updateUsers();
    Window.alert("update");
   }
  });
   Button button4 = new Button("delete");
   button4.addStyleName("button4");
    button4.addClickListener(new ClickListener() {
   public void onClick(Widget sender) {   
    //new HibernateTest().deleteUsers();
    Window.alert("delete");
   }
  });  
  
  RootPanel.get("userName").add(nameField);
  RootPanel.get("add").add(button1);
  RootPanel.get("query").add(button2);
  RootPanel.get("update").add(button3);
  RootPanel.get("delete").add(button4);

 }
}

 

 

修改对应的helloWord.html文件

替换通过webAppCreator.cmd命令生成的html文件中的代码

 <table align="center">
      <tr>
        <td colspan="2" style="font-weight:bold;">Please enter your name:</td>       
      </tr>
      <tr>
        <td id="userName"></td>
        <td id="add"></td>
        <td id="query"></td>
        <td id="update"></td>
        <td id="delete"></td>
      </tr>
      <tr>
        <td colspan="2" style="color:red;" id="errorLabelContainer"></td>
      </tr>
    </table>

 

 

依次执行ant命令:

ant clean

ant javac

ant gwtc

ant devmode

你可能感兴趣的:(html,UI,ant,Google,gwt)