레이아웃
이 페이지는 문서 버전에 해당하는 project.v1.schema.json에서 자동 생성되며, 필드 설명은 원문(영어) 그대로입니다. 스키마는 형태만 검사합니다. 범위, 한도, 참조, 키프레임 순서는 엔진 검증 단계에서 검사합니다.
AlignContent
Where the lines of a wrapping flex container, or a grid's rows, lie across the container.
"start"Packed at the start."center"Packed in the middle."end"Packed at the end."space_between"The first at the start, the last at the end, equal space between."space_around"Equal space around each."space_evenly"Equal space between each and at both ends."stretch"Grown to fill the container.
AlignItems
Where children lie across a flex container's main axis, or in their grid areas.
"start"At the start."center"In the middle."end"At the end."stretch"Across the whole line or area.
Display
How a box lays its children out.
"flex"CSS flexbox."grid"CSS grid.
FlexDirection
The main axis of a flex container.
"row"Left to right."column"Top to bottom."row_reverse"Right to left."column_reverse"Bottom to top.
FlexWrap
Whether a flex container's children wrap.
"nowrap"One line."wrap"As many lines as the children need.
GridAutoFlow
How a grid places items that have no placement of their own.
"row"Filling each row, adding rows."column"Filling each column, adding columns."row_dense"Asrow, filling earlier holes."column_dense"Ascolumn, filling earlier holes.
GridPlacement
Where a grid item lies on one axis, as CSS writes it: 2, "1 / 3", "span 2", "2 / span 3", "auto". Lines count from 1, or from -1 at the end.
One of:
integer
string
Insets
A length on each side of a box: one length for every side, the CSS shorthand of one to four lengths ("8px 16px": top first, clockwise), or the sides object, missing sides 0.
One of:
number <span class="a2-muted">(float)</span>
string
object
| Field | Type | Description |
|---|---|---|
bottom | LayoutSize | |
left | LayoutSize | |
right | LayoutSize | |
top | LayoutSize |
JustifyContent
Where children lie along a container's main axis, or a grid's columns in it.
"start"Packed at the start."center"Packed in the middle."end"Packed at the end."space_between"The first at the start, the last at the end, equal space between."space_around"Equal space around each."space_evenly"Equal space between each and at both ends.
LayoutBorder
A border inside the border box, as wide on every side.
| Field | Type | Description |
|---|---|---|
paintrequired | Animated_Paint | What covers the border. Positions are normalized to the border box. |
widthrequired | Animated_LayoutSize | Width. At least 0. |
LayoutInset
Where an absolute box lies in its parent's padding box. A missing side is auto; with neither left nor right, the box keeps its flow position on that axis.
| Field | Type | Description |
|---|---|---|
bottom | Animated_LayoutLength | null | Distance from the parent's bottom padding edge. |
left | Animated_LayoutLength | null | Distance from the parent's left padding edge. |
right | Animated_LayoutLength | null | Distance from the parent's right padding edge. |
top | Animated_LayoutLength | null | Distance from the parent's top padding edge. |
LayoutLength
A length: a number is a fraction of the layout picture's shorter side, "<n>px" pixels of the project canvas, "<n>%" a percent of the parent's content box along the field's axis.
One of:
number <span class="a2-muted">(float)</span>
string
LayoutNode
One box of a layout tree.
A box lays its children out by flexbox (the default) or grid. It is a container with children, a leaf with text or shape content, and empty otherwise (a spacer or decoration). Each box draws background, then border, then content. Boxes draw in document order; reversed directions and grid placement move them but do not change paint order.
| Field | Type | Description |
|---|---|---|
align_content | AlignContent | null | Where lines of a wrapping flex container, or a grid's rows, lie across the container. Default |
align_items | AlignItems | null | Where children lie across the main axis, or in their grid areas' rows. Default |
align_self | AlignItems | null | Where the box lies across its flex container's main axis, or in its grid area's row. |
aspect_ratio | number | null | Width over height. Positive. |
background | Animated_Paint | null | What covers the border box, rounded by |
border | LayoutBorder | null | A border inside the border box. |
border_radius | Animated_LayoutSize | null | The corner radius of the border box. At least 0; default 0. Capped at half the box's shorter side. |
children | LayoutNode[] | Boxes laid out in this one, in document (and paint) order. Not with |
column_gap | Animated_LayoutSize | null | Space between columns, in place of |
display | Display | null | How the box lays its children out. Default |
fill | Paint | null | What paints the text's glyphs, as a text style's |
flex_basis | Animated_LayoutLength | null | The main size before growing and shrinking. |
flex_direction | FlexDirection | null | The main axis of a flex container's children. Default |
flex_grow | Animated_float | null | How much of a flex container's free space the box takes. At least 0; default 0. Like every flex item field, not in a grid. |
flex_shrink | Animated_float | null | How much the box gives up when a flex container's space runs short. At least 0; default 1. |
flex_wrap | FlexWrap | null | Whether a flex container's children wrap onto more lines. Default |
font_family | string | null | The family the box's text draws in, as a text style's |
font_size | Animated_LayoutSize | null | Font size: positive, at most |
font_weight | integer | null | The weight in |
gap | Animated_LayoutSize | null | Space between children, on both axes. At least 0; default 0. |
grid_auto_columns | TrackList | null | The size of a grid's implicit columns. Default |
grid_auto_flow | GridAutoFlow | null | How a grid places items without a placement. Default |
grid_auto_rows | TrackList | null | The size of a grid's implicit rows. Default |
grid_column | GridPlacement | null | The box's columns in its grid, as CSS writes them ( |
grid_row | GridPlacement | null | The box's rows in its grid. Default |
grid_template_columns | TrackList | null | A grid's explicit columns, as CSS writes them ( |
grid_template_rows | TrackList | null | A grid's explicit rows. Default none. |
height | Animated_LayoutLength | null | Border-box height. |
inset | LayoutInset | null | Where an |
justify_content | JustifyContent | null | Where children lie along the main (for a grid, inline) axis. Default |
justify_items | AlignItems | null | Where a grid's children lie in their grid areas' columns. Default |
justify_self | AlignItems | null | Where the box lies in its grid area's column. |
letter_spacing | number | null | Space after each character, as a fraction of the font size, in |
line_height | number | null | Baseline-to-baseline distance in font sizes, in |
margin | Animated_Insets | null | Space outside the border, written as |
max_height | Animated_LayoutLength | null | Largest height. |
max_width | Animated_LayoutLength | null | Largest width. |
min_height | Animated_LayoutLength | null | Smallest height. |
min_width | Animated_LayoutLength | null | Smallest width. |
opacity | Animated_float | null | Opacity of the box and everything in it as one group, in |
overflow | Overflow | null | Whether content past the padding box is drawn. Default |
padding | Animated_Insets | null | Space inside the border: a length, the CSS shorthand ( |
position | Position | null | Whether the box is in its parent's flow. Default |
rotation_degrees | Animated_float | null | Clockwise rotation of the box and everything in it about its border-box centre, in degrees, after layout. |
row_gap | Animated_LayoutSize | null | Space between rows (or lines of a wrapping row flex container), in place of |
scale | Animated_Vec2 | null | Per-axis scale of the box and everything in it about its border-box centre, after layout. |
shadows | array | null | Shadows of the glyphs and strokes, as a text style's |
shape | LayoutShape | null | Shapes drawn on a picture the size of the box's content box. Not with |
strokes | array | null | Bands around the glyphs, as a text style's |
text | Animated_string | null | The box's text, wrapped at its content width in the inherited style; |
text_align | TextAlign | null | How lines align within the content width. Inherited; the root's is |
text_animators | TextAnimator[] | Per-character motion of the box's own text, Range selectors only (layout text has no runs). At most |
translate | Animated_LayoutOffset | null | Offset of the box and everything in it after layout: the object, or one or two lengths as CSS |
width | Animated_LayoutLength | null | Border-box width. |
LayoutOffset
An offset, x right and y down: one or two lengths as CSS translate writes them (y 0 when missing), or {x, y}.
LayoutShape
A box's shapes, drawn as a shapes generator draws its items on a picture the size of the box's content box. A shape box has no size of its own.
| Field | Type | Description |
|---|---|---|
itemsrequired | ShapeItem[] | The content tree, front first. |
LayoutSize
A length that may not be a percent: a number is a fraction of the layout picture's shorter side, "<n>px" pixels of the project canvas.
One of:
number <span class="a2-muted">(float)</span>
string
Overflow
Whether content past a box's padding box is drawn.
"visible"Drawn."hidden"Clipped to the padding box.
