ServoyCloudSupportSamplesOpen SourceCommunity

Split Pane

(part of package 'Servoy Extra Components') Extends designtime/SolutionModel: JSWebComponent Extends runtime: RuntimeWebComponent

This is a reference page; many components have detailed usage guides here.

Properties

divLocation

Sets the initial splitter div location, between 0 and 1 is a percentange, more than 1 is a value in pixels.

Type: Number Default Value: -1

divSize

Size of the splitter div - in pixels.

Type: Number Default Value: 5

enabled

Type: Enabled Default Value: true

pane1

Type: CustomType<servoyextra-splitpane.pane>

pane1MinSize

Type: Number Default Value: 30

pane2

Type: CustomType<servoyextra-splitpane.pane>

pane2MinSize

Type: Number Default Value: 30

panes

Type: Array<CustomType<servoyextra-splitpane.pane>>

readOnly

Type: Protected

resizeWeight

Type: Number Default Value: 0

responsiveHeight

Minimum height of the splitpane, set only in responsive forms.

Type: Number Default Value: 300

splitType

Type: Number Default Value: 0

styleClass

Type: Styleclass

tabSeq

Type: Tabseq

visible

Type: Visible

Events

onChangeMethodID(previousIndex,event)

Parameters:

API

getDividerLocation()

Gets the divider location in pixels.

Example:

var dividerSize = myElement.dividerSize

Returns: Number The size in pixels

getDividerSize()

Gets the divider size in pixels.

Example:

var dividerSize = myElement.dividerSize

Returns: Number The size in pixels

getLeftForm()

Returns the left form of the split pane.

Example:

var leftForm = myElement.getLeftForm();

Returns: FormScope Left form of the split pane

getLeftFormMinSize()

Gets left form minimum size in pixels.

Example:

var left = myElement.leftFormMinSize

Returns: Number The minimum size in pixels for the left form panel.

getRelativeDividerLocation()

Gets the divider location in percentage when the component is visible.

Example:

var divRelativeLocation = myElement.getRelativeDividerLocation()

Returns: Number The location in percentage

getResizeWeight()

Gets the resize weight, which specifies how to distribute extra space when the size of the split pane changes. A value of 0, the default, indicates the right/bottom component gets all the extra space (the left/top component acts fixed), where as a value of 1 specifies the left/top component gets all the extra space (the right/bottom component acts fixed). Specifically, the left/top component gets (weight * diff) extra space and the right/bottom component gets (1 - weight) * diff extra space

Example:

var resizeWeight = myElement.resizeWeight

Returns: Number The resize weight value, indicating how the extra space is distributed between the left/top and right/bottom components of the split pane.

getRightForm()

Returns the right form of the split pane.

Example:

var rightForm = myElement.getRightForm();

Returns: FormScope Right form of the split pane

getRightFormMinSize()

Gets right form minimum size in pixels.

Example:

var right = myElement.rightFormMinSize

Returns: Number The minimum size in pixels for the right form panel.

setDividerLocation(location)

Sets divider location. If location is less then 1 then the location will be considered at (location * 100) percent of the split pane from left, otherwise it will represent the pixels from left.

Example:

myElement.dividerLocation = 0.75;
myElement.dividerLocation = 100;

Parameters:

  • {Number} location The location of the divider.

setDividerSize(size)

Sets divider size in pixels.

Example:

myElement.dividerSize = 10;

Parameters:

  • {Number} size The size of the divider in pixels.

setLeftForm(form,relation)

Set a relationless or related form as left panel.

Example:

myElement.setLeftForm(forms.orders);

Parameters:

  • {Object} form The specified form or form name you wish to add as left panel

  • {Object} [relation] The relation object used to link the left panel form to the main datasource, or null for a relationless form.

Returns: Boolean Value indicating if pane was successfully added

setLeftFormMinSize(minSize)

Sets left form minimum size in pixels.

Example:

myElement.leftFormMinSize = 100;

Parameters:

  • {Number} minSize The minimum size in pixels for the left form panel.

setResizeWeight(resizeWeight)

Sets the resize weight, which specifies how to distribute extra space when the size of the split pane changes. A value of 0, the default, indicates the right/bottom component gets all the extra space (the left/top component acts fixed), where as a value of 1 specifies the left/top component gets all the extra space (the right/bottom component acts fixed). Specifically, the left/top component gets (weight * diff) extra space and the right/bottom component gets (1 - weight) * diff extra space

Example:

myElement.resizeWeight = 10;

Parameters:

  • {Number} resizeWeight The weight value (between 0 and 1) specifying how to distribute extra space between the left/top and right/bottom components of the split pane.

setRightForm(form,relation)

Set a relationless or related form as right panel.

Example:

myElement.setRightForm(forms.orders);

Parameters:

  • {Object} form The specified form or form name you wish to add as right panel

  • {Object} [relation] The relation object used to link the right panel form to the main datasource, or null for a relationless form.

Returns: Boolean Value indicating if pane was successfully added

setRightFormMinSize(minSize)

Sets right form minimum size in pixels.

Example:

myElement.rightFormMinSize = 100;

Parameters:

  • {Number} minSize The minimum size in pixels for the right form panel.

Types

pane

scripting type: CustomType<servoyextra-splitpane.pane>

PreviousSliderNextTabPanel

Last updated

Was this helpful?