为什么我在GWT中无法隐藏UiBinder中的DialogBox？

Question

在

Test.ui.xml

<g:DialogBox ui:field="wishlistDialogBox" autoHide="true">
     <g:caption>Test</g:caption>
     <g:HTMLPanel> some widgets..</g:HTMLPanel>
</g:DialogBox>

运行后，应用程序仍然显示

DialogBox

，所以我尝试在

TestView.java

中为“wishlistDialogBox”设置隐藏，但没有成功。

  @UiField DialogBox wishlistDialogBox;
  @Inject
  public TestView(final Binder binder) {
        widget = binder.createAndBindUi(this);
        wishlistDialogBox.hide();
   }

然后我在

TestPresenter.java

中为它设置了隐藏，但仍然不起作用

  @Override
  protected void onBind() {
      super.onBind();
      getView().getWishlistDialogBox().hide();
  }

怎么了，古德尔根本没有解释。

另外，

DialogBox

如何重复使用？

Answer 1

当谈论将它们添加到 DOM 时，

DialogBox

（以及一般的

PopupPanel

）不像任何其他小部件那样工作。您永远不应该像以前那样将它们直接附加到它（即

panel.add(yourDialogBox)

或在

UiBinder

XML 文件中）。相反，您应该创建它们，然后简单地调用

hide()

/

show()

以及类似的方法，以使其显示/隐藏（即，在 DOM 的末尾附加/分离）。

Answer 2

对我有用的是与任何其他小部件分开创建一个对话框。所以它有自己的 Java 文件和自己的 ui.xml 文件：

UiBinder xml文件：

    <ui:UiBinder xmlns:ui="urn:ui:com.google.gwt.uibinder"
      xmlns:g="urn:import:com.google.gwt.user.client.ui">
    
      <g:DialogBox ui:field="dialog">
        <g:caption>My Dialog</g:caption>
        <g:HTMLPanel> 
          <g:Button ui:field="closeButton" text="close" /> 
        </g:HTMLPanel> 
      </g:DialogBox>
      
    </ui:UiBinder> 

Java 文件：

    public class MyDialog { // here you do not inherit anything
    
        private static MyDialogUiBinder uiBinder = GWT.create(MyDialogUiBinder.class);
    
        interface MyDialogUiBinder extends UiBinder<Widget, MyDialog> {
        }
        
        @UiField
        DialogBox dialog;
    
        @UiField
        Button closeButton;

        public MyDialog() {
          // make cast to DialogBox
          dialog = (DialogBox) (uiBinder.createAndBindUi(this));
        }

    
        public void hide() {
          dialog.hide();
        }
    
        public void show() {
          dialog.center();
        }
    
        @UiHandler("closeButton")
        public void onClick(ClickEvent event) {
          hide();
        }
    
    }

Answer 3

最后我想出了一个办法，那就是把

DialogBox

放到一个看不见的

HTMLPanel

<g:HTMLPanel visible="false"> 
    <g:DialogBox ui:field="wishlistDialogBox" autoHide="true">
        <g:caption>Test</g:caption>
        <g:HTMLPanel> some widgets..</g:HTMLPanel>
    </g:DialogBox>
</g:HTMLPanel>

然后像往常一样调用 show & hide

DialogBox

，即使

DialogBox

被包裹在一个看不见的

DialogBox

中，它也会显示

HTMLPanel

。

getView().getWishlistDialogBox().show();