GWT MVP用法实例 GWTMVP|GWT

MVP（模型视图演示器）是一种设计模式, 允许在gwt中开发的应用程序遵循MVP架构。 MVP为开发应用程序提供了解决复杂性问题的方法。由于许多开发人员使用相同的代码, 因此它们都遵循相同的设计模式, 因此应用程序开发非常复杂。
以下是每个组件的描述：

文章图片

模型：在此细分模型中, 模型仅包含数据。它保存在要根据应用程序需求进行操作和计算的业务对象中。
视图：它仅包含视图, 即显示演示者提供的数据。它提供了视图代码的可重用性, 因为我们可以很容易地交换新视图。它仅处理HTML和CSS, 这也有助于进行单独的测试。
演示者：它包含将在应用程序开发中实现的所有逻辑。它与模型以及视图进行通信。它在操作上完全不同, 可提供单独的JUnit测试。

实作下面是基于MVP设计的Login应用程序的代码。
LoginView.java

public class LoginView implements HasWidgets{ HorizontalPanel container; Label loginLabel; Label passwordLabel; TextBox loginField; PasswordTextBox passwordField; Button loginButton; public LoginView(){ container = new HorizontalPanel(); loginField = new TextBox(); loginButton = new Button("Login"); passwordField = new PasswordTextBox(); loginLabel = new Label("Login"); passwordLabel = new Label("Password"); container.add(loginLabel); container.add(loginField); container.add(passwordLabel); container.add(passwordField); container.add(loginButton); } @Override public Widget asWidget() { return container; } @Override public void add(Widget w) { container.add(w); } @Override public void clear() { container.clear(); } @Override public Iterator< widget> iterator() { return container.iterator(); } @Override public boolean remove(Widget w) { return container.remove(w); } }

MainPageView.java

public class MainPageView implements HasWidgets { VerticalPanel container; HorizontalPanel leftPanel; HorizontalPanel rightPanel; Button logout; @Override public HasClickHandlers getLogoutButton() { return logout; } public MainPageView(){ leftPanel = new HorizontalPanel(); rightPanel = new HorizontalPanel(); container = new VerticalPanel(); logout = new Button("Logout"); container.add(logout); container.add(leftPanel); container.add(rightPanel); } @Override public Widget asWidget() { return container; } @Override public void add(Widget w) { container.add(w); } @Override public void clear() { container.clear(); } @Override public Iterator< widget> iterator() { return container.iterator(); } @Override public boolean remove(Widget w) { return container.remove(w); } @Override public Button getButton() { return logout; } }

现在, 我们将构建一个UI组件, 该组件跟随演示者来控制视图的行为和交互。
LoginPresenter.java

public class MainPagePresenter { public interface Display{ HasClickHandlers getLogoutButton(); Widget asWidget(); MainPageView getViewInstance(); Button getButton(); } final Display display; final HandlerManager eventBus; public MainPagePresenter(Display display, HandlerManager eventBus){ this.display = display; this.eventBus = eventBus; } public void init(){ display.getLogoutButton().addClickHandler(new ClickHandler(){ @Override public void onClick(ClickEvent event) { // use the event bus to trigger the event eventBus.fireEvent(new LogoutEvent()); } }); } public void go(final HasWidgets container){ init(); container.clear(); container.add(display.asWidget()); } public Display getView(){return display; }}

现在, 我们设计视图和演示者之间的接口通信, 称为显示。
对于登录视图

public class LoginView implements HasWidgets, LoginPresenter.Display { //...other methods @Override public HasClickHandlers getLoginButton() { //return button to implement its events in the Presenter return loginButton; } @Override public LoginView getViewInstance() { return this; } @Override public Widget asWidget() { return container; } }

【GWT MVP用法实例】对于主页视图

public class MainPageView implements HasWidgets, MainPagePresenter.Display { //...other methods @Override publicMainPageView getViewInstance(){if(instance == null) return new MainPageView(); else return instance; } @Override public HasClickHandlers getLogoutButton() { return logout; } }

最后, 我们实现应用程序控制器

public class AppController { HandlerManager eventBus; LoginPresenter loginPage; HasWidgets container; public AppController(HandlerManager manager){ this.eventBus = manager; loginPage = new LoginPresenter(new LoginView(), eventBus); bindEvents(); } public void bindEvents(){ eventBus.addHandler(LoginEvent.TYPE, new LoginEventHandler(){ @Override public void onLogin(LoginEvent event) { // TODO Auto-generated method stub //if login successful MainPagePresenter mainpage = new MainPagePresenter(new MainPageView(), eventBus); container = mainpage.getView().getViewInstance(); mainpage.go(RootPanel.get()); } }); eventBus.addHandler(LogoutEvent.TYPE, new LogoutEventHandler(){ @Override public void onLogout(LogoutEvent event) { loginPage.go(RootPanel.get()); } }); } public void goTo(HasWidgets page){ this.container = page; loginPage.go(page); } }

现在应用程序结构看起来像