
Mirror Engine API / ScrollbarComponent
Class: ScrollbarComponent
A ScrollbarComponent enables a group of entities to behave like a draggable scrollbar.
Extends
Component
Properties
entity
entity: Entity
The Entity that this Component is attached to.
Inherited from
Component.entity
system
system: ComponentSystem
The ComponentSystem used to create this Component.
Inherited from
Component.system
enabled
Get Signature
get enabled(): boolean
Gets the enabled state of the component.
Returns
boolean
Set Signature
set enabled(arg: boolean): void
Sets the enabled state of the component.
Parameters
arg
boolean
Returns
void
Overrides
Component.enabled
handleEntity
Get Signature
get handleEntity(): null | Entity
Gets the entity to be used as the scrollbar handle.
Returns
null
| Entity
Set Signature
set handleEntity(arg: null | Entity): void
Sets the entity to be used as the scrollbar handle. This entity must have a ScrollbarComponent.
Parameters
arg
null
| Entity
Returns
void
handleSize
Get Signature
get handleSize(): number
Gets the size of the handle relative to the size of the track.
Returns
number
Set Signature
set handleSize(arg: number): void
Sets the size of the handle relative to the size of the track, in the range 0 to 1. For a vertical scrollbar, a value of 1 means that the handle will take up the full height of the track.
Parameters
arg
number
Returns
void
orientation
Get Signature
get orientation(): number
Gets whether the scrollbar moves horizontally or vertically.
Returns
number
Set Signature
set orientation(arg: number): void
Sets whether the scrollbar moves horizontally or vertically. Can be:
- ORIENTATION_HORIZONTAL: The scrollbar animates in the horizontal axis.
- ORIENTATION_VERTICAL: The scrollbar animates in the vertical axis.
Defaults to ORIENTATION_HORIZONTAL.
Parameters
arg
number
Returns
void
value
Get Signature
get value(): number
Gets the current position value of the scrollbar.
Returns
number
Set Signature
set value(arg: number): void
Sets the current position value of the scrollbar, in the range 0 to 1. Defaults to 0.
Parameters
arg
number
Returns
void
Methods
fire()
fire(
name: string,
arg1?: any,
arg2?: any,
arg3?: any,
arg4?: any,
arg5?: any,
arg6?: any,
arg7?: any,
arg8?: any): EventHandler
Fire an event, all additional arguments are passed on to the event listener.
Parameters
name
string
Name of event to fire.
arg1?
any
First argument that is passed to the event handler.
arg2?
any
Second argument that is passed to the event handler.
arg3?
any
Third argument that is passed to the event handler.
arg4?
any
Fourth argument that is passed to the event handler.
arg5?
any
Fifth argument that is passed to the event handler.
arg6?
any
Sixth argument that is passed to the event handler.
arg7?
any
Seventh argument that is passed to the event handler.
arg8?
any
Eighth argument that is passed to the event handler.
Returns
Self for chaining.
Example
obj.fire('test', 'This is the message')
Inherited from
Component.fire
hasEvent()
hasEvent(name: string): boolean
Test if there are any handlers bound to an event name.
Parameters
name
string
The name of the event to test.
Returns
boolean
True if the object has handlers bound to the specified event name.
Example
obj.on('test', () => {}) // bind an event to 'test'
obj.hasEvent('test') // returns true
obj.hasEvent('hello') // returns false
Inherited from
Component.hasEvent
off()
off(
name?: string,
callback?: HandleEventCallback,
scope?: any): EventHandler
Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, if scope is not provided then all events with the callback will be unbound.
Parameters
name?
string
Name of the event to unbind.
callback?
HandleEventCallback
Function to be unbound.
scope?
any
Scope that was used as the this when the event is fired.
Returns
Self for chaining.
Example
const handler = () => {}
obj.on('test', handler)
obj.off() // Removes all events
obj.off('test') // Removes all events called 'test'
obj.off('test', handler) // Removes all handler functions, called 'test'
obj.off('test', handler, this) // Removes all handler functions, called 'test' with scope this
Inherited from
Component.off
on()
on(
name: string,
callback: HandleEventCallback,
scope?: any): EventHandle
Attach an event handler to an event.
Parameters
name
string
Name of the event to bind the callback to.
callback
HandleEventCallback
Function that is called when event is fired. Note the callback is limited to 8 arguments.
scope?
any
= ...
Object to use as 'this' when the event is fired, defaults to current this.
Returns
Can be used for removing event in the future.
Examples
obj.on('test', (a, b) => {
console.log(a + b)
})
obj.fire('test', 1, 2) // prints 3 to the console
const evt = obj.on('test', (a, b) => {
console.log(a + b)
})
// some time later
evt.off()
Inherited from
Component.on
once()
once(
name: string,
callback: HandleEventCallback,
scope?: any): EventHandle
Attach an event handler to an event. This handler will be removed after being fired once.
Parameters
name
string
Name of the event to bind the callback to.
callback
HandleEventCallback
Function that is called when event is fired. Note the callback is limited to 8 arguments.
scope?
any
= ...
Object to use as 'this' when the event is fired, defaults to current this.
Returns
- can be used for removing event in the future.
Example
obj.once('test', (a, b) => {
console.log(a + b)
})
obj.fire('test', 1, 2) // prints 3 to the console
obj.fire('test', 1, 2) // not going to get handled
Inherited from
Component.once
Events
EVENT_SETVALUE
static EVENT_SETVALUE: string = 'set:value';
Fired whenever the scroll value changes. The handler is passed a number representing the current scroll value.
Example
entity.scrollbar.on('set:value', (value) => {
console.log(`Scroll value is now ${'${value}'}`)
})