GWT Basics
1. You're write client side code in Java instead of javascript.
- We can use the reliable, strongly-typed language for development
- Reuse your skills of Java, no need skills in javascript and CSS.
2. We can use complex Java on the client
- We can use java class such as String, array, Math class, ArrayList, HashMap, custom classes, etc.
3. We can send complex Java types to and from the server.
4. GWT provides a number of widget.
-- Such as DatePicker, Tree, SuggestBox, RichTextArea, Grid, TabBar and etc.
5. Full IDE-based Java support for development/debugging.
-- Client side is java code, so we can use all Java IDE development/debugging features, Google also provides GWT designer, we can drag and drop control and widget to desgin the web UI.
6. Debugging
- We can debug client side code just like any other Java application, using our IDE's debugger. This approach is much better than JavaScript debugger.
Testabilty
- We can use java to write code to test client side code just like other java code.
GWT Disadvantages
1. Big learning curve, especailly for non-java developer.
2. Cumbersome deployment.
-- We have to translate client java code to javascript, then deploy to server.
Unusual approach
-- Fundamentally different strategy than all other Ajax environments makes evaluation and management buyoff harder.
Approaches to Communicate with the server
Making Remote Procedure Calls (GWT RPC)
If serve side can be implemented using java, we can use GWT RPC. Using it we can pass Java objects to and from a server and transparently make calls to Java servlets and let GWT take care of low-level details like object serialization.
Retrieving JSON Data via HTTP
RequestBuilder builder = new RequestBuilder(RequestBuilder.GET, url);
try {
Request request = builder.sendRequest(null, new RequestCallback() {
public void onError(Request request, Throwable exception) {displayError("Couldn't retrieve JSON");}
public void onResponseReceived(Request request, Response response) {
if (200 == response.getStatusCode()) {
updateTable(asArrayOfStockData(response.getText()));
} else {
displayError("Couldn't retrieve JSON (" + response.getStatusText()
+ ")");
}
}
});
} catch (RequestException e) {displayError("Couldn't retrieve JSON");}
Making Cross-Site Requests for JSONP
Writing Asynchronous Callbacks
All the calls you make from the HTML page to the server are asychronous, in client side, we need to implemente a function that would be called when request succeeds or fails(Using AsyncCallback).
@RemoteServiceRelativePath("greet")
public interface GreetingService extends RemoteService {
String greetServer(String name) throws IllegalArgumentException;
}
public interface GreetingServiceAsync {
void greetServer(String input, AsyncCallback
throws IllegalArgumentException;
}
private final GreetingServiceAsync greetingService = GWT.create(GreetingService.class);
greetingService.greetServer(textToServer, new AsyncCallback
public void onFailure(Throwable caught) {
// Show the RPC error message to the user
dialogBox.setText("Remote Procedure Call - Failure");
serverResponseLabel.addStyleName("serverResponseLabelError");
serverResponseLabel.setHTML(SERVER_ERROR);
dialogBox.center();
closeButton.setFocus(true);
}
public void onSuccess(String result) {
dialogBox.setText("Remote Procedure Call");
serverResponseLabel.removeStyleName("serverResponseLabelError");
serverResponseLabel.setHTML(result);
dialogBox.center();
closeButton.setFocus(true);
}
});
}
public class GreetingServiceImpl extends RemoteServiceServlet implements GreetingService {..} // at server side
Manage Events on the Client
GWT is event-based. Code executes in response to some event occurring.
This is just like Swing, we write handler to handle event.
HTML logout_link = new HTML("Sign Out");
logout_link.addClickListener(new ClickListener() {
public void onClick(Widget sender) {
if (Window.confirm("Do you really want to leave ?")) {
login_user = "";Window.Location.reload();
}
}
});
logout_link.addStyleName("hover-cursor");
Declarative Layout in XML with GWT UiBinder
API
GWT.log("")
Basic steps
Create application
webAppCreator -out MyWebApp -junit "C:\Documents and Settings\Administrator\.m2\repository\junit\junit\4.8.2\junit-4.8.2.jar" com.mycompany.mywebapp.MyWebApp
Run locally in development mode
ant devmode
Compile and run in production mode
ant build
ant war
Running unit tests
ant test.dev|test.prod|test
Code Example
Creating custom widgets
public class ImageButton extends Composite{
private HorizontalPanel hPanel;
private Image button_img;
private HTML button_text;
public ImageButton(String text, Image image) {
}
}
DateTimeSelection to set data and time.
Creating Composite
CreateAccount, ChangePasswd, Login
How to access image
public interface ImagePack extends ImageBundle, DisclosurePanelImages {
AbstractImagePrototype Logo();
AbstractImagePrototype delete();
}
public class ImageAccessor {
private static final ImagePack images = (ImagePack) GWT.create(ImagePack.class);
public static ImagePack getImages() {return images;}
}
titlePanel.add(ImageAccessor.getImages().Logo().createImage());
Resources:
http://code.google.com/webtoolkit
Google Web Toolkit: The new frontier of Rich Internet Applications