martes, 3 de julio de 2012

GWT-Platform and GXT3

Previously I wrote about GXT3 and RequestFactory to perform basic crud operations http://goo.gl/7ePse.
This time I will be focused in GWTPlatform using GXT3 widgets.
The source code is available through Github https://github.com/poseidonjm/GWTP-GXT3



GWT-Platform
Used to simplify the MVP architecture with minimal boilerplate (GWTP page)

GWTP Plugin for Eclipse
You should install the plugin that offers wizards for create Presenters and Events
Help > Install New Software
http://plugin.gwt-platform.googlecode.com/hg/update
I am using Eclipse Indigo.

Final Project



 Project Structure

CSS
I copied the style of Sencha examples

Project Layout
LayoutPresenter.java is the main presenter it contains the header and footer of the page.
LayoutPresenter is not a Place so the user cannot navigate.

Create a Presenter


I choose RevealRootContentEvent because this presenter takes all the screen.

All presenters are composed of three files.

All presenters have a inner interface that view implements.

Presenter lifecycle
  • Presenters are Singleton so it is instantiated once.
  • prepareFromRequest(): Is where you can get url parameters.
  • onBind(): Is called when the presenter is  instantiated.
  • onReveal(): Is called whenever the Presenter was not visible on screen and becomes visible.
  • onHide(): Is called whenever the Presenter was visible on screen and is being hidden.
  • onReset(): Is called whenever the user navigates to a page that shows the presenter, whether it was visible or not.
References GWTP Page and Dani GWTP Course.


Nested Presenters
Your header, footer and menu are in one presenter the "parent presenter".


Presenter Widget
Is for reusable graphical and logical code.




LayoutPresenter.java

LayoutView.java

LayoutView.ui.xml


Create a Presenter Widget



MenuPresenter.java

MenuView.java

MenuView.ui.xml


Create Default Presenter
When you start you program the first page that you see is the default presenter.


Create Colaborador Presenter

Tokens
Most presenters have a token so the user can navigate.


For example #colaboradores is a token that identifies the program Colaboradores. When there is not token the default presenter is shown.

You can navigate from one presenter to another by:
  • Typing another url
  • Using a Hyperlink Widget
  • Using a Place Request
References Dani GWTP course

For Example MenuPresenter use Place Request to navigate through the programs.

Popup Presenters
Is a presenter widget that is shown inside a popup dialog.

Create a Popup Presenter


Popup Presenters and GXT3
Usually popup views extend PopupViewImpl or PopupViewWithUiHandler. But it works if you use GWT PopupPanel or DialogBox or whatever extend GWT PopupPanel.
I wanna use GXT Window like Popup Presenter so I copied  PopupViewImpl and PopupViewWithUiHandler and change GWT PopupPanel by GXT Window.

GXTPopupViewImpl.java


GXTPopupViewWithUiHandlers.java
Its all about GWTP and GXT3
Greetings.

_______________________________________________________________________________
UPDATED
GXTPopupViewImpl.java and  GXTPopupViewWithUiHandlers.java are available through maven central
gwtp-gxtwindow-1.0.jar
http://search.maven.org/#search%7Cga%7C1%7Ccom.rhemsolutions

add to your GWT module

<inherits name='com.rhemsolutions.PopupWindow'/>

2 comentarios:

  1. Some useful links about GXT3 uibinder
    http://www.slideshare.net/senchainc/using-uibinder-with-ext-gwt-30
    http://www.slideshare.net/senchainc/ext-gwt-30-layouts
    http://www.sencha.com/blog/ext-gwt-3-developer-preview-2/

    ResponderEliminar
  2. Wow nice article. :)

    https://plus.google.com/u/0/111739836936169749229/posts/gZKDbA7Czim - I shared it with the GWTP community.

    ResponderEliminar