Gooogle Web Toolkit
•
1 like•781 views
The document discusses the Google Web Toolkit (GWT), which allows web developers to create Ajax applications and web UIs in Java and deploy them to JavaScript for better browser compatibility and performance. It provides an overview of GWT's architecture and development process, including compiling Java code to JavaScript, using GWT widgets and services, and deploying GWT applications.
More Related Content
What's hot
What's hot (18)
Similar to Gooogle Web Toolkit
Similar to Gooogle Web Toolkit (20)
More from Sanjeev Kulkarni
Recently uploaded
Recently uploaded (20)
Gooogle Web Toolkit
- 1. The google web toolkit Stefaan Ternier
- 2. Classic web application model (synchronous)
- 3. Ajax web application model (asynchronous)
- 4. Asynchronous JavaScript and XML (AJAX) Server - side Client – side Javascript -> Firefox/IE <html> [...] <script type="text/javascript"> [...] xmlhttp.open("POST", url, true); xmlhttp.onreadystatechange = function(func) { if (xmlhttp.readyState == 4) { [...] } } xmlhttp.setRequestHeader('MessageType', 'CALL'); xmlhttp.setRequestHeader('Content-Type', 'text/xml'); </script> <body>[...]</body> </html> JAVA -> Tomcat package com.mycompany.server; import com.google.gwt.user.server.rpc.RemoteServiceServlet; import com.mycompany.client.MyAddService; public class MyAddServiceImpl extends RemoteServiceServlet implements MyAddService{ public int add(int a, int b) { return a + b; } }
- 6. Google Web Toolkit (GWT) @ deployment time @ development time <html> [...] <script type="text/javascript"> [...] xmlhttp.open("POST", url, true); xmlhttp.onreadystatechange = function(func) { if (xmlhttp.readyState == 4) { [...] } } xmlhttp.setRequestHeader('MessageType', 'CALL'); xmlhttp.setRequestHeader('Content-Type', 'text/xml'); </script> <body>[...]</body> </html> JAVA/eclipse javascript Hosted mode JVM IDE Compile to JAVA bytecode Compile to Javascript
- 8. GWT: Build your first app GWT JAVA Code HTML Host page
- 9. GWT: Build your first app final Label resultaatLabel = new Label(); final TextBox aBox= new TextBox(); final TextBox bBox= new TextBox(); final Button button = new Button("Click me"); button.addClickListener( new ClickListener() { public void onClick(Widget sender) { resultaatLabel.setText("hier komt het resultaat"); } }); RootPanel. get ("inputboxa").add(aBox); RootPanel. get ("inputboxb").add(bBox); RootPanel. get ("resultaat").add(resultaatLabel); RootPanel. get ("bereken").add(button); GWT Widgets Bind to HTML page
- 10. GWT: project structure Client-side source files and subpackages com/mycompany/client/ The project root package contains module XML files com/mycompany/ Server-side code and subpackages com/mycompany/server/ Static resources that can be served publicly com/mycompany/public/ Purpose Package
- 12. GWT: module example com/mycompany/public/MyApplication.html com/mycompany/MyApplication.gwt.xml com/mycompany/client/MyApplication.java
- 15. Google Maps – import api
- 16. Google Maps public void onModuleLoad() { GMap2Widget mapWidget = new GMap2Widget("300", "400"); final GMap2 gmaps = mapWidget.getGmap(); RootPanel.get("slot1").add(mapWidget); } <module> <inherits name='com.google.gwt.user.User'/> <inherits name='com.mapitz.gwt.googleMaps.GoogleMaps' /> <entry-point class='com.mycompany.client.MyMapsApplication'/> </module> Module XML JAVA code
- 20. RPC plumbing diagram package com.mycompany.client; import com.google.gwt.user.client.rpc.RemoteService; public interface MyAddService extends RemoteService { public int add(int a, int b); }
- 21. RPC plumbing diagram package com.mycompany.server; import com.google.gwt.user.server.rpc.RemoteServiceServlet; import com.mycompany.client.MyAddService; public class MyAddServiceImpl extends RemoteServiceServlet implements MyAddService{ public int add(int a, int b) { int z = a + b; return z; } }
- 22. RPC plumbing diagram package com.mycompany.client; import com.google.gwt.user.client.rpc.AsyncCallback; public interface MyAddServiceAsync { public void add(int a, int b, AsyncCallback callback); }
- 24. Actually making a call button.addClickListener( new ClickListener() { public void onClick(Widget sender) { MyAddServiceAsync addService = (MyAddServiceAsync) GWT.create(MyAddService.class); ServiceDefTarget endpoint = (ServiceDefTarget) addService; String moduleRelativeURL = GWT.getModuleBaseURL() + "addService“; endpoint.setServiceEntryPoint(moduleRelativeURL); AsyncCallback callback = new AsyncCallback(){ public void onSuccess(Object result){ resultaatLabel.setText(result.toString()); } public void onFailure(Throwable caught) { resultaatLabel.setText(caught.getMessage()); } }; addService.add(Integer.parseInt(aBox.getText()), Integer.parseInt(bBox.getText()), callback); } } );