PopupView
The PopupView
component allows the user to open a pop-up view by clicking on a link. The view can contain any but only one component or container. You can configure the view to close automatically when the mouse pointer moves outside the view or by clicking on the outside area.
![popup view](../../_images/vcl/components/popup-view.gif)
Component’s XML-name: popupView
Basics
In the minimized state, the value of the minimizedValue
attribute is displayed on the screen as a clickable link that opens the view.
For example:
<popupView caption="PopupView example, just "
minimizedValue="click me!">
<vbox width="100px" height="50px" >
<label value="Thank you!" align="MIDDLE_CENTER"/>
</vbox>
</popupView>
By default, hideOnMouseOut="true"
, so the view closes once the mouse pointer moves outside the view. To close the view by clicking on the outside area, set the attribute value to false
:
<popupView minimizedValue="click me!"
hideOnMouseOut="false">
<vbox width="100px" height="50px" >
<textField caption="Text Field"/>
<button caption="Button"/>
</vbox>
</popupView>
Popup Position
There are the following methods for setting the popup position:
-
setPopupPosition(PopupPosition position)
- sets the popup position using the following standard values:-
DEFAULT
- sets the popup in the middle of the minimized value. -
TOP_LEFT
-
TOP_CENTER
-
TOP_RIGHT
-
MIDDLE_LEFT
-
MIDDLE_CENTER
-
MIDDLE_RIGHT
-
BOTTOM_LEFT
-
BOTTOM_CENTER
-
BOTTOM_RIGHT
@Autowired private PopupView popupView; @Subscribe public void onInit(InitEvent event) { popupView.setPopupPosition(PopupView.PopupPosition.TOP_CENTER); }
-
-
setPopupPosition(int top, int left)
- sets the top and left popup position. -
setPopupPositionTop(int top)
- sets the top popup position. -
setPopupPositionLeft(int left)
- sets the left popup position.
Events and Handlers
To generate a handler stub in Jmix Studio, select the component in the screen descriptor XML or in the Jmix UI hierarchy panel and use the Handlers tab of the Jmix UI inspector panel. Alternatively, you can use the Generate Handler button in the top panel of the screen controller. |
PopupVisibilityEvent
The PopupVisibilityEvent
is sent when the user opens or closes the popup window.
@Autowired
private Notifications notifications;
@Subscribe("popupView")
public void onPopupViewPopupVisibility(PopupView.PopupVisibilityEvent event) {
notifications.create()
.withCaption(event.isPopupVisible() ?
"The popup is visible" : "The popup is hidden")
.withType(Notifications.NotificationType.HUMANIZED)
.show();
}
Programmatic registration of the event handler: use the addPopupVisibilityListener()
component method.
All XML Attributes
You can view and edit attributes applicable to the component using the Jmix UI inspector panel of the Studio’s Screen Designer. |
align - box.expandRatio - caption - captionAsHtml - colspan - contextHelpText - contextHelpTextHtmlEnabled - css - description - descriptionAsHtml - enable - height - hideOnMouseOut - htmlSanitizerEnabled - icon - id - minimizedValue - responsive - rowspan - stylename - tabIndex - visible - width