3.5.5. 对话框消息

Dialogs 接口设计用来展示标准对话框窗口。其 createMessageDialog()createOptionDialog() 方法是流式 API 的入口点,可以用来创建和显示对话框。

下面的例子中,当用户点击按钮时,会显示一个消息对话框:

@Inject
private Dialogs dialogs;

@Subscribe("showDialogBtn")
protected void onShowDialogBtnClick(Button.ClickEvent event) {
    dialogs.createMessageDialog().withCaption("Information").withMessage("Message").show();
}

可以在消息中使用 \n 字符来换行。如果要显示 HTML,可以用 withContentMode() 方法带 ContentMode.HTML 参数。当使用 HTML 时,别忘了转移数据内容以防恶意代码注入。

使用下面的方法可以自定义消息对话框的外观和行为:

  • withModal() - 如果使用 false,对话框不以模态窗展示,此时用户可以与应用程序的其他部分交互。

  • withCloseOnClickOutside() - 如果使用 true,并且窗口是模态展示时,用户可以点击对话框之外的地方来关闭对话框。

  • withWidth(), withHeight() 可以设置需要的弹窗大小。

示例:

@Inject
private Dialogs dialogs;

@Subscribe("showDialogBtn")
protected void onShowDialogBtnClick(Button.ClickEvent event) {
    dialogs.createMessageDialog()
            .withCaption("Information")
            .withMessage("<i>Message<i/>")
            .withContentMode(ContentMode.HTML)
            .withCloseOnClickOutside(true)
            .withWidth("100px")
            .withHeight("300px")
            .show();
}

选项对话框展示了一个消息和一组用户交互的按钮。使用 withActions() 方法可以提供操作,每个操作在对话框中以按钮的形式展示。示例:

@Inject
private Dialogs dialogs;

@Subscribe("showDialogBtn")
protected void onShowDialogBtnClick(Button.ClickEvent event) {
    dialogs.createOptionDialog()
            .withCaption("Confirm")
            .withMessage("Are you sure?")
            .withActions(
                new DialogAction(DialogAction.Type.YES, Action.Status.PRIMARY).withHandler(e -> {
                    doSomething();
                }),
                new DialogAction(DialogAction.Type.NO)
            )
            .show();
}

当按钮被点击时,对话框会关闭并且调用相应操作的 actionPerform() 方法。

DialogAction 基类设计用来创建带有标准名称和图标的操作。支持五种使用 DialogAction.Type 枚举定义的操作类型:OKCANCELYESNOCLOSE。对应的按钮名称通过主语言消息包获取。

DialogAction 构造器的第二个参数用来为操作的按钮设置特殊的可视化样式。c-primary-action 样式提供的 Status.PRIMARY 会高亮对应的按钮并使得它被选中。如果对话框中有多个操作使用了 Status.PRIMARY,只有第一个操作的按钮能使用正确的样式和图标。