随笔-126  评论-247  文章-5  trackbacks-0

准备

安装好 GWT 开发环境(还没安装好?参考本博客文章 GWT 环境搭建GWT Debug 环境搭建)。下载 GXT 并解压(点击下载 gxt-2.3.1

创建 GWT Java Project

( 还不会创建?参考本博客文章 GWT 环境搭建 中 HelloWorld 的创建过程。)

安装 GXT

将解压得到的 gxt-2.3.1.jar 拷贝到项目的 war/WEB-INF/lib 下,选中 gxt-2.3.1.jar 右键 Build Path --> Add to Build Path。
在 war 目录下创建一个 gxt 文件夹,将解压缩得到的 gxt-2.3.1/resources 目录下的子目录全部拷贝到 war/gxt 目录下。


编辑 GxtTutorial.gwt.xml 文件,在里面添加一行 <inherits name='com.extjs.gxt.ui.GXT'/>
<module>
    <inherits name="com.google.gwt.user.User"/>
    <inherits name='com.extjs.gxt.ui.GXT'/>
    
<inherits name="com.google.gwt.user.theme.clean.Clean"/>
    <entry-point class="fan.tutorial.client.GxtTutorial"/>
    <source path="" />
    <set-property name="user.agent" value="gecko1_8" />
</module>

编辑 GxtTutorial.html,在里面添加一行 <link rel="stylesheet" type="text/css" href="gxt/css/gxt-all.css" /> 
......

<link type="text/css" rel="stylesheet" href="GxtTutorial.css">
<link rel="stylesheet" type="text/css" href="gxt/css/gxt-all.css" />

......

编写 GXT Hello World

package fan.tutorial.client;

import com.extjs.gxt.ui.client.widget.Html;
import com.extjs.gxt.ui.client.widget.Window;
import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.user.client.ui.RootPanel;

public class GxtTutorial implements EntryPoint {

    @Override
    public void onModuleLoad() {
        Window window = new Window();
        window.setHeadingText("System Message");
        window.add(new Html("<p style='font-size:28px;padding:15px;'>Hello World!</p>"));
        window.setWidth(450);
        window.setHeight(400);
        window.setShadow(false);
        window.show();
        RootPanel.get().add(window);
    }
}

配置 Tomcat server.xml



(没看明白?参考本博客文章 GWT Debug 环境搭建

开启 GWT Debug

在 eclipse 中启动 Tomcat,启动 GWT Debug(参考本博客文章 GWT Debug 环境搭建)。



访问 http://localhost/gxttutorial/GxtTutorial.html?gwt.codesvr=127.0.0.1:9997



至此,我们的第一个 GXT 程序跑起来了,是不是很简单呢 : )




  
posted on 2014-05-20 09:00 fancydeepin 阅读(3069) 评论(4)  编辑  收藏

评论:
# re: GXT 快速入门 2014-05-20 23:11 | 健身增肌
编程很辛苦大家要注意休息  回复  更多评论
  
# re: GXT 快速入门 2014-06-04 11:16 | 皮衣
一般用哪个工具来开发GWT项目?  回复  更多评论
  
# re: GXT 快速入门 2014-10-11 16:16 | 教主哥
LZ加油!最近一直在学习着GXT  回复  更多评论
  
# LED display[未登录] 2014-11-20 11:15 | CCC
也就入个门哈,后续还是挺难的。  回复  更多评论
  

只有注册用户登录后才能发表评论。


网站导航: