LayoutView

Label: :IA_Function
Property: type: LayoutView
Inherits from: Function and View

The LayoutView Function allows users to display multiple Views simultaneously. It divides the workspace into horizontal or vertical panels with tabs in each one to see, organize and switch between different views efficiently. Each panel can be resized manually.

The View is based on Docking Layout from Smart HTML Elements

Function parameters

Key Description Default value Possible values
$layout The initial layout description {} Object
#actions List of update actions to be performed on LayoutPanel items [] Array of actions (documented bellow)

Layout description

The $layout description can contain the following types of elements

LayoutGroup

Is used to split an area horizontally or vertically between multiple LayoutPanels or other LayoutGroups. A LayoutGroup should be the root element of the $layout parameter.

Key Description Default value Possible values
type Type of layout element LayoutGroup
orientation A string value indicating the orientation of the Splitter group null horizontal / vertical.
size A string number value indicating the size of the Splitter group
items A collection of LayoutPanel or LayoutGroup definitions {}
resizeMode A string indicating the resize mode. 'none', 'adjacent', 'end', 'proportional'.
resizeStep A numeric value that determines the step of resizing 1 number
liveResize Determines if splitter resizing happens while dragging or not false boolean

LayoutPanel

A LayoutPanel holds one or more Tabs

Key Description Default value Possible values
type Type of layout element LayoutPanel
autoHide a boolean property that determines if the LayoutPanel is autoHidden false Boolean
autoHidePosition determines the autoHide position of the item if autoHide property is set top, bottom, left, right
dropPosition Determines the possible positions for the item at which a new item can be dropped as a result of dragging top, bottom, left, right, center, header, layout-top, layout-bottom, layout-left, layout-right. Positions with the layout prefix reflect on LayoutPanelItems that are children of the LayoutPanel
label the Label of the LayoutPanel window String
tabPosition Determines the position of the Tab labels inside the LayoutPanel
layout determines the DockingLayout owner of the LayoutPanel. Accepts a string indicating the ID of a DockingLayout on the page or a direct reference to it
headerButtons an Array of strings that define the buttons in the header section of the DockingLayout item
tabCloseButtons a boolean property that Enables or disables the close buttons inside each Tab item label inside the DockingLayout item
tabOverflow same as overflow property of smartTabs. It defines the overflow mode of the labels of the Tab items inside a DockingLayout item
selectionMode the same as smartTabs selection modes. Applies to Tab items inside a DockingLayout item
tabResize the same as resize property of smartTabs. Allows resizing the Tab labels inside the DockingLayout item
locked Locks the size of the item and does not allow resizing
max sets the maximum size of the item
min sets the minimum size of the ite
size sets the size of the item
items a collection of objects. Each object defines the structure of a Tab. Each tab will will be uniquely identified by the key (in the items object.) Object

Tab

The tab is the LayoutView element that contains other Graphileon Views.

Key Description Default value Possible values
area Graphileon View area ID String
label a string representing the label of the Tab item String
selected determines if the tab is selected. By default the first added item to the LayoutPanel is automatically selected Boolean
draggable a boolean property that allows to disable the dragging of the Tab item true Boolean

For tabs the type should not be specified because it's implied.

Action description¢

Key Description Default value Possible values
type Action to be performed update
element a string representing key (in the layout description) of the LayoutPanel that contains the Tabs to be updated String
data.tabs A collection of Tab descriptions (similar to LayoutPanel's items). Existing Tabs will be updated and missing ones will be created. object

Outgoing triggers

Type: tabCreated

Occurrence: After a new tab is created in a panel.

Additional event properties (besides the inherited properties):

Key Description Possible values
data.panel Key of the panel that contains the new tab String
data.value Properties of the created tab Object

Type: tabUpdated

Occurrence: After a tab's properties are updated.

Additional event properties (besides the inherited properties):

Key Description Possible values
data.panel Key of the panel that contains the tab String
data.value Properties of the updated tab Object

Type: tabSelected

Occurrence: When a new tab is selected on a panel.

Additional event properties (besides the inherited properties):

Key Description Possible values
data.panel Key of the panel that contains the tab String
data.value Properties of the selected tab Object

Type: tabClosed

Occurrence: When a tab is closed on a panel.

Additional event properties (besides the inherited properties):

Key Description Possible values
data.panel Key of the panel that contained the tab String
data.value Properties of the closed tab Object

Type: lastTabClosed

Occurrence: When the last tab of a panel is closed.

Additional event properties (besides the inherited properties):

Key Description Possible values
data.panel Key of the panel that contained the tab String
data.value Properties of the closed tab Object