SwatchPopup

import { SwatchPopup } from 'pixi-silk/ui/color';

A ring of swatches that pops up around a point, for quick colour changes mid-stroke. Press, drag towards a colour and release, or tap to keep it open and tap a colour. The centre shows the colour under the pointer and cancels. Picks by angle, like the radial menu. It starts closed: add it to the stage, then call SwatchPopup.openAt.

Extends#

Container

Constructors#

Constructor#

new SwatchPopup(options?: SwatchPopupOptions): SwatchPopup;

Parameters#

Parameter	Type
`options`	`SwatchPopupOptions`

Returns#

SwatchPopup

Overrides#

Container.constructor

Properties#

Property	Modifier	Type	Description	Defined in
`hovered`	`readonly`	`Signal`<`number`>	Index of the colour under the pointer, or -1.	ui/color/SwatchPopup.ts:44
`model`	`readonly`	`ColorModel`	The colour this popup writes to.	ui/color/SwatchPopup.ts:40
`open`	`readonly`	`Signal`<`boolean`>	True while open.	ui/color/SwatchPopup.ts:42

Methods#

close()#

close(): void;

Closes without picking. Does nothing when closed.

Returns#

void

openAt()#

openAt(
   x: number, 
   y: number, 
   event?: SwatchPointer
): void;

Opens centred on (x, y) in the parent’s coordinates and moves to the top of the parent. Pass the pointer event that opened it so a press-drag-release picks in one gesture.

Parameters#

Parameter	Type
`x`	`number`
`y`	`number`
`event?`	`SwatchPointer`

Returns#

void

pointerAt()#

pointerAt(x: number, y: number): void;

Steers the popup with a point in its own coordinates (centre at 0, 0). Pointer events call this. Call it yourself for gamepads or tests.

Parameters#

Parameter	Type
`x`	`number`
`y`	`number`

Returns#

void

tick()#

tick(dt: number): boolean;

Advances the animation by dt seconds (only needed with ticker: null). Returns true while moving.

Parameters#

Parameter	Type
`dt`	`number`

Returns#

boolean