Set up the gxt-2.2.0 environment, let us run the first simple program

Source: Internet
Author: User
Tags intl

Recently, I am interested in gxt. It is a rich application client with a very beautiful interface. So today I try to build an environment for my own program.

 

My gxt is a gxt-2.2.0 and GWT is a gwt-2.0.4 version.

 

Introduce my development tool myeclipse8.5. In fact, eclipse is enough. Maybe I am used to myeclipse.

1. gxt is short for ext-GWT, which depends on GWT. Therefore, we need to install GWT. We will download the Eclipse plug-in of GWT from this website,

Http://code.google.com/intl/zh-CN/webtoolkit/download.html,

 

The red address during the copy process is http://dl.google.com/eclipse/plugin/3.5 and later in the configuration management center of myeclipse8.5, as shown below:

 

 

Click site and enter the plug-in ranking and GWT for Eclipse plug-in URL, for example:

 

Then download and install the plug-in. This process takes some time. After the installation, restart the IDE and you will see that the installation is successful.

Eclipse or myeclipse toolbar display:

Or in the myeclipse preference menu, you can see that the Google plug-in has just installed GWT. Here I installed gwt2.0.4;

 

 

 

2. Create a web application project, click the "G" icon on the toolbar, or select "new" from the menu"

 

 

By now, a GWT project has been created, and you can right-click the project to run it. For more information, see here,

Write very detailed, http://code.google.com/intl/zh-CN/eclipse/docs/running_and_debugging_2_0.html

 

3. Integrate gxt into the project, first we download here, http://www.sencha.com/products/gwt/download.php

After the download is decompressed, there is a setup.txt file, followed by the instructions in it can be integrated gxt.

The content in setup.txt is roughly as follows:

Quick setup for ext GWT 2.x ============================== note: ext gwt 2.x requires GWT 1.7 + or GWT 2.0 + (any build ending in "-gwt2.zip "). step 1-> Create a Google Web Application Project project within eclipse. copy the contents of the/resources folder in the download to a {Foldername} location within your war folder. substitute {Foldername} with the name of the folder you 've created for resources within your war folder. step 3-> Add the following stylesheet to your host page. <LINK rel = "stylesheet" type = "text/CSS" href = "{Foldername}/CSS/gxt-all.css"/> step 3b-> if you are using charts, add the following script to your host page. <script language = 'javascript 'src = '{Foldername}/flash/swfobject. js'> </SCRIPT> Step 4-> Add the following entry to you projects module XML file. <inherits name = 'com. extjs. gxt. UI. gxt '/> Step 5-> eclipse setup (shocould be similar for other development environments) These Instructions assume you have a existing project and launch configuration. 1. add gxt. jar to the project. a. right click on project name in 'package explorer '. b. select 'properties' from content menu. c. select 'java build path '. d. select 'libraries' tab. e. add the gxt. jar either with 'add jars... 'or' add external jars... '. 2. add gxt jar to launch configuration. a. choose run/Open Run dialog. b. select your appropriate launch configuration under 'java application '. c. select the 'classpath' tab. d. add the gxt. jar to the classpath.

Quick installation of gxt2.x ======================== Step 1: create a web application project (we have already created it) Step 2: copy the/Resources file under the decompressed gxt directory and add it to the war directory of the created Project. Step 3: add the CSS link to the <LINK rel = "stylesheet" type = "text/CSS" href = "Resources/CSS/gxt-all.css"/> main page. Here we add it to gxt01.html; if we want to use the icon, you also need to copy <script language = 'javascript 'src = 'resources/flash/swfobject. js'> </SCRIPT> to the host page. Step 4: Go to the gxt01.gwt. add <inherits name = 'com. extjs. gxt. UI. gxt '/>; Step 5: extract gxt from the gxt directory. jar Through buidl-classpath, the project is introduced, and gxt has been successfully integrated.


4. Finally, we can write our own Java code in it.
Note that, Gxt-2.2.0 + gwt-2.0.4 integration will have a problem, my main time today is wasted on this problem, is a version of a bug.Add @ suppresswarnings ("UNUSED") at the program entry point to delete the imported COM. google. GWT. user. client. window package; add COM. extjs. gxt. UI. client. widget. window; complete code is as follows:
Package Org. gxt. client; </P> <p> Import COM. google. GWT. core. client. entrypoint; <br/> Import COM. google. GWT. user. client. UI. rootpanel; <br/> Import COM. extjs. gxt. UI. client. widget. window; </P> <p> public class test implements entrypoint {<br/> Public void onmoduleload () {<br/> window = new window (); // It is equivalent to HTML Div <br/> window. setsize (500,300); // set the height and width <br/> window. setheading ("success"); // set the title <br/> window. setplain (true); // set transparent <br/> window. show (); <br/> rootpanel. get (). add (window); <br/>}< br/>}

 

Last:

 

Remarks: This article Reprinted from: http://inotgaoshou.javaeye.com/blog/761596

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.