Phaser 3 UI Components

Class: UIScrollBar

PhaserComps.UIComponents. UIScrollBar

Scroll bar component. can be vertical or horizontal
It have up and down buttons inside, draggable thumb button.
DIMENSIONS zone defines thumb drag bounds.

default value range is 0 to 1, You can change it by setting min and max value. Also you can set value step, so value will always be stepped by it

new UIScrollBar( [parent] [, key] [, vertical])

Parameters:
Name Type Argument Default Description
parent PhaserComps.UIComponents.UIComponentPrototype <optional>

UIComponentPrototype instance to find clip inside
key String <optional>

key to find clip inside parent
vertical Boolean <optional>
 false

scroll bar behave like vertical or horizontal
Properties:
Name Type Description
value Number

current bar value, from min value to max, default is from 0 to 1
Fires:

Methods

_onZoneDown()

Zone around scrollbar thumb click handler

onClipAppend()

onClipProcess()

<protected> onNextClick()

<protected> onPrevClick()

setButtonStep(val)

Parameters:
Name Type Description
val Number

setValueBounds(minValue, maxValue [, valueStep])

Setup scroll bar value bounds and value step

Parameters:
Name Type Argument Default Description
minValue Number

minimum value
maxValue Number

maximum value
valueStep Number <optional>
 0

value change step

Type Definitions

StepConfig

Properties:
Name Type Description
stepValue Number

max value of this step
config PhaserComps.ComponentClip.StateConfig

Events

EVENT_CHANGE

Emitted on scroll bar value change.

Parameters:
Name Type Description
value Number

current scrollbar value