Class: Widget

Extends

• PIXI.utils.EventEmitter

Implements

• PUXI.IMeasurable

Members

alpha number

Alpha of this widget & its contents.

contentContainer PIXI.Container readonly

This container holds the content of this widget. Subclasses should add renderable display-objects to this container.

contentHeight number readonly

Layout height of this widget's content, which is the height minus vertical padding.

contentWidth number readonly

Layout width of this widget's content, which is the width minus horizontal padding.

height number readonly

Layout height of this widget.

insetContainer PIXI.Container readonly

This container owns the background + content of this widget.

interactive boolean

Whether this widget is interactive in the PixiJS scene graph.

layoutMeasure PUXI.Insets readonly

Layout insets of this widget. In normal state, the widget should be in this rectangle inside the parent reference frame.

measuredHeight number

The measured height that is used by the parent's layout manager to place this widget.

measuredWidth number

The measured width that is used by the parent's layout manager to place this widget.

paddingBottom number

Padding on bottom side.

paddingHorizontal number readonly

Sum of left & right padding.

paddingLeft number

Padding on left side.

paddingRight number

Padding on right side.

paddingTop number

Padding on top side.

paddingVertical number readonly

Sum of top & bottom padding.

stage PUXI.Stage readonly

Stage whose scene graph holds this widget. Once set, this cannot be changed.

widgetChildren Array.<PUXI.Widget> readonly

Children of this widget. Use WidgetGroup to position children.

width number readonly

Layout width of this widget.

Methods

PUXI.Widget.fromContent (content) static

puxi.mjs:1217

Creates a widget that holds the display-object as its content. If content is a PUXI.Widget, then it will be returned.

Name	Type	Description
content	PIXI.Container | Widget

PUXI.Widget.resolveMeasuredDimen (natural, limit, mode) static

puxi.mjs:1231

Easy utility to resolve measured dimension.

Name	Type	Description
natural	number	your widget's natural dimension
limit	number	width/height limit passed by parent
mode	PUXI.MeasureMode	measurement mode passed by parent

addChild (widgets)Widget

puxi.mjs:1058

Adds the widgets as children of this one.

Name	Type	Description
widgets	Array.<PUXI.Widget>	repeatable

Returns:

Type	Description
Widget	this widget

clearDraggable ()

puxi.mjs:1101

Makes this widget not draggable.

clearDroppable ()

puxi.mjs:1183

Makes this widget not droppable.

getBackground ()PIXI.Container

puxi.mjs:963

Returns:

Type	Description
PIXI.Container	the background display-object

getBackgroundAlpha ()number

puxi.mjs:997

Returns:

Type	Description
number	the alpha on the background display-object.

getElevation ()number

puxi.mjs:1017

Returns:

Type	Description
number	the elevation set on this widget

getMeasuredHeight ()number

puxi.mjs:710

Alias for Widget.measuredHeight.

Returns:

Type	Description
number	the measured height

getMeasuredWidth ()number

puxi.mjs:702

Alias for Widget.measuredWidth.

Returns:

Type	Description
number	the measured width

initialize () protected

puxi.mjs:1119

Widget initialization related to the stage. This method should always call super.initialize().

This method expects stage to be set before calling it. This is handled by the Stage itself.

This will set initialized to true. If it was already set to true, it should do nothing.

makeDraggable ()

puxi.mjs:1091

Makes this widget draggable.

makeDroppable ()

puxi.mjs:1173

Makes this widget droppable.

measure (width, height, widthMode, heightMode)

puxi.mjs:758

This method calls Widget.onMeasure and should not be overriden. It does internal bookkeeping.

Name	Type	Description
width	number
height	number
widthMode	PUXI.MeasureMode
heightMode	PUXI.MeasureMode

onLayout (l, t, r, b, dirty) protected

puxi.mjs:772

This method should set the frame in which rendering will occur and lay out child widgets in that frame.

Name	Type	Default	Description
l
t
r
b
dirty		true

onMeasure (width, height, widthMode, heightMode)

puxi.mjs:723

Override this method to measure the dimensions for your widget. By default, it will use the natural width/height of this widget's content (contentContainer) plus any padding.

Name	Type	Description
width	number	width of region provided by parent
height	number	height of region provided by parent
widthMode	PUXI.MeasureMode	mode in which provided width is to be used
heightMode	PUXI.MeasureMode	mode in which provided height is to be used

removeChild (widgets)Widget

puxi.mjs:1076

Orphans the widgets that are children of this one.

Name	Type	Description
widgets	Array.<PUXI.Widget>	repeatable

Returns:

Type	Description
Widget	this widget

requestLayout ()

puxi.mjs:1049

Will trigger a full layout pass next animation frame.

setBackground (bg)

puxi.mjs:973

The background of a widget is a PIXI.DisplayObject that is rendered before all of its children.

Name	Type	Description
bg	PIXI.Container | number | string	the background display-object or a color that will be used to generate a PIXI.Graphics as the background.

setBackgroundAlpha (val)

puxi.mjs:1007

This can be used to set the alpha on the background of this widget. This does not affect the widget's contents nor individual components of the background display-object.

Name	Type	Description
val	number	background alpha

setElevation (val)

puxi.mjs:1026

This can be used add a drop-shadow that will appear to raise this widget by the given elevation against its parent.

Name	Type	Description
val	number	elevation to use. 2px is good for most widgets.

setLayoutOptions (lopt)Widget

puxi.mjs:805

Use this to specify how you want to layout this widget w.r.t its parent. The specific layout options class depends on which layout you are using in the parent widget.

Name	Type	Description
lopt	PUXI.LayoutOptions

Returns:

Type	Description
Widget	this

setPadding (l, t, r, b)

puxi.mjs:952

Sets the padding values.

To set all paddings to one value:

widget.setPadding(8);

To set horizontal & vertical padding separately:

widget.setPadding(4, 12);

Name	Type	Default	Description
l	number	0	optional left padding
t	number	l	optional top padding (default is equal to left padding)
r	number	l	optional right padding (default is equal to right padding)
b	number	t	optional bottom padding (default is equal to top padding)