Engine API Reference - v2.7.3
    Preparing search index...

    Class ScrollViewComponent

    A ScrollViewComponent enables a group of entities to behave like a masked scrolling area, with optional horizontal and vertical scroll bars.

    Hierarchy (View Summary)

    Index

    Properties

    entity system

    Accessors

    bounceAmount contentEntity enabled friction horizontal horizontalScrollbarEntity horizontalScrollbarVisibility mouseWheelSensitivity scroll scrollMode useMouseWheel vertical verticalScrollbarEntity verticalScrollbarVisibility viewportEntity

    Methods

    fire hasEvent off on once

    Events

    EVENT_SETSCROLL

    Properties

    entity: Entity

    The Entity that this Component is attached to.

    system: ComponentSystem

    The ComponentSystem used to create this Component.

    Accessors

    • get friction(): number

      Gets how freely the content should move if thrown.

      Returns number

    • set friction(arg: number): void

      Sets how freely the content should move if thrown, i.e. By flicking on a phone or by flinging the scroll wheel on a mouse. A value of 1 means that content will stop immediately; 0 means that content will continue moving forever (or until the bounds of the content are reached, depending on the scrollMode).

      Parameters

      • arg: number

      Returns void

    • get horizontalScrollbarVisibility(): number

      Gets whether the horizontal scrollbar should be visible all the time, or only visible when the content exceeds the size of the viewport.

      Returns number

    • set horizontalScrollbarVisibility(arg: number): void

      Sets whether the horizontal scrollbar should be visible all the time, or only visible when the content exceeds the size of the viewport.

      Parameters

      • arg: number

      Returns void

    • get mouseWheelSensitivity(): Vec2

      Gets the mouse wheel horizontal and vertical sensitivity.

      Returns Vec2

    • set mouseWheelSensitivity(arg: Vec2): void

      Sets the mouse wheel horizontal and vertical sensitivity. Only used if useMouseWheel is set. Setting a direction to 0 will disable mouse wheel scrolling in that direction. 1 is a default sensitivity that is considered to feel good. The values can be set higher or lower than 1 to tune the sensitivity. Defaults to [1, 1].

      Parameters

      Returns void

    • get verticalScrollbarVisibility(): number

      Gets whether the vertical scrollbar should be visible all the time, or only visible when the content exceeds the size of the viewport.

      Returns number

    • set verticalScrollbarVisibility(arg: number): void

      Sets whether the vertical scrollbar should be visible all the time, or only visible when the content exceeds the size of the viewport.

      Parameters

      • arg: number

      Returns void

    Methods

    • Fire an event, all additional arguments are passed on to the event listener.

      Parameters

      • name: string

        Name of event to fire.

      • Optionalarg1: any

        First argument that is passed to the event handler.

      • Optionalarg2: any

        Second argument that is passed to the event handler.

      • Optionalarg3: any

        Third argument that is passed to the event handler.

      • Optionalarg4: any

        Fourth argument that is passed to the event handler.

      • Optionalarg5: any

        Fifth argument that is passed to the event handler.

      • Optionalarg6: any

        Sixth argument that is passed to the event handler.

      • Optionalarg7: any

        Seventh argument that is passed to the event handler.

      • Optionalarg8: any

        Eighth argument that is passed to the event handler.

      Returns EventHandler

      Self for chaining.

      obj.fire('test', 'This is the message');

    • 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.

      obj.on('test', () => {}); // bind an event to 'test'
      obj.hasEvent('test'); // returns true
      obj.hasEvent('hello'); // returns false

    • 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

      • Optionalname: string

        Name of the event to unbind.

      • Optionalcallback: HandleEventCallback

        Function to be unbound.

      • Optionalscope: any

        Scope that was used as the this when the event is fired.

      Returns EventHandler

      Self for chaining.

      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

    • 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.

      • Optionalscope: any = ...

        Object to use as 'this' when the event is fired, defaults to current this.

      Returns EventHandle

      Can be used for removing event in the future.

      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();

    • 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.

      • Optionalscope: any = ...

        Object to use as 'this' when the event is fired, defaults to current this.

      Returns EventHandle

      • can be used for removing event in the future.
      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

    Events

    EVENT_SETSCROLL: string = 'set:scroll'

    Fired whenever the scroll position changes. The handler is passed a Vec2 containing the horizontal and vertical scroll values in the range 0..1.

    entity.scrollview.on('set:scroll', (scroll) => {
        console.log(`Horizontal scroll position: ${scroll.x}`);
        console.log(`Vertical scroll position: ${scroll.y}`);
    });

    Settings

    Member Visibility

    On This Page

    Properties
    Accessors
    Methods
    Events