GWT 弹出窗口和 UIBinder：面板还是对话框？

Question

我有一个要求，当单击按钮时，应使用弹出/对话框提示用户输入一些其他详细信息，例如姓氏、出生日期等。我尝试使用window.confirm()，但我认为这不符合我的目的。有人可以帮助我如何通过 UIBinder 在 GWT 中实现这一点吗？

我在我的 UI binder.xml 中尝试了类似的操作

<g:HTMLPanel visible="false" >
                                    <g:DialogBox ui:field="dialogPanel"
                                        animationEnabled="true" modal="false" glassEnabled="false">
                                        <g:caption>More Details</g:caption>
                                        <table>
                                            <tr>
                                                <td colspan="2" align="center">
                                                    <g:Datepicker ui:field="DOB">DOB:</g:Datepicker>
                                                </td>
                                            </tr>

                                            <tr>
                                                <td>UserName:</td>
                                                <td>
                                                    <g:TextBox ui:field="usernameTextBox" />
                                                </td>
                                            </tr>
                                            <tr>
                                                <td></td>
                                                <td align="right">
                                                    <g:Button ui:field="loginButton">OK</g:Button>
                                                </td>
                                            </tr>
                                        </table>
                                    </g:DialogBox>
                                </g:HTMLPanel>

我不确定要使用哪一个：弹出窗口还是对话框！

谢谢。

Answer 1

这是使用 uibinder 的 GWT 对话框的框架：

MyDialogBox.java

import com.google.gwt.core.client.GWT;
import com.google.gwt.uibinder.client.UiBinder;
import com.google.gwt.user.client.ui.DialogBox;
import com.google.gwt.user.client.ui.Widget;

public class MyDialogBox extends DialogBox {
    private static final Binder binder = GWT.create(Binder.class);
    interface Binder extends UiBinder<Widget, MyDialogBox> {
    }
    public MyDialogBox() {
        setWidget(binder.createAndBindUi(this));
        setAutoHideEnabled(true);
        setText("My Title");
        setGlassEnabled(true);
         center();
    } 
}

MyDialog.ui.xml

<!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'>
    <ui:style>
        .panel {
            background-color: ivory;
        }
    </ui:style>
    <g:FlowPanel styleName="{style.panel}">
    <g:Label>Dialog Content</g:Label>
    </g:FlowPanel>
    </ui:UiBinder>

显示它使用：

MyDialogBox m = new MyDialogBox();
m.show();

Answer 2

DialogBox 是PopupPanel 的子代，具有它的所有功能。此外，它具有（来自文档）：

..caption area at the top and can be dragged by the user.

关于 UiBinder 中的使用（同样来自文档）：

DialogBox elements in UiBinder templates can have one widget child and one 
<g:caption> child.

因此，您似乎需要将 <table> 替换为 GWT 小部件，很可能是 <g:HTMLPanel>，并将整个 <table> 放入其中。

此外，PopupPanel 和 DialogBox 是独立的小部件，通常不会添加到其他小部件，但通过 .show() 和 hide() 方法显示。所以，在你的 UiBinder 中，你可以把 <g:DialogBox> 在根级别。