1 / 9

GWT - QuickStart

GWT - QuickStart. V 1.0 / 2008 - May. Mise en place de l’environnement. Java : Version 1.4 minimum IDE Eclipse 3.3 Europa : lien (Eclipse J2EE recommandée) ‏ Plugins Cypal Studio : lien (Alternative OpenSource à GWT Designer) ‏ GWT Designer : lien Choisir le .zip pour eclipse 3.3

ull
Download Presentation

GWT - QuickStart

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. GWT - QuickStart V 1.0 / 2008 - May

  2. Mise en place de l’environnement Java : Version 1.4 minimum IDE Eclipse 3.3 Europa : lien (Eclipse J2EE recommandée)‏ Plugins Cypal Studio : lien (Alternative OpenSource à GWT Designer)‏ GWT Designer : lien Choisir le .zip pour eclipse 3.3 GWT : lien Librairies GWT-Ext : lien Ext-js : lien (lien « here » dans le paragraphe du bas)‏ Déploiement Apache Tomcat 6.0 : lien

  3. Mise en place de l’environnement Eclipse : Dézipper Eclipse GWT Designer Dézipper dans le dossier d’eclipse GWT 1.4 Dézipper GWT 1.4 n’importe où Lancer Eclipse New/Designer/GWT/GWT Java Project Activate Product Selectionner GWT Designer Indiquer le Proxy si nécessaire puis valider Saisir les informations requises puis valider Configurer Eclipse pour GWT 1.4 Window/Preference/Designer/GWT entrer l’url de GWT 1.4

  4. Mise en place de l’environnement Créer un nouveau Projet Créer un nouveau projet web classique New/Web/Dynamique Web Project Convertir le projet Click droit sur le projet /Google Web Toolkit/Convert Créer le module GWT qui représente l’application, c’est ce dernier qui sera déployer sous forme de war Click droit sur le projet /Google Web Toolkit/GWT Module Selectionner le dossier src, le nom du module et celui du package puis valider Ajouter Gwt-Ext au projet Dézipper GWT-Ext puis ajouter gwtext.jar à WebContent/WebInf/lib aux librairies du projet.

  5. Mise en place de l’environnement Dézipper ext-js (ext-2.0.2.zip) puis créer dans le dossier src/…package…/public un dossier js/ext dans lequel copier : Les dossiers adapter resources Les fichiers Ext-all-debug.js Ext-all.js Ext-core-debug.js Ext-core.js Dans le fichier src/…package…/nomModule.gwt.xml Insérer les lignes suivantes : <inherits name='com.gwtext.Charts' /> <stylesheet src="js/ext/resources/css/ext-all.css" /> <script src="js/ext/adapter/ext/ext-base.js" /> <script src="js/ext/ext-all.js" />

  6. Déploiement Dézipper tomcat Sous eclipse Click droit sur l’EntryPoint du module à déployer/GWT/deployModule Selectionner le répertoire webApp de tomcat puis valider Lancer tomcat.

  7. Exemple Créer un nouveau projet GWT Hello Créer un module Hello Click droit sur le package client GWT/GWT Remote Service. Appelons le HelloYou. GWT Designer créé 2 interfaces dans le package client et une classe dans le package serveur. Dans le fichier HelloYou décrivons une méthode helloMethod public String helloMethod(String s); La méthode est générée dans HelloYouAsync et dans HelloYouImpl. Dans ce dernier nous allons inséré le code suivant : return "Hello "+s;

  8. Exemple Le service est mappé dans le fichier gwt.xml On va l’appeler dans l’EntryPoint qui représente la page principale de l’appli Dans le fichier Hello.java, insérez le code suivant : package gwt.test.client; import com.google.gwt.core.client.EntryPoint; import com.google.gwt.user.client.Window; import com.google.gwt.user.client.rpc.AsyncCallback; import com.google.gwt.user.client.ui.RootPanel; import com.gwtext.client.core.EventObject; import com.gwtext.client.widgets.Button; import com.gwtext.client.widgets.Panel; import com.gwtext.client.widgets.event.ButtonListenerAdapter; import com.gwtext.client.widgets.form.Label; import com.gwtext.client.widgets.form.TextField; import com.gwtext.client.widgets.layout.VerticalLayout; /** * Entry point classes define <code>onModuleLoad()</code>. */ publicclass Hello implements EntryPoint { publicvoid onModuleLoad() { //Element dans lequel sera inserer notre ui RootPanel rootPanel = RootPanel.get(); //Panel qui contiendra nos widgets Panel mainPanel = new Panel(); mainPanel.setSize(200, 100); mainPanel.setLayout(new VerticalLayout(10));

  9. Exemple //bouton Button button = new Button("Bonjour"); //Champs final TextField textField = new TextField("Nom"); final Label label = new Label("Reponse"); //Ecouteur du bouton button.addListener(new ButtonListenerAdapter() { publicvoid onClick(Button button, EventObject e) { //Appel asynchrone AsyncCallback cb = new AsyncCallback() { publicvoid onFailure(Throwable caught) { Window.alert("Echec"); } publicvoid onSuccess(Object result) { label.setText((String)result); } }; gwt.test.client.HelloYou.Util.getInstance().helloMethod(textField.getText(), cb); } }); mainPanel.add(textField); mainPanel.add(button); mainPanel.add(label); rootPanel.add(mainPanel); } }

More Related