I have been doing some work with GWT lately, and there is a lot I really like about it. Developing in Java (or any OO language) not only makes me more productive, it enables me to solve problems in the way I understand, without having first to grapple with how another language requires me to think.  The output is awesome since its rendered natively in the browser, making it fast, and familiar.  Basically there is a lot I really like about GWT, and I’m going to be using it wherever I get a chance from now on, but that not to say its all good.

Mini Gripe

I do have a mini gripe with the current implementation (well maybe I’ll have a few, but this one stands out), it’s the way interfaces are described in Java.  For all Java’s benefits, it remains a verbose language, and developing UI structure with it looks clumsy and hard to maintain, in fact I know it is.  I can say that with some confidence since development  in GWT is almost identical to Flex development.

In Flex, if you try to develop all your interface in actionscript you end up in a similar situation. Classes quickly become very large (huge createChildren methods) as many nested components are instantiated and associated with one another.  Fortunately this can be avoided in Flex, as its is better practice to construct your layout using xml, leaving the declarative part of interface development in the language that suits it.  Xml is not just better for interface development because its declarative, it also lends itself to input from other disciplines since many types of developers and designer are used to html as the language of website structure.

Gripe Solved (soon)

That’s not the end of the story, as I learnt from the Google Wave: Under the Hood video, where a project named UiBinder is briefly mentioned.  The project sounded like exactly what I am after, and means of defining GWT interface in xml.  After a little hunting I found this document and this post.  Which explain what UiBinder is and importantly where it is (currently only internal to Google, though shortly to be released to you and me, w00).

UiBinder, briefly

UiBinder, according to the docs is a “service to generate Widget and DOM structures from XML markup“.  Which after reading the proposal (the document is a proposal for UiBinder as a GWT feature) I figured out basically means it does exactly what I was hoping.  So how does it work?

(I’ve taken the code below out of the proposal document since I cant yet try this myself. humph)

First the interface is defined using XML

<!-- HelloWorld.ui.xml -->
<ui:UiBinder xmlns:ui='urn:ui:com.google.gwt.uibinder'>
  <div>
    Hello, <span ui:field='nameSpan'/>.
  </div>
</ui:UiBinder>

This describes the interface for a a classic hello world component.  What I particularly like about the approach is how this file is then used from the Java, there are no nasty inline script tags or clumsy code behind super classes.  The template xml file is bound to the Java class explicitly.

public class HelloWorld extends UIObject {

  interface MyUiBinder extends UiBinder{}
  private static MyUiBinder uiBinder = GWT.create(MyUiBinder.class);

  @UiField SpanElement nameSpan;

  public HelloWorld(String name) {
    setElement(uiBinder.createAndBindUi(this));
    nameSpan.setInnerText(name);
  }
}

The first line of the constructor is the interesting one, the UiBinder method createAndBindUi is called passing in this as the argument. This constructs your UI components and assigns them to corresponding private variables within the class, making the next line where the text is assigned to the span possible without ever having to directly construct the SpanElement within the java.

What you end up with is a very elegant separation of layout from logic.  Cant wait to get my hands on it!

If you don’t have much patience there are other options, if you take a look to the bottom of the UiBinder proposal there are some links to similar projects at the bottom, though I’ve yet to look into them.