LayoutStyle
import type { LayoutStyle } from 'pixi-silk/layout';
The style of a layout node. Every property is optional and defaults to the CSS initial value.
Extended by#
Properties#
| Property | Type | Description | Defined in |
|---|---|---|---|
alignContent? | AlignContent | Line distribution of a wrapping container. Default stretch. | layout/style.ts:82 |
alignItems? | AlignItems | Cross axis alignment of the children. Default stretch. | layout/style.ts:76 |
alignSelf? | "auto" | AlignItems | Cross axis alignment of this node, over its parent’s alignItems. | layout/style.ts:78 |
aspectRatio? | number | Width divided by height. Sizes the missing axis when only one is known. | layout/style.ts:102 |
basis? | Length | Main size before growing or shrinking. Default auto (the width or height, else the content). | layout/style.ts:88 |
bottom? | Length | Distance from the parent’s bottom edge, for position: 'absolute'. | layout/style.ts:108 |
columnGap? | number | Space between columns. Overrides gap. | layout/style.ts:54 |
direction? | FlexDirection | Main axis. Default row. | layout/style.ts:46 |
display? | "none" | "flex" | none takes the node out of layout: it gets a zero box. Default flex. | layout/style.ts:42 |
gap? | number | Space between items and between lines, in pixels. Default 0. | layout/style.ts:50 |
grow? | number | Share of the free space this item takes. Default 0. | layout/style.ts:84 |
height? | Length | Border-box height. Default auto. | layout/style.ts:92 |
inset? | Length | Sets top, right, bottom and left at once. The single sides override it. | layout/style.ts:112 |
justifyContent? | JustifyContent | Main axis distribution of the free space. Default start. | layout/style.ts:80 |
left? | Length | Distance from the parent’s left edge, for position: 'absolute'. | layout/style.ts:110 |
margin? | Edges<Length> | Space outside the box. 'auto' takes up free space, which centres or pushes the item. | layout/style.ts:66 |
marginBottom? | Length | Bottom margin. Overrides margin. | layout/style.ts:72 |
marginLeft? | Length | Left margin. Overrides margin. | layout/style.ts:74 |
marginRight? | Length | Right margin. Overrides margin. | layout/style.ts:70 |
marginTop? | Length | Top margin. Overrides margin. | layout/style.ts:68 |
maxHeight? | Length | Largest height. Default none. | layout/style.ts:100 |
maxWidth? | Length | Largest width. Default none. | layout/style.ts:98 |
minHeight? | Length | Smallest height. Default 0. | layout/style.ts:96 |
minWidth? | Length | Smallest width. Default 0. | layout/style.ts:94 |
padding? | Edges<number | `${number}%`> | Space inside the box. Percents are of the parent’s width, as in CSS. | layout/style.ts:56 |
paddingBottom? | number | `${number}%` | Bottom padding. Overrides padding. | layout/style.ts:62 |
paddingLeft? | number | `${number}%` | Left padding. Overrides padding. | layout/style.ts:64 |
paddingRight? | number | `${number}%` | Right padding. Overrides padding. | layout/style.ts:60 |
paddingTop? | number | `${number}%` | Top padding. Overrides padding. | layout/style.ts:58 |
position? | "relative" | "absolute" | absolute places the node against its parent’s box with top, right, bottom and left. | layout/style.ts:44 |
right? | Length | Distance from the parent’s right edge, for position: 'absolute'. | layout/style.ts:106 |
rowGap? | number | Space between lines (rows). Overrides gap. | layout/style.ts:52 |
shrink? | number | Share of the overflow this item gives up, weighted by its basis. Default 1. | layout/style.ts:86 |
top? | Length | Distance from the parent’s top edge, for position: 'absolute'. | layout/style.ts:104 |
width? | Length | Border-box width. Default auto. | layout/style.ts:90 |
wrap? | "nowrap" | "wrap" | "wrap-reverse" | Break items into several lines when they overflow. Default nowrap. | layout/style.ts:48 |