How To: UiBinder + GWT MVP + multiple independent display areas
- by Prt Yz
I am using GWT MVP and UiBinder to create an app with a DockLayoutPanel. I want the north and south docks to be static, containing buttons and links. I want to have dynamic views in the center and two different areas of the east dock. As these dynamic areas should be independent of each other, I am setting up different ActivityMapper and ActivityManager's for each dynamic display area; center, east-top, and east-bottom.
How can I independently initialize these 3 different display areas when the application is loaded? How can I switch from one Activity to another in one display area without affecting the other areas?
When I use the the PlaceController's goTo to switch from one Place to another in one area, the other area's Activity is stopped.
Mayday, please help, mayday!
The following is some of my code:
AppViewImpl.ui.xml
<g:DockLayoutPanel styleName="{style.dockPanel}" unit="PX" width="975px" height="100%">
<!-- DOCK PANEL EAST -->
<g:east size="220">
<g:LayoutPanel styleName="{style.eastPanel}">
<g:layer left="0px" width="220px" top="0px" height="105px">
<g:SimpleLayoutPanel ui:field="topRightPanel"/>
</g:layer>
<g:layer left="0px" width="220px" top="110px" height="340px">
<g:InlineLabel styleName="{style.label}" text="ANOTHER DISPLAY AREA"/>
</g:layer>
</g:LayoutPanel>
</g:east>
<!-- DOCK PANEL NORTH -->
<g:north size="110">
<g:LayoutPanel styleName="{style.northPanel}">
<g:layer left="0px" width="755px" top="0px" height="105px">
<g:InlineLabel styleName="{style.label}" text="NORTH PANEL"/>
</g:layer>
</g:LayoutPanel>
</g:north>
<!-- DOCK PANEL SOUTH -->
<g:south size="20">
<g:LayoutPanel styleName="{style.southPanel}">
<g:layer left="0px" width="755px" top="0px" height="20px">
<g:InlineLabel styleName="{style.label}" text="SOUTH PANEL"/>
</g:layer>
</g:LayoutPanel>
</g:south>
<!-- DOCK PANEL CENTER -->
<g:center>
<g:SimpleLayoutPanel ui:field="mainPanel" />
</g:center>
</g:DockLayoutPanel>
MyModule.java
public class MyModule implements EntryPoint {
private Place defaultPlace = new DefaultPlace("");
public void onModuleLoad() {
// Create ClientFactory using deferred binding so we can replace with
// different impls in gwt.xml
ClientFactory clientFactory = GWT.create(ClientFactory.class);
EventBus eventBus = clientFactory.getEventBus();
PlaceController placeController = clientFactory.getPlaceController();
// Start ActivityManager for the main widget with our ActivityMapper
ActivityMapper topRightActivityMapper = new TopRightActivityMapper(clientFactory);
ActivityManager topRightActivityManager = new ActivityManager(topRightActivityMapper, eventBus);
topRightActivityManager.setDisplay(clientFactory.getAppView().getTopRightPanel());
// Start ActivityManager for the main widget with our ActivityMapper
ActivityMapper mainActivityMapper = new AppActivityMapper(clientFactory);
ActivityManager mainActivityManager = new ActivityManager(mainActivityMapper, eventBus);
mainActivityManager.setDisplay(clientFactory.getAppView().getMainPanel());
// Start PlaceHistoryHandler with our PlaceHistoryMapper
AppPlaceHistoryMapper historyMapper = GWT .create(AppPlaceHistoryMapper.class);
PlaceHistoryHandler historyHandler = new PlaceHistoryHandler(historyMapper);
historyHandler.register(placeController, eventBus, defaultPlace);
RootLayoutPanel.get().add(clientFactory.getAppView());
// Goes to place represented on URL or default place
historyHandler.handleCurrentHistory();
new AppController(clientFactory);
}
}
AppController.java
public class AppController implements AppView.Presenter {
private ClientFactory clientFactory;
AppController(ClientFactory clientFactory){
this.clientFactory = clientFactory;
goTo(new TopRightAPlace(""));
}
@Override
public void goTo(Place place) {
clientFactory.getPlaceController().goTo(place);
}
}
TopRightAViewImpl.java
public class TopRightAViewImpl extends Composite implements TopRightAView {
interface Binder extends UiBinder<Widget, TopRightAViewImpl> {
}
private static final Binder binder = GWT.create(Binder.class);
private Presenter listener;
@UiField
Button button;
public TopRightAViewImpl() {
initWidget(binder.createAndBindUi(this));
}
@Override
public void setName(String name) {
button.setHTML(name);
}
@Override
public void setPresenter(Presenter listener) {
this.listener = listener;
}
@UiHandler("button")
void onButtonClick(ClickEvent event) {
listener.goTo(some other place);
}
}