Class ScrollList

Virtualized scrollable list component with optional scrollbar support. Supports touch scrolling, mouse wheel, and swipe gestures with momentum.

Example

import { ScrollList } from 'pixidom.js';

const items = Array.from({ length: 100 }, (_, i) => {
  const container = new PIXI.Container();
  const text = new PIXI.Text(`Item ${i + 1}`);
  container.addChild(text);
  return { container };
});

const scrollList = new ScrollList(
  {
    width: '300px',
    height: '400px',
    backgroundColor: 0x1a1f26,
    dividerColor: 0x30363d,
    dividerPixelHeight: 1,
    scrollBarOptions: {
      width: 8,
      scrollerColor: 0x4a90d9,
    },
  },
  items
);

stage.addChild(scrollList);

Hierarchy

Container
- ScrollList

Constructors

constructor

new ScrollList(
    scrollStyleOptions: ScrollStyleOptions,
    scrollItemOptions: ScrollItemOptions[],
    scrollPerformanceOptions?: ScrolllPerformanceOptions,
): ScrollList
Parameters
- scrollStyleOptions: ScrollStyleOptions
- scrollItemOptions: ScrollItemOptions[]
- OptionalscrollPerformanceOptions: ScrolllPerformanceOptions
Returns ScrollList
Overrides PIXI.Container.constructor
- Defined in Components/ScrollList/ScrollList.ts:166

Properties

alpha

alpha: number

angle

angle: number

buttonMode

buttonMode: boolean

children

children: DisplayObject[]

cursor

cursor: string

`Optional`destroyed

destroyed?: boolean

eventMode

eventMode: EventMode

freezeScroll

freezeScroll: boolean = false

height

height: number

hitArea

hitArea:
    | Rectangle
    | RoundedRectangle
    | { contains(x: number, y: number): boolean }
    | null

interactive

interactive: boolean

interactiveChildren

interactiveChildren: boolean

mask

mask: DisplayObject | null

maxHeight

maxHeight: number = 0

parent

parent: Container | null

`Readonly`performanceOptions

performanceOptions: ScrolllPerformanceOptions

pivot

pivot: Point

position

position: Point

renderable

renderable: boolean

rotation

rotation: number

scale

scale: Point

sortableChildren

sortableChildren: boolean

visible

visible: boolean

width

width: number

worldTransform

worldTransform: {
    a: number;
    b: number;
    c: number;
    d: number;
    tx: number;
    ty: number;
}

x

x: number

y

y: number

Accessors

currentScroll

get currentScroll(): number
Returns number
- Defined in Components/ScrollList/ScrollList.ts:551
set currentScroll(value: number): void
Parameters
- value: number
Returns void
- Defined in Components/ScrollList/ScrollList.ts:536

scrollPercent

get scrollPercent(): number
Returns number
- Defined in Components/ScrollList/ScrollList.ts:300

utilizedLength

get utilizedLength(): number
Returns number
- Defined in Components/ScrollList/ScrollList.ts:296

Methods

addChild

addChild<T extends DisplayObject>(...child: T[]): T
Type Parameters
- T extends DisplayObject
Parameters
- ...child: T[]
Returns T
Inherited from PIXI.Container.addChild
- Defined in global.d.ts:123

addChildAt

addChildAt<T extends DisplayObject>(child: T, index: number): T
Type Parameters
- T extends DisplayObject
Parameters
- child: T
- index: number
Returns T
Inherited from PIXI.Container.addChildAt
- Defined in global.d.ts:124

addListener

addListener(event: string, fn: EventListener): this
Parameters
- event: string
- fn: EventListener
Returns this
Inherited from PIXI.Container.addListener
- Defined in global.d.ts:105

addScrollItem

addScrollItem(container: Container | Graphics | Sprite | Text): void
Parameters
- container: Container | Graphics | Sprite | Text
Returns void
- Defined in Components/ScrollList/ScrollList.ts:571

addScrollItems

addScrollItems(containers: (Container | Graphics | Sprite | Text)[]): void
Parameters
- containers: (Container | Graphics | Sprite | Text)[]
Returns void
- Defined in Components/ScrollList/ScrollList.ts:555

destroy

destroy(options?: DestroyOptions): void
Parameters
- Optionaloptions: DestroyOptions
Returns void
Overrides PIXI.Container.destroy
- Defined in Components/ScrollList/ScrollList.ts:288

emit

emit(event: string, ...args: unknown[]): boolean
Parameters
- event: string
- ...args: unknown[]
Returns boolean
Inherited from PIXI.Container.emit
- Defined in global.d.ts:104

freeze

freeze(): void
Returns void
- Defined in Components/ScrollList/ScrollList.ts:329

getBounds

getBounds(skipUpdate?: boolean): Rectangle
Parameters
- OptionalskipUpdate: boolean
Returns Rectangle
Inherited from PIXI.Container.getBounds
- Defined in global.d.ts:109

getChildAt

getChildAt(index: number): DisplayObject
Parameters
- index: number
Returns DisplayObject
Inherited from PIXI.Container.getChildAt
- Defined in global.d.ts:130

getChildIndex

getChildIndex(child: DisplayObject): number
Parameters
- child: DisplayObject
Returns number
Inherited from PIXI.Container.getChildIndex
- Defined in global.d.ts:128

getGlobalPosition

getGlobalPosition(point?: Point, skipUpdate?: boolean): Point
Parameters
- Optionalpoint: Point
- OptionalskipUpdate: boolean
Returns Point
Inherited from PIXI.Container.getGlobalPosition
- Defined in global.d.ts:108

getLocalBounds

getLocalBounds(rect?: Rectangle): Rectangle
Parameters
- Optionalrect: Rectangle
Returns Rectangle
Inherited from PIXI.Container.getLocalBounds
- Defined in global.d.ts:110

off

off(event: string, fn?: EventListener, context?: unknown): this
Parameters
- event: string
- Optionalfn: EventListener
- Optionalcontext: unknown
Returns this
Inherited from PIXI.Container.off
- Defined in global.d.ts:102

on

on(event: string, fn: EventListener, context?: unknown): this
Parameters
- event: string
- fn: EventListener
- Optionalcontext: unknown
Returns this
Inherited from PIXI.Container.on
- Defined in global.d.ts:101

once

once(event: string, fn: EventListener, context?: unknown): this
Parameters
- event: string
- fn: EventListener
- Optionalcontext: unknown
Returns this
Inherited from PIXI.Container.once
- Defined in global.d.ts:103

removeAllListeners

removeAllListeners(event?: string): this
Parameters
- Optionalevent: string
Returns this
Inherited from PIXI.Container.removeAllListeners
- Defined in global.d.ts:107

removeChild

removeChild<T extends DisplayObject>(...child: T[]): T
Type Parameters
- T extends DisplayObject
Parameters
- ...child: T[]
Returns T
Inherited from PIXI.Container.removeChild
- Defined in global.d.ts:125

removeChildAt

removeChildAt(index: number): DisplayObject
Parameters
- index: number
Returns DisplayObject
Inherited from PIXI.Container.removeChildAt
- Defined in global.d.ts:126

removeChildren

removeChildren(beginIndex?: number, endIndex?: number): DisplayObject[]
Parameters
- OptionalbeginIndex: number
- OptionalendIndex: number
Returns DisplayObject[]
Inherited from PIXI.Container.removeChildren
- Defined in global.d.ts:127

removeListener

removeListener(event: string, fn?: EventListener): this
Parameters
- event: string
- Optionalfn: EventListener
Returns this
Inherited from PIXI.Container.removeListener
- Defined in global.d.ts:106

removeScrollItems

removeScrollItems(
indexOrContainer: number | ScrollChild | (number | ScrollChild)[],
destroyItem?: boolean,
): boolean
Parameters
- indexOrContainer: number | ScrollChild | (number | ScrollChild)[]
- destroyItem: boolean = true
Returns boolean
- Defined in Components/ScrollList/ScrollList.ts:592

resize

resize(w: number, h: number): void
Parameters
- w: number
- h: number
Returns void
- Defined in Components/ScrollList/ScrollList.ts:349

setChildIndex

setChildIndex(child: DisplayObject, index: number): void
Parameters
- child: DisplayObject
- index: number
Returns void
Inherited from PIXI.Container.setChildIndex
- Defined in global.d.ts:129

setScrollPercent

setScrollPercent(n: number): void
Parameters
- n: number
Returns void
- Defined in Components/ScrollList/ScrollList.ts:316

sortChildren

sortChildren(): void
Returns void
Inherited from PIXI.Container.sortChildren
- Defined in global.d.ts:132

spliceScrollItems

spliceScrollItems(
    fromIndex: number,
    toIndex?: number,
    destroyItem?: boolean,
): void
Parameters
- fromIndex: number
- OptionaltoIndex: number
- destroyItem: boolean = true
Returns void
- Defined in Components/ScrollList/ScrollList.ts:583

swapChildren

swapChildren(a: DisplayObject, b: DisplayObject): void
Parameters
- a: DisplayObject
- b: DisplayObject
Returns void
Inherited from PIXI.Container.swapChildren
- Defined in global.d.ts:131

toggleFreezeScroll

toggleFreezeScroll(freeze: boolean): void
Parameters
- freeze: boolean
Returns void
- Defined in Components/ScrollList/ScrollList.ts:335

toGlobal

toGlobal(position: { x: number; y: number }, point?: Point): Point
Parameters
- position: { x: number; y: number }
- Optionalpoint: Point
Returns Point
Inherited from PIXI.Container.toGlobal
- Defined in global.d.ts:111

toLocal

toLocal(
    position: { x: number; y: number },
    from?: DisplayObject,
    point?: Point,
): Point
Parameters
- position: { x: number; y: number }
- Optionalfrom: DisplayObject
- Optionalpoint: Point
Returns Point
Inherited from PIXI.Container.toLocal
- Defined in global.d.ts:112

unfreeze

unfreeze(): void
Returns void
- Defined in Components/ScrollList/ScrollList.ts:332

Class ScrollList

Example

Hierarchy

Index

Constructors

Properties

Accessors

Methods

Constructors

constructor

Parameters

Returns ScrollList

Properties

alpha

angle

buttonMode

children

cursor

Optionaldestroyed

eventMode

freezeScroll

height

hitArea

interactive

interactiveChildren

mask

maxHeight

parent

ReadonlyperformanceOptions

pivot

position

renderable

rotation

scale

sortableChildren

visible

width

worldTransform

x

y

Accessors

currentScroll

Returns number

Parameters

Returns void

scrollPercent

Returns number

utilizedLength

Returns number

Methods

addChild

Type Parameters

Parameters

Returns T

addChildAt

Type Parameters

Parameters

Returns T

addListener

Parameters

Returns this

addScrollItem

Parameters

Returns void

addScrollItems

Parameters

Returns void

destroy

Parameters

Returns void

emit

Parameters

Returns boolean

freeze

Returns void

getBounds

Parameters

Returns Rectangle

getChildAt

Parameters

`Optional`destroyed

`Readonly`performanceOptions