Properties

config

This items configuration in its current state

type

The type of the item. Can be row, column, stack, component or root

contentItems

An array of items that are children of this item

parent

The item that is this item's parent (or null if the item is root)

id

A String or array of identifiers if provided in the configuration

isInitialised

True if the item had been initialised

isMaximised

True if the item is maximised

isRoot

True if the item is the layout's root item

isRow

True if the item is a row

isColumn

True if the item is a column

isStack

True if the item is a stack

isComponent

True if the item is a component

layoutManager

A reference to the layoutManager that controls this item

element

The item's outer element

childElementContainer

The item's inner element. Can be the same as the outer element.

Events

stateChanged

Fired whenever something happened to this item or its children that changes the state of the layout (as returned by layout.toConfig)

titleChanged

Updated whenever the item's title changes as a result of calling setTitle() on either the item or from a container

activeContentItemChanged <contentItem>

Fired whenever a different item is selected from a Stack

itemDestroyed <Bubbling Event>

Fired whenever this item or one of its children gets destroyed

itemCreated <Bubbling Event>

Fired whenever an item gets created as child of this item

componentCreated <Bubbling Event>

Fired whenever a component gets created as child of this item

rowCreated <Bubbling Event>

Fired whenever a row gets created as child of this item

columnCreated <Bubbling Event>

Fired whenever a column gets created as child of this item

stackCreated <Bubbling Event>

Fired whenever a stack gets created as child of this item

addChild( itemOrItemConfig, index )

argument type optional default description
itemOrItemConfig ContentItem or Configuration false - A content item (or tree of content items) or an ItemConfiguration to create the item from
index Number true last index An optional index that determines at which position the new item should be added.

Adds an item as a child to this item. If the item is already a part of a layout it will be removed from its original position before adding it to this item.

removeChild( contentItem, keepChild )

argument type optional default description
contentItem ContentItem false - The contentItem that should be removed
keepChild Boolean true false If true the item won't be destroyed. (Use cautiosly, if the item isn't destroyed it's up to you to destroy it later)

Destroys the item and all it's children.

replaceChild( oldChild, newChild )

argument type optional default description
oldChild ContentItem false - The contentItem that should be removed
newChild ContentItem or Configuration false - A content item (or tree of content items) or an ItemConfiguration to create the item from

Replaces oldChild with newChild

setSize()

Updates the items size. To actually assign a new size from within a component, use container.setSize( width, height )

setTitle( title )

argument type optional default description
title String false - the new title

Sets the item's title to the provided value. Triggers titleChanged and stateChanged events

callDownwards(functionName, functionArguments, bottomUp, skipSelf)

argument type optional default description
functionName String false - The name of the method to invoke
functionArguments Array true - An array of arguments to pass to every function
bottomUp Boolean true false If true, the method is invoked on the lowest parts of the tree first and then bubbles upwards
skipSelf Boolean true false If true, the method will only be invoked on the item's children, but not on the item itself

A powerful, yet admittedly confusing method to recursively call methods on items in a tree. Usually you wouldn't need to use it directly, but it's used internally to setSizes, destroy parts of the item tree etc.

emitBubblingEvent( name )

argument type optional default description
title String false - the name of the event

Emits an event that bubbles up the item tree until it reaches the root element (and after a delay the layout manager). Useful e.g. for indicating state changes.

remove()

Convenience method for item.parent.removeChild( item )

popout()

Removes the item from its current position in the layout and opens it in a window

toggleMaximise()

Maximises the item or minimises it if it's already maximised

select()

Selects the item. Only relevant if settings.selectionEnabled is set to true

deselect()

Unselects the item. Only relevant if settings.selectionEnabled is set to true

hasId(id)

argument type optional default description
id String false - An id to check for

Returns true if the item has the specified id or false if not

setActiveContentItem( contentItem )

argument type optional default description
contentItem Strelit Layout item false - The new active content item

Only Stacks have this method! It's the programmatical equivalent of clicking a tab.

getActiveContentItem()

Only Stacks have this method! Returns the currently selected contentItem.

addId(id)

argument type optional default description
id String false - The id to be added

Adds an id to an item or does nothing if the id is already present

removeId(id)

argument type optional default description
id String false - The id to be removed

Removes an id from an item or throws an error if the id couldn't be found

getItemsByFilter(filterFunction)

argument type optional default description
filterFunction Function false - A function that determines whether an item matches certain criteria

Calls filterFunction recursively for every item in the tree. If the function returns true the item is added to the resulting array

getItemsById( id )

argument type optional default description
id String false - An id specified in the itemConfig

Returns all items with the specified id.

getItemsByType( type )

argument type optional default description
type String false - 'row', 'column', 'stack', 'component' or 'root'

Returns all items with the specified type

getComponentsByName( componentName )

argument type optional default description
type String false - a componentName as specified in the itemConfig

Returns all instances of the component with the specified componentName

Community & Support

Need help or have architectural questions?

Whether you are building complex multi-screen trading terminals, enterprise data workspaces, or migrating from legacy layout engines, the Strelit UI Kit engineering team and community are here to help.

Open an Issue on GitHub →