Copyright	(c) 2018 Francisco Vallarino
License	BSD-3-Clause (see the LICENSE file)
Maintainer	fjvallarino@gmail.com
Stability	experimental
Portability	non-portable
Safe Haskell	Safe-Inferred
Language	Haskell2010

Monomer.Widgets.Containers.Popup

Contents

Configuration
Constructors

Description

Popup widget, used to display content overlaid on top of the active widget tree. When the popup is open, events will not reach the widgets below it.

In addition to the content that is displayed when open, a popup requires a boolean lens or value to indicate if the content should be visible. This flag can be used to programmatically open/close the popup. The popup can also be closed by clicking outside its content.

In general, it is a good idea to set a background color to the top level content widget, since by default most widgets have a transparent background; this is true in particular for containers.

popup visiblePopup $  -- visiblePopup is a lens to a Bool field in the model
  label "This will appear on top of the widget tree"
    styleBasic [bgColor gray, padding 10]

By default the popup will be open at the top-left location the widget would be if it was directly embedded in the widget tree. One common pattern is having a popup open when clicking a button, and the expectation is it will open below the button. This can be achieved with:

vstack [
  button Open OpenPopup,
  popup visiblePopup (label Content)
]

The popup's content can be aligned relative to the location of the popup widget in the widget tree:

popup_ visiblePopup [alignTop, alignCenter] $
  label "This will appear on top of the widget tree, aligned to the top-center"
    styleBasic [bgColor gray, padding 10]

Alternatively, aligning relative to the application's window is possible. This can be useful for displaying notifications:

popup_ visiblePopup [popupAlignToWindow, alignTop, alignCenter] $
  label "This will appear centered at the top of the main window"
    styleBasic [bgColor gray, padding 10]

It's possible to add an offset to the location of the popup, and also combine it with alignment options:

cfgs = [popupAlignToWindow, alignTop, alignCenter, popupOffset (Point 0 5)]

popup_ visiblePopup cfgs $
  label "This will appear centered almost at the top of the main window"
    styleBasic [bgColor gray, padding 10]

Alternatively, a widget can be provided as an anchor. This is not too different than the previous examples but opens up more alignment options, since the popup's content can now be aligned relative to the outer side of the edges of the anchor widget.

anchor = toggleButton "Show popup" visiblePopup
cfgs = [popupAnchor anchor, popupAlignToOuterV, alignTop, alignCenter]

popup_ visiblePopup cfgs $
  label "The bottom of the content will be aligned to the top of the anchor"
    styleBasic [bgColor gray, padding 10]

For an example of popup's use, check ColorPopup.

Note: style settings will be ignored by this widget. The content and anchor need to be styled independently.

Synopsis

data PopupCfg s e
popupAnchor :: WidgetNode s e -> PopupCfg s e
popupAlignToOuterH :: PopupCfg s e
popupAlignToOuterH_ :: Bool -> PopupCfg s e
popupAlignToOuterV :: PopupCfg s e
popupAlignToOuterV_ :: Bool -> PopupCfg s e
popupAlignToWindow :: PopupCfg s e
popupAlignToWindow_ :: Bool -> PopupCfg s e
popupOffset :: Point -> PopupCfg s e
popupOpenAtCursor :: PopupCfg s e
popupOpenAtCursor_ :: Bool -> PopupCfg s e
popupDisableClose :: PopupCfg s e
popupDisableClose_ :: Bool -> PopupCfg s e
popup :: WidgetModel s => ALens' s Bool -> WidgetNode s e -> WidgetNode s e
popup_ :: WidgetModel s => ALens' s Bool -> [PopupCfg s e] -> WidgetNode s e -> WidgetNode s e
popupV :: (WidgetModel s, WidgetEvent e) => Bool -> (Bool -> e) -> WidgetNode s e -> WidgetNode s e
popupV_ :: (WidgetModel s, WidgetEvent e) => Bool -> (Bool -> e) -> [PopupCfg s e] -> WidgetNode s e -> WidgetNode s e
popupD_ :: WidgetModel s => WidgetData s Bool -> [PopupCfg s e] -> WidgetNode s e -> WidgetNode s e

Configuration

data PopupCfg s e Source #

Configuration options for popup:

popupAnchor: a widget to be used as a reference for positioning the popup.
popupAlignToOuter: align the popup to the anchor's outer borders.
popupAlignToWindow: align the popup to the application's window.
popupOffset: offset to add to the default location of the popup.
popupOpenAtCursor: whether to open the content at the cursor position.
popupDisableClose: do not close the popup when clicking outside the content.
alignLeft: left align relative to the widget location or main window.
alignRight: right align relative to the widget location or main window.
alignCenter: horizontal center align relative to the widget location or main window.
alignTop: top align relative to the widget location or main window.
alignMiddle: vertical middle align relative to the widget location or main window.
alignBottom: bottom align relative to the widget location or main window.
onChange: event to raise when the popup is opened/closed.
onChangeReq: WidgetRequest to generate when the popup is opened/closed.

Instances

Instances details

Monoid (PopupCfg s e) Source #
Instance details Defined in Monomer.Widgets.Containers.Popup Methods mempty :: PopupCfg s e # mappend :: PopupCfg s e -> PopupCfg s e -> PopupCfg s e # mconcat :: [PopupCfg s e] -> PopupCfg s e #
Semigroup (PopupCfg s e) Source #
Instance details Defined in Monomer.Widgets.Containers.Popup Methods (<>) :: PopupCfg s e -> PopupCfg s e -> PopupCfg s e # sconcat :: NonEmpty (PopupCfg s e) -> PopupCfg s e # stimes :: Integral b => b -> PopupCfg s e -> PopupCfg s e #
Default (PopupCfg s e) Source #
Instance details Defined in Monomer.Widgets.Containers.Popup Methods def :: PopupCfg s e #
CmbAlignBottom (PopupCfg s e) Source #
Instance details Defined in Monomer.Widgets.Containers.Popup Methods alignBottom :: PopupCfg s e Source # alignBottom_ :: Bool -> PopupCfg s e Source #
CmbAlignCenter (PopupCfg s e) Source #
Instance details Defined in Monomer.Widgets.Containers.Popup Methods alignCenter :: PopupCfg s e Source # alignCenter_ :: Bool -> PopupCfg s e Source #
CmbAlignLeft (PopupCfg s e) Source #
Instance details Defined in Monomer.Widgets.Containers.Popup Methods alignLeft :: PopupCfg s e Source # alignLeft_ :: Bool -> PopupCfg s e Source #
CmbAlignMiddle (PopupCfg s e) Source #
Instance details Defined in Monomer.Widgets.Containers.Popup Methods alignMiddle :: PopupCfg s e Source # alignMiddle_ :: Bool -> PopupCfg s e Source #
CmbAlignRight (PopupCfg s e) Source #
Instance details Defined in Monomer.Widgets.Containers.Popup Methods alignRight :: PopupCfg s e Source # alignRight_ :: Bool -> PopupCfg s e Source #
CmbAlignTop (PopupCfg s e) Source #
Instance details Defined in Monomer.Widgets.Containers.Popup Methods alignTop :: PopupCfg s e Source # alignTop_ :: Bool -> PopupCfg s e Source #
WidgetEvent e => CmbOnChange (PopupCfg s e) Bool e Source #
Instance details Defined in Monomer.Widgets.Containers.Popup Methods onChange :: (Bool -> e) -> PopupCfg s e Source #
CmbOnChangeReq (PopupCfg s e) s e Bool Source #
Instance details Defined in Monomer.Widgets.Containers.Popup Methods onChangeReq :: (Bool -> WidgetRequest s e) -> PopupCfg s e Source #

popupAnchor :: WidgetNode s e -> PopupCfg s e Source #

Sets the widget that will be used as the anchor for the popup. In general, this anchor will also act as the trigger to open the popup (e.g. a button). When the popup is open, the anchor will be used to position the content, taking scroll and window size into consideration.

popupAlignToOuterH :: PopupCfg s e Source #

Align the popup to the horizontal outer edges of the anchor. It only works with alignLeft and alignRight, which need to be specified separately.

This option only works when popupAnchor is set.

popupAlignToOuterH_ :: Bool -> PopupCfg s e Source #

Sets whether to align the popup to the horizontal outer edges of the anchor. It only works with alignLeft and alignRight, which need to be specified separately.

This option only works when popupAnchor is set.

popupAlignToOuterV :: PopupCfg s e Source #

Align the popup vertically to the outer edges of the anchor. It only works with alignTop and alignBottom, which need to be specified separately.

This option only works when popupAnchor is set.

popupAlignToOuterV_ :: Bool -> PopupCfg s e Source #

Sets whether to align the popup vertically to the outer edges of the anchor. It only works with alignTop and alignBottom, which need to be specified separately.

This option only works when popupAnchor is set.

popupAlignToWindow :: PopupCfg s e Source #

Alignment will be relative to the application's main window.

popupAlignToWindow_ :: Bool -> PopupCfg s e Source #

Sets whether alignment will be relative to the application's main window.

popupOffset :: Point -> PopupCfg s e Source #

Offset to be applied to the location of the popup. It is applied after alignment options but before adjusting for screen boundaries.

popupOpenAtCursor :: PopupCfg s e Source #

The popup will open at the current cursor position.

popupOpenAtCursor_ :: Bool -> PopupCfg s e Source #

Sets whether the popup will open at the current cursor position.

popupDisableClose :: PopupCfg s e Source #

Clicking outside the popup's content will not close it.

popupDisableClose_ :: Bool -> PopupCfg s e Source #

Sets whether clicking outside the popup's content will not close it.

Constructors

popup Source #

Arguments

:: WidgetModel s
=> ALens' s Bool	The lens into the model.
-> WidgetNode s e	The child node.
-> WidgetNode s e	The created popup.

Creates a popup with the given lens to determine its visibility.

popup_ Source #

Arguments

:: WidgetModel s
=> ALens' s Bool	The lens into the model.
-> [PopupCfg s e]	The config options.
-> WidgetNode s e	The child node.
-> WidgetNode s e	The created popup.

Creates a popup with the given lens to determine its visibility. Accepts config.

popupV Source #

Arguments

:: (WidgetModel s, WidgetEvent e)
=> Bool	The current value.
-> (Bool -> e)	The event to raise on change.
-> WidgetNode s e	The child node.
-> WidgetNode s e	The created popup.

Creates a popup using the given value to determine its visibility and onChange event handler.

popupV_ Source #

Arguments

:: (WidgetModel s, WidgetEvent e)
=> Bool	The current value.
-> (Bool -> e)	The event to raise on change.
-> [PopupCfg s e]	The config options.
-> WidgetNode s e	The child node.
-> WidgetNode s e	The created popup.

Creates a popup using the given value to determine its visibility and onChange event handler. Accepts config.

popupD_ Source #

Arguments

:: WidgetModel s
=> WidgetData s Bool	The `WidgetData` to retrieve the value from.
-> [PopupCfg s e]	The config options.
-> WidgetNode s e	The child node.
-> WidgetNode s e	The created popup.

Creates a popup providing a WidgetData instance to determine its visibility and config.