SmartGWT入门,提供出色的GWT界面

SmartGWT简介

我最近开始使用SmartGWT ,它是一个基于GWT的框架,该框架为您的应用程序UI提供了一个全面的小部件库,并为服务器端的数据管理提供了帮助。 您可以在SmartGWT展示柜上查看其漂亮的功能。 我准备了一个简短的“入门”指南,介绍如何将库与GWT项目集成(假设您已经安装了GWT SDK和Eclipse的Google插件 )。 请注意,Smart GWT与GWT 1.5.3,GWT 1.6.4,GWT 1.7.x和GWT 2.0.x兼容。

创建GWT项目

第一步是从下载部分下载库。 我将在本教程中使用的版本是2.1(直接从此处下载)。 解压缩ZIP文件,并在新目录中找到框架的文档,一些示例,“ Hello World”示例以及必要的JAR文件。 在新的浏览器选项卡中打开JavaDocs 。

接下来,我们在Eclipse中创建一个新的“ Web应用程序项目”。 为项目选择适当的名称,并选择适当的包装。 确保选中“使用Google Web Toolkt”复选框(不需要Google的App Engine,因此请不要选择该复选框)。 该向导将如下所示:

添加SmartGWT库

创建项目框架之后,浏览文件系统到项目位置,然后创建一个名为“ lib”的新文件夹。 将解压缩的ZIP中的“ smartgwt.jar”文件复制到新创建的文件夹中,并在Eclipse中刷新项目,以便新文件显示在此处。 然后配置项目的类路径以包含JAR文件(“项目”→“属性”→“ Java构建路径”→“添加JAR”…)。 到目前为止的标准东西。 Eclipse中的扩展项目应如下所示:

然后编辑模块xml文件(名为“ SmartGWTIntroProject.gwt.xml”),并在标准“继承”声明之后添加以下行:

<inherits name="com.smartgwt.SmartGwt"/>

模块xml文件将是:

<?xml version="1.0" encoding="UTF-8"?>
<module rename-to='smartgwtintroproject'>
<!-- Inherit the core Web Toolkit stuff.                        -->
<inherits name='com.google.gwt.user.User'/><!-- Inherit the default GWT style sheet.  You can change       -->
<!-- the theme of your GWT application by uncommenting          -->
<!-- any one of the following lines.                            -->
<!-- <inherits name='com.google.gwt.user.theme.standard.Standard'/> -->
<!-- <inherits name='com.google.gwt.user.theme.chrome.Chrome'/> -->
<!-- <inherits name='com.google.gwt.user.theme.dark.Dark'/>     --><!-- Other module inherits                                      --><inherits name="com.smartgwt.SmartGwt"/><!-- Specify the app entry point class.                         -->
<entry-point class='com.javacodegeeks.smartgwt.client.client.SmartGWTIntroProject'/><!-- Specify the paths for translatable code                    -->
<source path='client'/>
<source path='shared'/></module>

这使GWT知道您的应用程序将使用SmartGWT库。

更新:“ com.google.gwt.user.theme.standard.Standard”声明应像上面一样被删除或注释掉,因为它与某些SmartGWT样式冲突。

之后,在“ war”文件夹中找到主HTML。 编辑它,并在编译的模块声明之前添加以下行:

<script>var isomorphicDir="smartgwtintroproject/sc/";</script>

更新:从2.2版开始,不再需要定义isomorpihcDir值。 查看Smart GWT 2.2的发行说明 。 但是,对于本教程(使用2.1版),需要声明。

在同一文件中,向下滚动并找到以下几行:

<td id="nameFieldContainer"></td>
<td id="sendButtonContainer"></td>

将其替换为以下内容:

<td id="formContainer"></td>
<td id="buttonContainer"></td>

这些是将包含文本项HTML元素以及稍后将添加的按钮。

完整HTML文件如下:

<!doctype html>
<!-- The DOCTYPE declaration above will set the    -->
<!-- browser's rendering engine into               -->
<!-- "Standards Mode". Replacing this declaration  -->
<!-- with a "Quirks Mode" doctype may lead to some -->
<!-- differences in layout.                        --><html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8"><!--                                                               -->
<!-- Consider inlining CSS to reduce the number of requested files -->
<!--                                                               -->
<link type="text/css" rel="stylesheet" href="SmartGWTIntroProject.css"><!--                                           -->
<!-- Any title is fine                         -->
<!--                                           -->
<title>Web Application Starter Project</title><!--                                           -->
<!-- This script loads your compiled module.   -->
<!-- If you add any GWT meta tags, they must   -->
<!-- be added before this line.                -->
<!--                                           -->
<script>var isomorphicDir="smartgwtintroproject/sc/";</script>
<script type="text/javascript" language="javascript" src="smartgwtintroproject/smartgwtintroproject.nocache.js"></script>
</head><!--                                           -->
<!-- The body can have arbitrary html, or      -->
<!-- you can leave the body empty if you want  -->
<!-- to create a completely dynamic UI.        -->
<!--                                           -->
<body><!-- OPTIONAL: include this if you want history support -->
<iframe src="javascript:''" id="__gwt_historyFrame" tabIndex='-1' style="position:absolute;width:0;height:0;border:0"></iframe><!-- RECOMMENDED if your web app will not function without JavaScript enabled -->
<noscript>
<div style="width: 22em; position: absolute; left: 50%; margin-left: -11em; color: red; background-color: white; border: 1px solid red; padding: 4px; font-family: sans-serif">Your web browser must have JavaScript enabled
in order for this application to display correctly.
</div></noscript><h1>
Web Application Starter Project</h1><table align="center">
<tr>
<td colspan="2" style="font-weight:bold;">Please enter your name:</td>        
</tr><tr>
<td id="formContainer"></td>
<td id="buttonContainer"></td>
</tr><tr>
<td colspan="2" style="color:red;" id="errorLabelContainer"></td>
</tr></table></body>
</html>

创建应用程序入口点

通过Eclipse创建GWT时,会创建许多自动生成的文件。 其中之一是“客户端”包中的主要Java文件,该文件用作应用程序的入口点。 因此,删除生成的代码并添加以下内容:

package com.javacodegeeks.smartgwt.client.client;import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.user.client.ui.RootPanel;
import com.smartgwt.client.util.SC;
import com.smartgwt.client.widgets.IButton;
import com.smartgwt.client.widgets.events.ClickEvent;
import com.smartgwt.client.widgets.events.ClickHandler;
import com.smartgwt.client.widgets.form.DynamicForm;
import com.smartgwt.client.widgets.form.fields.TextItem;public class SmartGWTIntroProject implements EntryPoint {public void onModuleLoad() {final DynamicForm form = new DynamicForm();final TextItem textItem = new TextItem();textItem.setTitle("Name");form.setFields(textItem);final IButton button = new IButton("Hello");button.addClickHandler(new ClickHandler() {public void onClick(ClickEvent event) {String name = textItem.getValue().toString();SC.say("Hello " + name);}});RootPanel.get("formContainer").add(form);RootPanel.get("buttonContainer").add(button);}}

确保导入的软件包如上所示,因为SmartGWT使用的名称与核心GWT框架的名称相同的类。

启动应用程序
接下来,我们准备启动我们的应用程序。 选择运行? 运行为? Web应用程序并使用您喜欢的浏览器访问提供的URL:

http://127.0.0.1:8888/SmartGWTIntroProject.html?gwt.codesvr=127.0.0.1:9997

您应该能够看到以下内容:

而已。 现在您可以创建一些由SmartGWT支持的出色应用程序了。 您可以在此处找到Eclipse项目(某些文件已从项目中删除)。

这只是有关如何将SmartGWT添加到项目中的简短指南。 在以下文章中,我将基于SmartGWT创建一个完整的应用程序,以向您展示其一些出色的功能。 敬请关注。

相关文章 :
  • 高级SmartGWT教程,第1部分
  • 将CAPTCHA添加到您的GWT应用程序
  • 使用Spring Security保护GWT应用程序
  • GWT 2 Spring 3 JPA 2 Hibernate 3.5教程– Eclipse和Maven 2展示
  • 建立自己的GWT Spring Maven原型
  • GWT EJB3 Maven JBoss 5.1集成教程

翻译自: https://www.javacodegeeks.com/2010/06/getting-started-smartgwt-gwt-interfaces.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/374913.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Android OpenGL ES(四)----调整屏幕的宽高比

1.宽高比问题 我们现在相当熟悉这样一个事实&#xff0c;在OpenGL里&#xff0c;我们要渲染的一切物体都要映射到X轴和Y轴上[-1&#xff0c;1]的范围内&#xff0c;对于Z轴也一样。这个范围内的坐标被称为归一化设备坐标&#xff0c;其独立于屏幕实际尺寸或形状。 不幸的是&…

使用Spring AOP进行面向方面的编程

面向方面的编程&#xff08;AOP&#xff09;是指将辅助功能或支持功能与主程序的业务逻辑隔离开来的编程范例。 AOP是用于分离横切关注点的有前途的技术&#xff0c;这在面向对象的编程中通常很难做到。 以此方式增加了应用程序的模块化&#xff0c;并且维护变得非常容易。 横切…

面试题24 二叉搜索树的后序遍历序列

题目描述 输入一个整数数组&#xff0c;判断该数组是不是某二叉搜索树的后序遍历的结果。如果是则输出Yes,否则输出No。假设输入的数组的任意两个数字都互不相同。1 class Solution {2 public:3 bool VerifySquenceOfBST(vector<int> sequence) {4 if (seque…

习题6-5 使用函数验证哥德巴赫猜想 (20 分)

本题要求实现一个判断素数的简单函数&#xff0c;并利用该函数验证哥德巴赫猜想&#xff1a;任何一个不小于6的偶数均可表示为两个奇素数之和。素数就是只能被1和自身整除的正整数。注意&#xff1a;1不是素数&#xff0c;2是素数。 函数接口定义&#xff1a; int prime( int…

Linux学习笔记 (六)用户管理命令

一、用户帐号 1、超级用户&#xff1a;具有操作系统中的最高权限&#xff0c;用来管理和维护操作系统。root用户。 2、普通用户&#xff1a;由root用户来创建&#xff0c;在宿主目录中具有完全权限。 3、程序用户&#xff1a;由应用程序添加&#xff0c;维护某个应用程序运行。…

使用Spring Security保护GWT应用程序

在本教程中&#xff0c;我们将看到如何将GWT与Spring的安全模块&#xff08;即Spring Security&#xff09;集成在一起。 我们将看到如何保护GWT入口点&#xff0c;如何检索用户的凭据以及如何记录各种身份验证事件。 此外&#xff0c;我们将实现自定义身份验证提供程序&#x…

用Fragment制作的Tab页面产生的UI重叠问题

本文出处&#xff1a;http://blog.csdn.net/twilight041132/article/details/43812745 在用Fragment做Tab页面&#xff0c;发现有时候进入应用会同时显示多个Tab内容&#xff0c;UI发生重叠。 当应用被强行关闭后&#xff08;通过手机管家软件手动强关&#xff0c;或系统为节省…

习题6-6 使用函数输出一个整数的逆序数 (20 分)

本题要求实现一个求整数的逆序数的简单函数。 函数接口定义&#xff1a; int reverse( int number );其中函数reverse须返回用户传入的整型number的逆序数。 我的代码&#xff1a; int reverse( int number ) {int n number,res 0,t 0;n (n>0)?n:-n;while(n ! 0){t…

Tomcat 7上具有RESTeasy JAX-RS的RESTful Web服务-Eclipse和Maven项目

开发Web服务的RESTful方法不断受到越来越多的关注&#xff0c;并且似乎正在将SOAP淘汰。 我不会讨论哪种方法更好&#xff0c;但是我相信我们都同意REST更轻量级。 在本教程中&#xff0c;我将向您展示如何使用RESTeasy开发RESTful服务以及如何将它们部署在Tomcat服务器上。 在…

appcmd命令导入导出站点与应用程序池

在IIS7上导出所有应用程序池的方法: %windir%\system32\inetsrv\appcmd list apppool /config /xml > c:\apppools.xml 这个命令会将服务器上全部的应用程序池都导出来,但有些我们是我们不需要的,要将他们删掉.比如: DefaultAppPoolClassic .Net AppPool如果在导入时发现同名…

卸载apache

1、运行services.msc&#xff0c;在服务中停止 apache 服务。2、运行命令行程序&#xff0c;输入 sc delete apache&#xff0c;删除该服务3、删除apache文件夹。转载于:https://www.cnblogs.com/jiangjieqim/p/5357950.html

使用wowza和xuggler将RTMP转换为RTSP

注意&#xff1a;这是我们的“ Xuggler开发教程 ”系列的一部分。 大家好&#xff01; 在过去的三个月中&#xff0c;我们一直在进行电话会议项目。 我们认为&#xff0c;使用诸如Flex之类的技术的基于Web的应用程序将是此类要求苛刻的项目的最佳方法。 随着软件的复杂性和电信…

如何设置网页标题图标

1、先制作一个名为favicon.ico的小图标&#xff0c;并将其放到网站根目录下 2、在html页面<head></head>标签内加入&#xff1a; <link rel"shortcut icon" href"favicon.ico" />OK转载于:https://www.cnblogs.com/moshengr/p/4600281.h…

C语言pow函数的精度问题

&#xff08;1&#xff09;pow函数返回值是double类型 &#xff08;2&#xff09;pow原型 double pow(double x,double y); (3)sqrt原型 double sqrt(double x); 当输出时函数值赋给整型就会出错&#xff1a; int main()d {int N 1;scanf("%d",&N);for(int i …

习题2-1 求整数均值 (10 分)

吐槽一下&#xff0c;因为少打了一个空格&#xff0c;PTA上老是不给我过&#xff0c;还一直报结果错误&#xff0c;误导我好久&#xff0c;即使是吹毛求疵&#xff0c;也应该提示我格式错误吧&#xff01;&#xff01; 原题&#xff1a; 本题要求编写程序&#xff0c;计算4个整…

iframe高度自适应,终于解决了

一直被iframe的高度自适应的问题困扰着&#xff0c;在项目中也是多次遇到。网上也有不少相关的代码&#xff0c;但是总不能满足自己的要求。在头痛了几次之后终于下定决心解决这个问题。 本代码主要解决的问题是&#xff1a;最外层滚动条随着iframe高度动态变化的问题。如果ifr…

在领域驱动的设计,贫乏的领域模型,代码生成,依赖项注入等方面……

埃里克埃文斯&#xff08;Eric Evans&#xff09;已制定了什么是域驱动设计&#xff08;DDD&#xff09;。 Martin Fowler是DDD的大力支持者和拥护者。 这些都是非凡的名字&#xff0c;几乎可以肯定的是&#xff0c;他们正在支持一些有价值的东西。 我不是在这里对此争论。 也许…

Javascript模块化工具require.js教程

转自&#xff1a;http://www.w3cschool.cc/w3cnote/requirejs-tutorial-1.html, http://www.w3cschool.cc/w3cnote/requirejs-tutorial-2.html 随着网站功能逐渐丰富&#xff0c;网页中的js也变得越来越复杂和臃肿&#xff0c;原有通过script标签来导入一个个的js文件这种方式已…

数据值、列类型和数据字段属性

数据值&#xff1a;数值型、字符型、日期型和空值等。数据列类型 2.1 数值类的数据列类型2.2 字符串类数据列类型 2.3 日期和时间型数据数据列类型 另外&#xff0c;也可以使用整形列类型存储UNIX时间戳&#xff0c;代替日期和时间列类型&#xff0c;这是基于PHP的web项目中常…

全文搜索Apache Lucene简介

在本教程中&#xff0c;我想谈谈Apache Lucene 。 Lucene是一个开源项目&#xff0c;提供基于Java的索引和搜索技术。 使用其API&#xff0c;很容易实现全文搜索 。 我将处理Lucene Java版本 &#xff0c;但请记住&#xff0c;还有一个名为Lucene.NET的.NET端口&#xff0c;以及…