Basic Grid using UiBinder in GXT3

UiBinder in GWT provides you a facility for declarative UI. The UI is defined in a xml file and the code associated with the UI is defined in a separate java file.

You can find a grid example in GXT3 implemented using UiBinder at https://github.com/prabhu-durasoft/BasicGridUIBinderGXT3. The Grid displays a list of countries. The UiBinder xml file, with the grid declaration is shown below.

<!DOCTYPE ui:UiBinder SYSTEM "http://dl.google.com/gwt/DTD/xhtml.ent">
<ui:UiBinder xmlns:ui="urn:ui:com.google.gwt.uibinder"
	xmlns:g="urn:import:com.google.gwt.user.client.ui"
	xmlns:grid="urn:import:com.sencha.gxt.widget.core.client.grid">
	<ui:with type="com.sencha.gxt.widget.core.client.grid.ColumnModel" field="countryColumnModel"></ui:with>
	<ui:with type="com.sencha.gxt.widget.core.client.grid.GridView" field="countryGridView"></ui:with>
	<ui:with type="com.sencha.gxt.data.shared.ListStore" field="countryStore"></ui:with>
	<g:HTMLPanel>
		<grid:Grid ui:field="countryGrid" cm="{countryColumnModel}" 
					store="{countryStore}" view="{countryGridView}" 
					borders="true" height="300" width="302">
		</grid:Grid>
	</g:HTMLPanel>
</ui:UiBinder>