2007-06-27

GWT开发利器之Cypal Studio for GWT

关键字: GWT
一）什么是Cypal Studio for GWT?

Cypal Studio for GWT 其实就是Googlipse（http://www.googlipse.com），但Googlipse已经不再更新。该项目作者创建了一个新产品来替代Googlipse，这就是Cypal Studio for GWT。从下面的配置过程大家也可以看到二者基本一致。

二）环境配置及示例

  1.Eclipse 3.2 + WTP1.5

  2.GWT，从http://code.google.com/webtoolkit/download.html下载并解压缩至D:/gwt-windows-1.4.10目录

  3.Cypal Studio for GWT，从http://www.cypal.in/studio 下载并解压缩至Eclipse目录

     4.运行Eclipse，打开Window-> Preferences->Cypal Studio，设置GWT Home（步骤2)

  5.创建Dynamic Web Project，在configurations选项选中Default Cypal Studio Project

  6.创建module，从File->New->Other->Cypal Studio-> Module，输入Module名称，注意package不能为空，否则无法创建com.yourcompany.server和com.yourcompany.clinet目录。

       打开com.yourcompany.gwt.test.public下的test.html,添加一个表格。
      
html 代码
 
  1. <table align=center>  
  2.             <tr>  
  3.                 <td id="slot1"></td><td id="slot2"></td>  
  4.             </tr>  
  5.         </table>  

   Test类实现EntryPoint接口，需要手工实现onModuleLoad方法。     

java 代码
 
  1. public void onModuleLoad() {  
  2.         // TODO Auto-generated method stub  
  3.         final Button button = new Button("Click me");  
  4.         final Label label = new Label();  
  5.   
  6.         button.addClickListener(new ClickListener() {  
  7.           public void onClick(Widget sender) {  
  8.             if (label.getText().equals(""))  
  9.               label.setText("Hello World!");  
  10.             else  
  11.               label.setText("");  
  12.           }  
  13.         });  
  14.   
  15.         // Assume that the host HTML has elements defined whose  
  16.         // IDs are "slot1", "slot2".  In a real app, you probably would not want  
  17.         // to hard-code IDs.  Instead, you could, for example, search for all   
  18.         // elements with a particular CSS class and replace them with widgets.  
  19.         //  
  20.         RootPanel.get("slot1").add(button);  
  21.         RootPanel.get("slot2").add(label);  
  22. }  

 

  1. 运行

点击Run->Run/Debug，打开运行配置对话框，双击GWT Hosted Mode Application，在右侧选择项目和模块，然后可以运行或调试。
评论
zerozone
搜索本博客
最近加入圈子
存档
最新评论