Class: Slider

Slider

A slider is a form of input to set a variable to a value in a continuous range. It cannot have its own children.

new Slider (options)

Name Type Description
options Object

Slider settings

Name Type Default Description
track PIXI.UI.SliceSprite | PIXI.UI.Sprite

Any type of UIOBject, will be used for the slider track

handle PIXI.UI.SliceSprite | PIXI.UI.Sprite

will be used as slider handle

fill PIXI.UI.SliceSprite | PIXI.UI.Sprite null optional

will be used for slider fill

vertical boolean false optional

Direction of the slider

value number 0 optional

value of the slider

minValue number 0 optional

minimum value

maxValue number 100 optional

max value

decimals boolean 0 optional

the decimal precision (use negative to round tens and hundreds)

onValueChange callback null optional

Callback when the value has changed

onValueChanging callback null optional

Callback while the value is changing

Extends

Members

PUXI.Slider.DEFAULT_HANDLE static

PUXI.Slider.DEFAULT_HORIZONTAL_TRACK static

The default track for horizontally oriented sliders.

PUXI.Slider.DEFAULT_VERTICAL_TRACK static

The default track for vertically oriented sliders.

PUXI.Slider.HORIZONTAL static

Horizontal orientation

PUXI.Slider.VERTICAL static

Vertical orientation

alpha number inherited overrides

Alpha of this widget & its contents.

contentContainer PIXI.Container readonly inherited overrides

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

contentHeight number readonly inherited overrides

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

contentWidth number readonly inherited overrides

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

height number readonly inherited overrides

Layout height of this widget.

insetContainer PIXI.Container readonly inherited overrides

This container owns the background + content of this widget.

Whether this widget is interactive in the PixiJS scene graph.

layoutMeasure PUXI.Insets readonly inherited overrides

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

measuredHeight number inherited overrides

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

measuredWidth number inherited overrides

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

paddingBottom number inherited overrides

Padding on bottom side.

paddingHorizontal number readonly inherited overrides

Sum of left & right padding.

paddingLeft number inherited overrides

Padding on left side.

paddingRight number inherited overrides

Padding on right side.

paddingTop number inherited overrides

Padding on top side.

paddingVertical number readonly inherited overrides

Sum of top & bottom padding.

percentValue number

The value expressed as a percentage from min. to max. This will always be between 0 and 1.

The actual value is: this.minValue + this.percentValue * (this.maxValue - this.minValue).

stage PUXI.Stage readonly inherited overrides

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

widgetChildren Array.<PUXI.Widget> readonly inherited overrides

Children of this widget. Use WidgetGroup to position children.

width number readonly inherited overrides

Layout width of this widget.

Methods

addChild (widgets)Widget inherited overrides

Adds the widgets as children of this one.

Name Type Description
widgets Array.<PUXI.Widget> repeatable
Returns:
Type Description
Widget
  • this widget

clearDraggable () inherited overrides

Makes this widget not draggable.

clearDroppable () inherited overrides

Makes this widget not droppable.

getBackground ()PIXI.Container inherited overrides

Returns:
Type Description
PIXI.Container
  • the background display-object

getBackgroundAlpha ()number inherited overrides

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

getElevation ()number inherited overrides

Returns:
Type Description
number the elevation set on this widget

getMeasuredHeight ()number inherited overrides

Alias for Widget.measuredHeight.

Returns:
Type Description
number the measured height

getMeasuredWidth ()number inherited overrides

Alias for Widget.measuredWidth.

Returns:
Type Description
number the measured width

getPhysicalRange () protected

Returns:
the amount of the freedom that handle has in physical units, i.e. pixels. This is the width of the track minus the handle's size.

getValueAtPhysicalPosition (cursor) protected

Name Type Description
cursor PIXI.Point
Returns:
the value of the slider if the handle's center were (globally) positioned at the given point.

initialize () protected inherited overrides

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.

layoutHandle ()

Re-positions the handle. This should be called after _value has been changed.

makeDraggable () inherited overrides

Makes this widget draggable.

makeDroppable () inherited overrides

Makes this widget droppable.

measure (width, height, widthMode, heightMode) inherited overrides

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 inherited overrides

Slider lays the track to fill all of its width and height. The handle is aligned in the middle in the non-oriented direction.

Name Type Description
l
t
r
b
dirty

onMeasure (width, height, widthMode, heightMode) overrides

Slider measures itself using the track's natural dimensions in its non-oriented direction. The oriented direction will be the equal the range's size times the track's resolution.

Name Type Description
width
height
widthMode
heightMode

removeChild (widgets)Widget inherited overrides

Orphans the widgets that are children of this one.

Name Type Description
widgets Array.<PUXI.Widget> repeatable
Returns:
Type Description
Widget
  • this widget

requestLayout () inherited overrides

Will trigger a full layout pass next animation frame.

setBackground (bg) inherited overrides

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) inherited overrides

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) inherited overrides

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 inherited overrides

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) inherited overrides

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)