GWT
GWT is a very powerful framework
as it is design to develop all the burden of the GUI’s web application
in the server side in a similar fashion as we probably did for a AWT/Swing’s
application. In this way, developers using GWT leverage their knowledge
from desktop applications, for obvious reasons.
For our sample application,
you can develop a GWT application without using an IDE, but is much
easier the other way around. I prefer to use Googleipse which is an
Eclipse plugin that supports GWT. Before using Eclipse, we got to create
a GWT project compatible with Eclipse. We can do that executing the
following commands:
User:
projectCreator -eclipse
gwtTable -out gwtTable
Gwt output:
Created directory gwtTable\src
Created directory gwtTable\test
Created file gwtTable\.project
Created file gwtTable\.classpath
This creates the gwtTable
project into the gwtTable folder. After that, we got to create
an application in the following way:
User:
applicationCreator -eclipse
gwtTable -out gwtTable javabeat.net.example.client.TableExample
Gwt output:
Created directory gwtTable\src\javabeat\net\example
Created directory gwtTable\src\javabeat\net\example\client
Created directory gwtTable\src\javabeat\net\example\public
Created file gwtTable\src\javabeat\net\example\TableExample.gwt.xml
Created file gwtTable\src\javabeat\net\example\public\TableExample.html
Created file gwtTable\src\javabeat\net\example\client\TableExample.java
Created file gwtTable\TableExample.launch
Created file gwtTable\TableExample-shell.cmd
Created file gwtTable\TableExample-compile.cmd
Now we are able to import the
project in the Eclipse platform. The project structure should look like
this:
Figure 3.
One of the main benefits of
developing a GWT application within an IDE environment is the debugging
capabilities that it provides (step next, step into, etc.). To take
advantage of it we got to define a Debug launcher configuration
in Eclipse for this project. Look at the Debug windows of Eclipse
under Java Application tree. As it is shown in Figure 4, the
Debug launcher configuration for the project called gwtTable
has already been created for us, and it is ready to run!
Figure 4.
Server Side
To implement the asynchronic
call, that we need to retrieve the data from the server, we implement
a JavaBean that encapsulates the generated data. In this example we
implement the class TableData in the following way:
package javabeat.net.example.client;
import com.google.gwt.user.client.rpc.IsSerializable;
public class TableData implements IsSerializable {
private static String[] columns= {
"Fruit", "Price", "Stock", "Descrption"
};
private static String[][] data = {
{"Lemon", "23.4", "25", "Lemon fruit"},
{"Apple", "34.4", "5", "Apple fruit"},
{"Banana", "10.4", "10", "Banana fruit"},
{"Melon", "17.8", "7", "Melon fruit"},
{"Pear", "20.6", "8", "Pear fruit"},
{"India Berry", "18.5", "15", "India Berry"}
};
public String[][] mydata=null;
public TableData() {
mydata = data;
}
}
After that, we got to define
the Interface which has the remote methods that retrieve the
data from the server. The method that we define in this interface is
straight forward:
package javabeat.net.example.client;
import com.google.gwt.user.client.rpc.RemoteService;
public interface TableService extends RemoteService {
TableData getData();
}
You also have to define an
interface that the client, or the eventual downloaded JavaScript code,
will use to call this service method. The GWT uses a callback design
pattern, with this in mind we have to develop the following code:
package javabeat.net.example.client;
import com.google.gwt.user.client.rpc.AsyncCallback;
public interface TableServiceAsync {
void getData(AsyncCallback callback);
}
The naming convention is part
of making available a service with GWT; add the "Async" suffix
to the end of the service interface name (TableService). Then our implementation
of that service is shown with the following code:
package javabeat.net.example.server;
import javabeat.net.example.client.TableData;
import javabeat.net.example.client.TableService;
import com.google.gwt.user.server.rpc.RemoteServiceServlet;
public class TableRetrievalServiceImpl extends
RemoteServiceServlet implements TableService {
public TableData getData() {
return new TableData();
}
}
This class must extend RemoteServiceServlet,
a GWT API object that itself extends javax.servlet.http.HttpServlet. In other words, this class and the
interface it implements has to be deployed in your servlet container.
Configuration files
As you can notice, under src/javabeat/net/example
we can see the configuration file TableExample.gwt.xml, for our
interests we have to modify it to reflect the new service that we already
implemented. To accomplish that, the file should look like this:
<module>
<!-- Inherit the core Web Toolkit stuff. -->
<inherits name='com.google.gwt.user.User'/>
<!-- Specify the app entry point class. -->
<entry-point class='javabeat.net.example.client.TableExample'/>
<servlet path='/javabeatservice'
class='javabeat.net.example.server.TableRetrievalServiceImpl'/>
</module>
|