📅  最后修改于: 2021-01-02 12:30:22             🧑  作者: Mango
要构建GWT应用程序,我们有四个部分,在最后这一部分是可选的。
1)模块描述符:此部分有助于配置GWT应用程序。要配置,我们将配置文件写入XML
语法:name.gwt.xml
在这里,“名称”是应用程序的名称。所有配置文件都位于项目根目录中。
2)UI设计:它由用于设计GWT应用程序的HTML,CSS或图像组成。我们可以使用
3)客户端代码:在本节中,将使用GWT编译器将应用程序的所有代码和业务逻辑转换为JavaScript。我们可以使用标记找到资源的位置。该代码由入口点代码组成,无需参数即可编写。加载GWT应用程序模块后,每次都会调用EntryPoint.onModuleLoad()方法。
4)服务器端代码:在本节中,我们可以执行服务器端代码。如果我们的应用程序没有任何后端(服务器端脚本或数据库),则此部分是可选的。
使用GWT Web开发工具套件创建简单的Web开发项目。要创建应用程序,请执行以下步骤:
文件→新建→其他
现在,将打开一个弹出窗口,从中选择一个向导选项。
选择Google Web应用程序向导,然后单击“下一步”按钮。
单击下一步按钮后,将打开一个新向导。
现在,提供项目名称和程序包名称。在我们仅构建基本应用程序的同时,选择Google SDK选项下的Use GWT并取消选中Use Google App Engine。
单击完成按钮。
单击完成按钮后,将生成以下目录
在此示例中,类SampleWebApplication被称为GWT应用程序的入口点。该文件包含对服务器端代码的许多引用。该文件必须干净,因为它具有许多参考。
存在一个预定义方法onModuleLoad() ,它是在运行GWT Web应用程序时执行的程序的入口点。
这与常见的Java程序中的public static void main(String args [])方法非常相似。
SampleWebApplication.java
package com.javatpoint.helloworld.client;
import com.google.gwt.core.client.EntryPoint;
/** * Entry point classes define onModuleLoad() */
public class SampleWebApplication implements EntryPoint {
/ * This is the entry point method. */
public void onModuleLoad() {
// TODO
}
}
它类似于J2EE编程中的web.xml,后者是基于Servlet的Java Web应用程序的部署描述符。
现在,在web.xml中,GWT创建了在“部署描述符”下定义的servlet。由于我们正在创建一个基本的Web应用程序,因此请删除所有服务器端代码和web.xml中的条目(也称为规范标记)。
我们创建一个欢迎文件SampleWebApplication.html,并将其包含在web.xml中。该文件是我们的GWT Web应用程序的第一页。
web.xml
SampleWebApplication.html
在本节中,我们将打开一个文件SampleWebApplication.gwt.xml ,该文件位于特定配置文件com.javatpoint.helloworld包下。
它包含来自核心GWT的库,该库包含在继承标记中。我们还可以使用继承标记添加第三方库。继承标记是指GWT控件的默认样式。
SampleWebApplication.gwt.xml
欢迎文件描述了项目的外观。它是根据我们的HTML和CSS需求设计的。
Web Application Starter Project
UI组件在入口点类下更改。我们编写了几行代码来添加UI组件。在此示例中,我们将添加Button,Vertical Panel,事件处理。
package com.javatpoint.helloworld.client;
import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.event.dom.client.ClickEvent;
import com.google.gwt.event.dom.client.ClickHandler;
import com.google.gwt.user.client.ui.Button;
import com.google.gwt.user.client.ui.Label;
import com.google.gwt.user.client.ui.RootPanel;
import com.google.gwt.user.client.ui.VerticalPanel;
/**
* Entry point classes define onModuleLoad()
.
*/
public class SampleWebApplication implements EntryPoint {
/** A vertical panel that hold other components over UI.*/
VerticalPanel vPanel;
/*
* A label that gets updated on click of button.
*/
Label lbl;
/**
* This is the entry point method.
*/
public void onModuleLoad() {
vPanel= new VerticalPanel ();
lbl= new Label ();
/*
* Button and its click handlar.
*/
Button btn = new Button("GWT Button");
btn.addClickHandler(new ClickHandler() {
@Override
public void onClick(ClickEvent event) {
lbl.setText("You clicked GWT Button!");
}
});
/*
* adding label and button into Vertical Panel.
*/
vPanel.add(lbl);
vPanel.add(btn);
/*
* Adding vertical panel into HTML page.
*/
RootPanel.get().add(vPanel);
}
}
GWT Web应用程序以两种模式运行:
在本教程中,我们将GWT Web应用程序运行到“ GWT Super Dev Mode”中,该模式在运行时编译Java代码并在浏览器上运行JavaScript。
现在复制URL:
输出: