Drawer

The Drawer is a panel-type container which is hidden until activated with a button-type input control. When the user interacts with the button, the panel slides over the current dashboard.

Public Variables (Properties)

[?]

Common variables and variable groups: Name, Advanced Properties, Container Properties, Styles, Preloader, Events, Bindings.

Inherited Variables (Properties)

The Drawer component is a container and inherits shared container properties.

Button Label

Text to apply to the button component displayed in the dashboard

Variable Name:

buttonLabel

Records:

1

Record Format:

Field Name

Field Type

Notes

buttonLabel

String

Button label.

Button Theme Type

Allows switching between graphical presentations of the button. Themes can be modified using CSS-related properties like Style.

Variable Name:

buttonTheme

Records:

1

Record Format:

Field Name

Field Type

Notes

buttonTheme

String

Select theme to apply to the button:

  • Default

  • Main

  • Secondary

  • Simple

  • Auxiliary

Button Image

The image to display on the button.

Variable Name:

buttonImage

Records:

1

Record Format:

Field Name

Field Type

Notes

imageType

Integer

Choose whether to use data from the imageData field or the imageURL field.

  • 0 - Image Data

  • 1 - URL

imageData

Data Block

Image data.

imageUrl

String

Image URL.

Button Disabled

This flag indicates the component is active. Disabled components do not respond to user input, and are rendered as grayed-out.

Variable Name:

buttonDisabled

Records:

1

Record Format:

Field Name

Field Type

Notes

buttonDisabled

Boolean

Toggles whether button can be used as input.

Panel Title

HTML-formatted text which will be displayed in a HTML 'div' above the drawer content

Variable Name:

title

Records:

1

Record Format:

Field Name

Field Type

Notes

title

String

Drawer title, accepts HTML formatting.

Panel Placement

Indicates which portion of the screen the drawer will occupy.

Variable Name:

placement

Records:

1

Record Format:

Field Name

Field Type

Notes

placement

String

Indicates positioning of the drawer component:

  • Top

  • Bottom

  • Left

  • Right

Panel Size

Controls the size of the drawer component in pixels.

Variable Name:

size

Records:

1

Record Format:

Field Name

Field Type

Notes

size

String

Indicates the size of the drawer panel in pixels.

  • Indicates panel height if drawer panel placement is "top" or "bottom"

  • indicates panel width if drawer panel placement is "right" or "left"

Panel Mask

The panel mask hides the part of the interface not covered by the drawer component. When the drawer is open and the user clicks the mask, the drawer will be closed. When panel mask is false, the part of the interface not covered by the drawer will remain visible to the user.

Variable Name:

mask

Records:

1

Record Format:

Field Name

Field Type

Notes

mask

boolean

Covers the part of the interface not hidden by the drawer.

Drawer Visible

Indicates whether the drawer panel is visible or hidden. Bindings can target this property to toggle the visibility of the panel.

Variable Name:

drawerVisible

Records:

1

Record Format:

Field Name

Field Type

Notes

drawerVisible

boolean

Panel visible when True.

Panel Close Icon

Replaces the default close icon of the drawer component.

Variable Name:

closeIcon

Records:

1

Record Format:

Field Name

Field Type

Notes

imageType

Integer

Choose whether to use data from the imageData field or the imageURL field.

  • 0 - Image Data

  • 1 - URL

imageData

Data Block

Image data.

imageUrl

String

Image URL.

Public Events

[?]

Common Events: none

Was this page helpful?