GWT：编写AJAX程序最快捷的解决方案-技术开发专区

GWT：编写AJAX程序最快捷的解决方案

作者：IT168 极地圣火编辑：李宁 2007-05-30 10:25

二、一个简单的例子

在这一部分将会介绍一个例子。这个例子的主要功能是在前台显示一段文字，这些文字将随机从保存在服务端的一组文字中选取。而且每秒将更新一次，但并不刷新页面。实现这个程序共分为九步：

1. 在test.hellogwt.client包中创建一个Java文件RandomQuoteService.java。并定义一个接口，代码如下：

public interface RandomQuoteService extends RemoteService
...{
    public String getQuote();
}

2. 在test.hellogwt.client包中创建一个RandomQuoteServiceAsync.java文件，并定义一个接口，代码如下：

public interface RandomQuoteServiceAsync
...{
    public void getQuote(AsyncCallback callback);
}

3. 在test.hellogwt.server包中创建一个RandomQuoteServiceImpl.java文件。并定义一个继承于RemoteService和实现RandomQuoteService接口的类。代码如下：

public class RandomQuoteServiceImpl extends RemoteServiceServlet
implements RandomQuoteService
 ...{
    private Random randomizer = new Random();
    private static final long serialVersionUID= -1502084255979334403L;
    private static List quotes = new ArrayList();
    static
    ...{
       quotes.add("成功创建了GWT程序!");
       quotes.add("昨天睡得如何？");
       quotes.add("早上好！");
       quotes.add("今天下雨，真凉爽！");
       quotes.add("晚安");
    }
   public String getQuote()
...{
return (String) quotes.get(randomizer.nextInt(4));
}
}

4. 在这一步我们来修改HelloGWT.java，首先删除添加标签和按钮的代码。然后在onModuleload()中创建一个timer，并将时间间隔设置为1秒，然后在timer的响应事件中调用RandomQuoteServer的getQuote方面得到相应的显示文本。代码如下：

public void onModuleLoad()
...{
final Label quoteText = new Label();
final RandomQuoteServiceAsync quoteService =
(RandomQuoteServiceAsync)GWT.create(RandomQuoteService.class);
ServiceDefTarget endpoint = (ServiceDefTarget)quoteService;
endpoint.setServiceEntryPoint("/");
Timer timer = new Timer()
...{
public void run()
...{
AsyncCallback callback = new AsyncCallback()
...{
public void onSuccess(Object result)
...{
quoteText.setText((String) result);
}
public void onFailure(Throwable caught)
...{
quoteText.setText("Failed to get a quote.");
}
};
quoteService.getQuote(callback);
}
};
timer.scheduleRepeating(1000);
RootPanel.get().add(quoteText);
}.

5. 编辑HelloGWT，并加入如下的内容：

HelloGWT
这是一个基于GWT的AJAX程序，显示的内容将在一秒更新一次（不刷新页面）　
6. 现在让我们为这个程序加一个CSS，用来修饰显示的效果。将这个css命名为HelloGWT.css。内容如下：

quoteLabel
{...}{
color: white;
display: block;
width: 450px;
padding: 2px 4px;
text-decoration: none;
text-align: center;
font-family: GB2312;
font-weight: bold
border: 1px solid;
border-color: black;
background-color: #704968;
text-decoration: none;
}

7. 在HelloGWT.java中设置显示标签类型，代码如下：

quoteText.setStyleName("quoteLabel");

8. 在HelloGWT.html中引用css文件。代码如下：

<link rel="stylesheet" href="HelloGWT.css">

9. 这是最后一步，我们需要在这一步中注册RandomQuoteServiceImpl Servlet类。以便程序能正常运行。注册这个类需要在HelloGWT.gwt.xml中进行。内容如下：

<servlet path="/" class="test.hellogwt.server. RandomQuoteServiceImpl"/>

在编写完这个例子后，运行HelloGWT-shell.cmd，显示结果如图1所示：

图1

第1页：创建GWT程序第2页：一个简单的例子

关注我们