LittleJS Drawing Utilities Plugin
- Extra drawing functions for LittleJS
- Nine slice and three slice drawing
- Source
Methods
(static) drawNineSlice(pos, size, startTile, coloropt, borderSizeopt, additiveColoropt, extraSpaceopt, angleopt, useWebGLopt, screenSpaceopt, contextopt)
Draw a scalable nine-slice UI element in world space This function can apply color and additive color if WebGL is enabled
| Name | Type | Attributes | Default | Description |
|---|---|---|---|---|
pos | Vector2 | World space position | ||
size | Vector2 | World space size | ||
startTile | TileInfo | Starting tile for the nine-slice pattern | ||
color | Color | <optional> | Color to modulate with | |
borderSize | number | <optional> | 1 | Width of the border sections |
additiveColor | Color | <optional> | Additive color | |
extraSpace | number | <optional> | 0.05 | Extra spacing adjustment |
angle | number | <optional> | 0 | Angle to rotate by |
useWebGL | boolean | <optional> | glEnable | Use WebGL for rendering |
screenSpace | boolean | <optional> | Use screen space coordinates | |
context | CanvasRenderingContext2D | <optional> | Canvas context to use |
- Source
(static) drawNineSliceScreen(pos, size, startTile, borderSizeopt, extraSpaceopt, angleopt)
Draw a scalable nine-slice UI element to the overlay canvas in screen space This function can not apply color because it draws using the overlay 2d context
| Name | Type | Attributes | Default | Description |
|---|---|---|---|---|
pos | Vector2 | Screen space position | ||
size | Vector2 | Screen space size | ||
startTile | TileInfo | Starting tile for the nine-slice pattern | ||
borderSize | number | <optional> | 32 | Width of the border sections |
extraSpace | number | <optional> | 2 | Extra spacing adjustment |
angle | number | <optional> | 0 | Angle to rotate by |
- Source
(static) drawThreeSlice(pos, size, startTile, coloropt, borderSizeopt, additiveColoropt, extraSpaceopt, angleopt, useWebGLopt, screenSpaceopt, contextopt)
Draw a scalable three-slice UI element in world space This function can apply color and additive color if WebGL is enabled
| Name | Type | Attributes | Default | Description |
|---|---|---|---|---|
pos | Vector2 | World space position | ||
size | Vector2 | World space size | ||
startTile | TileInfo | Starting tile for the three-slice pattern | ||
color | Color | <optional> | Color to modulate with | |
borderSize | number | <optional> | 1 | Width of the border sections |
additiveColor | Color | <optional> | Additive color | |
extraSpace | number | <optional> | 0.05 | Extra spacing adjustment |
angle | number | <optional> | 0 | Angle to rotate by |
useWebGL | boolean | <optional> | glEnable | Use WebGL for rendering |
screenSpace | boolean | <optional> | Use screen space coordinates | |
context | CanvasRenderingContext2D | <optional> | Canvas context to use |
- Source
(static) drawThreeSliceScreen(pos, size, startTile, borderSizeopt, extraSpaceopt, angleopt)
Draw a scalable three-slice UI element to the overlay canvas in screen space This function can not apply color because it draws using the overlay 2d context
| Name | Type | Attributes | Default | Description |
|---|---|---|---|---|
pos | Vector2 | Screen space position | ||
size | Vector2 | Screen space size | ||
startTile | TileInfo | Starting tile for the three-slice pattern | ||
borderSize | number | <optional> | 32 | Width of the border sections |
extraSpace | number | <optional> | 2 | Extra spacing adjustment |
angle | number | <optional> | 0 | Angle to rotate by |
- Source