SimulatedViewport
import { SimulatedViewport } from 'pixi-silk/ui/layout';Previews a window size inside a desktop page: a device of that size, scaled down to fit an area
(letterboxed), with a bezel and a mask. Add SmartContainers to SimulatedViewport.content
and pass the simulator itself as their viewport: it is a signal of the device’s window, so
they lay out as they would on that device.
Extends#
Container
Constructors#
Constructor#
new SimulatedViewport(options: SimulatedViewportOptions): SimulatedViewport;Parameters#
| Parameter | Type |
|---|---|
options | SimulatedViewportOptions |
Returns#
SimulatedViewport
Overrides#
Container.constructorProperties#
| Property | Modifier | Type | Description | Defined in |
|---|---|---|---|---|
content | readonly | Container | Put your SmartContainers here. It is the device screen, in device pixels. | ui/layout/simulate.ts:35 |
Accessors#
deviceScale#
Get Signature#
get deviceScale(): number;The scale the device is shown at, at most 1.
Returns
number
value#
Get Signature#
get value(): Required<ViewportRect>;The simulated window, in device pixels, at (0, 0). SmartContainers read it as a viewport source. The same object on every read.
Returns
Required<ViewportRect>
Methods#
setArea()#
setArea(area: ViewportRect): this;Shows the device in another area, in the parent’s space. Subscribers are not notified: the window size is the same.
Parameters#
| Parameter | Type |
|---|---|
area | ViewportRect |
Returns#
this
setDevice()#
setDevice(device: string | readonly [number, number]): this;Simulates another window size and notifies subscribers. Throws on an unknown device name.
Parameters#
| Parameter | Type |
|---|---|
device | string | readonly [number, number] |
Returns#
this
subscribe()#
subscribe(fn: () => void): () => void;Calls fn when the device changes. Returns the unsubscribe function.
Parameters#
| Parameter | Type |
|---|---|
fn | () => void |
Returns#
() => void