Class “Composite”

Object > NativeObject > Widget > Composite

An empty widget that can contain other widgets.

Composite on Android
Android
Composite on iOS
iOS
TypeScript type Composite<ChildType extends Widget = Widget> extends Widget
Constructor public
Singleton No
Namespace tabris
Direct subclasses Canvas, ContentView, NavigationView, Page, RefreshComposite, ScrollView, StackComposite, Tab, TabFolder
JSX support Element: <Composite/>
Parent element: <Composite/> and any widget extending Composite
Child elements: Widgets
Text content: Not supported

Example

import {Composite, contentView} from 'tabris';

new Composite({left: 0, top: 0, width: 128, height: 256})
  .appendTo(contentView);

Constructor

new Composite(properties?)

Parameter Type Optional Description
properties Properties<Composite> Yes Sets all key-value pairs in the properties object as widget properties.

Methods

append(…widgets)

Adds the given widgets to the composite.

Parameter Type Optional Description
…widgets Widget[] No  

Returns this

append(widgets)

Adds all widgets in the given array to the composite.

Parameter Type Optional Description
widgets Widget[] No  

Returns this

append(widgets)

Adds all widgets in the given collection to the composite.

Parameter Type Optional Description
widgets WidgetCollection No  

Returns this

apply(properties)

Applies the given properties to all descendants that match the associated selector(s).

If you wish to always exclude specific “internal” children from this, overwrite the children method on their parent. See children for details.

Parameter Type Optional Description
properties object No An object in the format {Selector: {property: value, property: value, ... }, Selector: ...}

Returns this

children(selector?)

Returns a (possibly empty) collection of all children of this widget that match the given selector.

When writing custom UI components it may be useful to overwrite this method to prevent access to the internal children by external code. Doing so also affects find and apply, on this widget as well as on all parents, thereby preventing accidental clashes of widget id or class values. See also _children, _find and _apply.

Parameter Type Optional Description
selector Selector<ChildType> Yes A selector expression or a predicate function to filter the results.

Returns WidgetCollection

children(constructor)

Returns a collection containing all children of all widgets in this collection that are instances of the given class.

Parameter Type Optional Description
constructor { new (...args: any[]): U } No A class to filter the results.

Returns WidgetCollection<U>

find(selector?)

Returns a collection containing all descendants of all widgets in this collection that match the given selector.

If you wish to always exclude specific “internal” children from the result, overwrite the children method on their parent. See children for details.

Parameter Type Optional Description
selector Selector<ChildType> Yes A selector expression or a predicate function to filter the results.

Returns WidgetCollection

find(constructor)

Returns a collection containing all descendants of all widgets in this collection that match the given selector.

If you wish to always exclude specific “internal” children from the result, overwrite the children method on their parent. See children for details.

Parameter Type Optional Description
constructor { new (...args: any[]): U } No A class to filter the results.

Returns WidgetCollection<U>

Protected Methods

These methods are accessible only in classes extending Composite.

_apply(properties)

Identical to the apply method, but intended to be used by subclasses in case the children method was overwritten . See children for details.

Parameter Type Optional Description
properties object No An object in the format {Selector: {property: value, property: value, ... }, Selector: ...}

Returns this

_children(selector?)

Identical to the children method, but intended to be used by subclasses in case the children method was overwritten. See children for details.

Parameter Type Optional Description
selector Selector<ChildType> Yes A selector expression or a predicate function to filter the results.

Returns WidgetCollection

_children(constructor)

Identical to the children method, but intended to be used by subclasses in case the children method was overwritten. See children for details.

Parameter Type Optional Description
constructor { new (...args: any[]): U } No A class to filter the results.

Returns WidgetCollection<U>

_find(selector?)

Identical to the find method, but intended to be used by subclasses in case the children method was overwritten. See children for details.

Parameter Type Optional Description
selector Selector<ChildType> Yes A selector expression or a predicate function to filter the results.

Returns WidgetCollection

_find(constructor)

Identical to the find method, but intended to be used by subclasses in case the children method was overwritten. See children for details.

Parameter Type Optional Description
constructor { new (...args: any[]): U } No A class to filter the results.

Returns WidgetCollection<U>

Properties

layout

The layout manager responsible for interpreting the layoutData of the child widgets of this Composite.

Type Layout | null
Default Layout
Settable On creation

This property can only be set via constructor or JSX. Once set, it cannot change anymore.

padding

Additional space to add inside the widgets bounds. A shortcut to setting/getting the padding property of layout.

Type BoxDimensions | number | null
Settable On creation

This property can only be set via constructor or JSX. Once set, it cannot change anymore.

Events

addChild

Fired when a child is added to this widget.

Parameter Type Description
child Widget The widget that is added as a child.
index number Denotes the position in the children list at which the child widget is added.

removeChild

Fired when a child is removed from this widget.

Parameter Type Description
child Widget The widget that is removed.
index number The property index denotes the removed child widget’s position in the children list.`