3.5.2.1.33. 弹窗查看控件

在线示例

API 文档

PopupView 是一个允许用容器打开弹出窗口的控件。可以通过单击简要值链接或以编程方式打开弹窗。可以通过鼠标移出或点击外部区域来关闭弹窗。

典型的 PopupView 如下所示：

Figure 18. 弹窗隐藏状态

Figure 19. 弹窗打开状态

从本地化消息包中获取简要值的 PopupView 的示例：

<popupView id="popupView"
           minimizedValue="msg://minimizedValue"
           caption="PopupView caption">
    <vbox width="60px" height="40px">
        <label value="Content" align="MIDDLE_CENTER"/>
    </vbox>
</popupView>

PopupView 的内部内容应该是一个容器，例如 BoxLayout。

PopupView 方法:

• setPopupVisible() 允许以编程方式打开弹窗。

  @Inject
  private PopupView popupView;
  @Subscribe
  protected void onInit(InitEvent event) {
      popupView.setMinimizedValue("Hello world!");
  }

• setMinimizedValue() 允许以编程方式设置简要值。

  @Inject
  private PopupView popupView;
  @Override
  public void init(Map<String, Object> params) {
      popupView.setMinimizedValue("Hello world!");
  }

• addPopupVisibilityListener(PopupVisibilityListener listener) 方法可用来添加一个跟踪弹窗可见性变化的监听器。

  @Inject
  private PopupView popupView;
  @Inject
  private Notifications notifications;
  @Subscribe
  protected void onInit(InitEvent event) {
      popupView.addPopupVisibilityListener(popupVisibilityEvent ->
              notifications.create()
                      .withCaption(popupVisibilityEvent.isPopupVisible() ? "The popup is visible" : "The popup is hidden")
                      .withType(Notifications.NotificationType.HUMANIZED)
                      .show()
      );
  }

• PopupView 组件提供设置弹出框位置的方法。由 top 和 left 值决定弹出框左上角的位置。可以使用标准值或者自定义值设置这两个属性，标准值是：

  • TOP_RIGHT

  • TOP_LEFT

  • TOP_CENTER

  • MIDDLE_RIGHT

  • MIDDLE_LEFT

  • MIDDLE_CENTER

  • BOTTOM_RIGHT

  • BOTTOM_LEFT

  • BOTTOM_CENTER

    DEFAULT 值设置弹窗位置为简要值链接的中间。

    设置弹窗位置的 Java 方法：

  • void setPopupPosition(int top, int left) - 设置 top 和 left 弹窗位置。

  • void setPopupPositionTop(int top) - 设置 top 弹窗位置。

  • void setPopupPositionLeft(int left) - 设置 left 弹窗位置。

  • void setPopupPosition(PopupPosition position) - 使用标准值设置弹窗位置。

    @Inject
    private PopupView popupView;
    @Subscribe
    public void onInit(InitEvent event) {
            popupView.setPopupPosition(PopupView.PopupPosition.BOTTOM_CENTER);
    }

    如果使用标准值设置弹窗位置，则会重置 left 和 top 的值，反之亦然。

• 使用标准值显示的弹窗会有一点点的缩进。可以通过在样式中重写 $popup-horizontal-margin 和 $popup-vertical-margin 的值去掉缩进。

• 使用下面的 Java 方法获取弹窗位置：

  • int getPopupPositionTop() - 返回 top 弹窗位置。

  • int getPopupPositionLeft() - 返回 left 弹窗位置。

  • PopupPosition getPopupPosition() - 如果不是用标准值设置的位置，返回 null。

PopupView 的属性:

• minimizedValue 属性定义弹窗按钮的简要值文本。此文本可包含 HTML 标记。

• 如果 hideOnMouseOut 属性设置为 false，在弹窗外部单击时会关闭弹窗。

popupView 的属性

caption - captionAsHtml - contextHelpText - contextHelpTextHtmlEnabled - css - description - descriptionAsHtml - box.expandRatio - height - hideOnMouseOut - icon - id - minimizedValue - stylename - visible - width

API

addPopupVisibilityListener