2012-05-21 36 views
9

我正在使用GWT-PlatformGWT-Bootstrap框架构建一个带有Google Web Toolkit的web应用程序。大多数情况下,直到我尝试实现弹出窗口时,它几乎是完美的。这些框架中的未知弹出窗口似乎是完全不同的。使用gwt-bootstrap模块和gwt-platform的正确方法是什么?

当使用GWTP的RevealRootPopupContentEvent.fire(source, content)或演示者的addToPopupSlot(child)方法时,GWT-Platform期望弹出窗口小部件本身是com.google.gwt.user.client.ui.PopupPanel的实例。

GWT-Bootstrap的Modal与其他任何被添加到底层面板的小部件一样使用,但我的目标是拥有一个单独的主持人和视图,并可能通过AsyncProvider异步获取它。

我试图使它成为PresenterWidget并使用addToSlot(slot, content)来揭示它,但它看起来不太正确。并非所有样式都以此方式应用,并且关闭图标(×)不起作用。

我想我不是第一个试图做这样的事情,所以也许有人已经找到了一个正确的方法来使它工作。

谢谢!

+1

开发商通常都相当响应它们的论坛问的问题:https://groups.google.com/forum/#!forum/gwt-bootstrap –

回答

8

你必须创建一个视图:通过@dominik

<!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:b='urn:import:com.github.gwtbootstrap.client.ui'> 

    <b:Modal title="Some Title" ui:field="dialogBox"> 
     <!-- Your content --> 
    </b:Modal> 
</ui:UiBinder> 
+0

你能描述一下'presenter.hide()'方法吗?它似乎不是一个普通的主持人方法。 – Raidok

+1

在我的情况下,它执行'placeManager.revealRelativePlace(-1);'。如果您不使用弹出式演示文稿的相对位置,则可能不需要它。 – Dominik

+0

cool @dominik!谢谢:) – caarlos0

0

我相信你将不得不做一些胶水代码,使其工作。

我从来没有使用GWT平台弹出窗口,所以我不知道如何,但我相信你将不得不做一个新的类扩展PopupPresenter,并做了什么需要使它的工作。

此外,我在前几天想到GWT-Platform ......我非常确定,当第一版GWT-Platform发布时,我将创建一个新项目来制作这些必要的胶水代码。

如果您需要任何帮助,请与我联系。

非常感谢,对可怜的gwt平台支持抱歉。

3

您的gwtp弹出式演示文稿有一个视图,它扩展了实现PopupView的PopUpViewImpl,并使用该界面的很多方法来显示弹出窗口(asPopupPanel(),show(),center()等)。

我刚刚开始了解gwt-bootstrap(看起来不错+ caalos0),但似乎Modal没有实现PopupView,因此无法以自动显示的方式传递给addToPopupSlot gwtp。

至于addToSlot()问题,你使用的是RootLayoutPanel还是RootPanel? 这可能是addToSlot无法正常工作的原因,因为gwt-bootstrap Modal小部件在初始化时会附加到RootPanel上,这可能会导致奇怪的布局行为以及使用RootLayoutPanel作为基础的应用程序。

我会尝试扩展Modal组件,让它实现PopUpView,将它添加为连接到弹出式演示文稿的PopUpViewImpl上的字段,并重写PopUpViewImpl asPopupPanel()函数以返回新的扩展Modal。

+0

是的,这是它。谢谢。 – caarlos0

3

基于答案我做了一些改进,看到我Gist

public class MyPopupView extends PopupViewImpl implements MyView { 

    protected Widget widget; 

    public interface MyPopupViewUiBinder extends 
      UiBinder<Widget, MyPopupView> { 
    } 

    @UiField(provided = true) 
    Modal dialogBox; 

    private MyPresenter presenter; 

    @Inject 
    public MyPopupView(final MyPopupViewUiBinder uiBinder, 
      final EventBus eventBus) { 
     super(eventBus); 
     setUpDialog(); // Provides UiField => Before initWidgets 
     initWidget(uiBinder.createAndBindUi(this)); 
    } 

    // DialogBox must be overridden to let the presenter handle changes onUnload 
    private void setUpDialog() { 
     dialogBox = new Modal() { 

      @Override 
      protected void onUnload() { 
       MyPopupView.this.hide(); 
      } 
     }; 

     dialogBox.setTitle("Some title"); 
    } 

    @Override 
    public void setPresenter(final MyPresenter presenter) { 
     this.presenter = presenter; 
    } 

    @Override 
    public final void hide() { 
     dialogBox.hide(); 
     presenter.hide(); 
    } 

    @Override 
    public void setAutoHideOnNavigationEventEnabled(final boolean autoHide) { 
     // TODO Auto-generated method stub 
    } 

    @Override 
    public void setCloseHandler(
      final PopupViewCloseHandler popupViewCloseHandler) { 
     // TODO Auto-generated method stub 
    } 

    @Override 
    public void setPosition(final int left, final int top) { 
     // TODO Auto-generated method stub 
    } 

    @Override 
    public void show() { 
     dialogBox.show(); 
    } 

    @Override 
    public void center() { 
     dialogBox.show(); 
    } 

    @Override 
    public Widget asWidget() { 
     return widget; 
    } 

    protected final void initWidget(final Widget widget) { 
     this.widget = widget; 
    } 

} 

而且一个UiBinder的文件。它包含一些可用于任何Modal/PopupView实现的抽象基类。这有点复杂,但也更清洁,因为我们不会将整个Presenter传递给View。当模式关闭时,ViewPresenter交互的界面是HasModalUnbind

您将使用这些类如下。例如主持人:

public class ErrorModalPresenter extends ModalPopupPresenter<ErrorModalPresenter.MyView> { 

    public interface MyView extends ModalPopupView { 
     DivElement getErrorMessage(); 
    } 

    private final ErrorEvent error; 

    @Inject 
    public ErrorModalPresenter(final EventBus eventBus, 
           final MyView view, 
           @Assisted final ErrorEvent error) { 

     super(eventBus, view); 
     this.error = error; 
    } 

    @Override 
    public void unbindModal() { 
     ErrorDismissEvent.fire(this, this); 
    } 

    @Override 
    protected void onBind() { 
     super.onBind(); 

     //noinspection ThrowableResultOfMethodCallIgnored 
     getView().getErrorMessage().setInnerText(error.getCause().getMessage()); 
    } 
} 

例视图:

public class ErrorModalView extends ModalPopupViewImpl implements ErrorModalPresenter.MyView { 

    @UiField(provided = true) 
    Modal errorModal; 

    @UiField 
    DivElement errorMessage; 

    interface Binder extends UiBinder<Widget, ErrorModalView> {} 

    @Inject 
    public ErrorModalView(final EventBus eventBus, 
          final Binder uiBinder) { 

     super(eventBus); 

     errorModal = initModal(); 
     initWidget(uiBinder.createAndBindUi(this)); 
    } 

    @Override 
    public DivElement getErrorMessage() { 
     return errorMessage; 
    } 
} 

而且UiBinder的XML仅仅是为了记录:

<ui:UiBinder xmlns:ui='urn:ui:com.google.gwt.uibinder' 
      xmlns:g='urn:import:com.google.gwt.user.client.ui' 
      xmlns:b='urn:import:com.github.gwtbootstrap.client.ui'> 

    <b:Modal ui:field='errorModal' title='Error'> 
     <g:HTML> 
      <div ui:field='errorMessage'/> 
     </g:HTML> 

     <b:ModalFooter> 
      <b:Button text='Close' dismiss='MODAL'/> 
     </b:ModalFooter> 
    </b:Modal> 

</ui:UiBinder> 

ErrorModalPresenterunbindModal()我火它是由父抓住一个事件主持人ErrorModalPresenter。在那里,模态演示者从容器中移除,然后在演示者上调用unbind()。当然,在unbindModal()中可能有其他解决方案。

基类假定模态是一次性模态,一旦它们被隐藏,它们将被移除。此行为可在ModalPopupViewImplinitModal()中更改。

相关问题