gwt-platform

Can somedy explain me the TAB SAMPLE (gwtp)?


I am using GWTP. I did the nested presenter tutorial. But there is no tutorial for the SAMPLE TAB application (the one with the admin tab appearing if you switch to the admin mode). Can somebody explain me the main concepts of this application ? Tkx.


Solution

  • Update: Update: Now you can download the workable sample Maven project from here: gwtp-sample-tab.zip

    I used the tabbed presenter feature successfully in my project (I found the sample code didn't compile as well). I think the first thing is to make it work, and then learn it and feel the benefits gradually :)

    Here is the steps I did:

    1) Copy the following files

    BaseTab.java
    BaseTabPanel.java
    SimpleTab.java
    SimpleTabPanel.java
    SimpleTab.ui.xml
    SimpleTabPanel.ui.xml
    UiModule.java
    

    from the sample code to you project. For example, I copied to this package: com.widenhome.web.client.ui. Also please remember to configure UiModule in ClientGinjector class.

    2) Create a normal presenter (MyPresenter) via GWTP eclipse plugin

    3) Change EventBus import this in the presenter

    import com.google.web.bindery.event.shared.EventBus;
    

    4) Make sure the MyPresenterView.ui.xml has the following code or similar:

    <g:HTMLPanel>
      <npui:SimpleTabPanel ui:field="tabPanel" />
      <g:SimplePanel ui:field="contentPanel" />
    </g:HTMLPanel>
    

    5) Change the presenter to extend TabContainerPresenter instead of Presenter

    public class MyPresenter extends
        TabContainerPresenter<MyPresenter.MyView, MyPresenter.MyProxy>
    

    6) Define several variables in MyPresenter, or you can just copy/paste the following code:

    /**
     * This will be the event sent to our "unknown" child presenters, in order
     * for them to register their tabs.
     */
    @RequestTabs
    public static final Type<RequestTabsHandler> TYPE_RequestTabs = new Type<RequestTabsHandler>();
    
    /**
     * Fired by child proxie's when their tab content is changed.
     */
    @ChangeTab
    public static final Type<ChangeTabHandler> TYPE_ChangeTab = new Type<ChangeTabHandler>();
    
    /**
     * Use this in leaf presenters, inside their {@link #revealInParent} method.
     */
    @ContentSlot
    public static final Type<RevealContentHandler<?>> TYPE_SetTabContent = new Type<RevealContentHandler<?>>();
    

    7) Change the constructor of MyPresenter to use the variables:

    @Inject
    public MyPresenter(final EventBus eventBus, final MyView view, final MyProxy proxy) {
        super(eventBus, view, proxy, TYPE_SetTabContent, TYPE_RequestTabs, TYPE_ChangeTab);
    }
    

    8) Now we can start to create tab presenters, (e.g MyFirstTabPresenter). Just create a normal presenter again via GWTP eclipse plugin

    9) In MyFirstTabPresenter, change MyProxy to let it 'extends' TabContentProxyPlace instead of ProxyPlace

    10) Create @TabInfo method, please see javadoc of @TabInfo annotation, you can also use other ways here. For example, I did this:

    @TabInfo(container = MyPresenter.class)
    static TabData getTabLabel(ClientGinjector ginjector) {
        return new TabDataBasic("My First Tab", 0);
    }
    

    11) In revealInParent() method of MyFirstTabPresenter class, please make sure it has the following code or similar:

    @Override
    protected void revealInParent() {
        RevealContentEvent.fire(this, MyPresenter.TYPE_SetTabContent, this);
    }
    

    That's all related to Tabbed presenter configurations. Now you can add some logic to load some data to show in MyFirstPresenter's view.

    I hope this can help you to start with GWTP Tabbed presenter, please let me know any issues you have, I will edit answer gradually and perfect it so that it can help more people to get started with it.

    BTW, I also posted this to my blog to help more people on this.

    Thanks,
    Jiakuan