레이아웃

이 페이지는 문서 버전에 해당하는 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" As row, filling earlier holes.
• "column_dense" As column, 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 place in the flow 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 (display: flex, the default) or grid (display: grid). It is a container when it has children, a leaf when it has text or shape content, and empty otherwise (a spacer or a decoration). Per box, its background is drawn first, then its border, then its content. Boxes are drawn in document order; a reversed direction or a grid placement moves them, not their 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 stretch.
align_items	AlignItems | null	Where children lie across the main axis, or in their grid areas' rows. Default stretch.
align_self	AlignItems | null	Where the box lies across its flex container's main axis, or in its grid area's row. None follows the parent's align_items.
aspect_ratio	number | null	Width over height. Positive.
background	Animated_Paint | null	What covers the border box, rounded by border_radius. Positions are normalized to the border box.
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. A radius past half the box's shorter side is capped.
children	LayoutNode[]	Boxes laid out in this one, in document (and paint) order. Not with text or shape.
color	Rgba | null	Text color. Inherited; the root's is white.
column_gap	Animated_LayoutSize | null	Space between columns, in place of gap. At least 0.
display	Display | null	How the box lays its children out. Default flex. Not on a box with text or shape content, as every container field.
flex_basis	Animated_LayoutLength | null	The main size before growing and shrinking. None is auto.
flex_direction	FlexDirection | null	The main axis of a flex container's children. Default row.
flex_grow	Animated_float | null	How much of a flex container's free space the box takes. At least 0; default 0. Not in a grid, as every flex item field.
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 nowrap.
font_family	string | null	The family the box's text draws in, as a text style's font_family. Inherited; the root's is the host's first font.
font_size	Animated_LayoutSize | null	Font size: positive, at most MAX_LAYOUT_FONT_SIZE of the picture's shorter side. Inherited; the root's is 0.05.
font_weight	integer | null	The weight, in [1, 1000], the family's faces are matched by, as CSS Fonts 4 matches font-weight; a variable face draws at it. Not animated. Inherited; the root's is 400.
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 auto.
grid_auto_flow	GridAutoFlow | null	How a grid places items without a placement. Default row.
grid_auto_rows	TrackList | null	The size of a grid's implicit rows. Default auto.
grid_column	GridPlacement | null	The box's columns in its grid, as CSS writes them (2, "1 / 3", "span 2"). Default auto.
grid_row	GridPlacement | null	The box's rows in its grid. Default auto.
grid_template_columns	TrackList | null	A grid's explicit columns, as CSS writes them ("1fr 2fr", "repeat(3, minmax(100px, 1fr))"). Default none.
grid_template_rows	TrackList | null	A grid's explicit rows. Default none.
height	Animated_LayoutLength | null	Border-box height. None is auto.
inset	LayoutInset | null	Where an absolute box lies in its parent's padding box.
justify_content	JustifyContent | null	Where children lie along the main (inline, for a grid) axis. Default start.
justify_items	AlignItems | null	Where a grid's children lie in their grid areas' columns. Default stretch.
justify_self	AlignItems | null	Where the box lies in its grid area's column. None follows the parent's justify_items. Not in a flex container, as every grid item field.
letter_spacing	number | null	Space after each character, as a fraction of the font size, in [-0.5, 1], as CSS letter-spacing adds it: none after a line's last character, and none after a character of a cursive script. Not animated. Inherited; the root's is 0.
line_height	number | null	Baseline-to-baseline distance in font sizes, in [0.5, 3]. Each line's em box, 0.8 of a font size above its baseline and 0.2 below, is centred in its line when the line is taller than an em. Inherited; the root's is 1.2.
margin	Animated_Insets | null	Space outside the border, written as padding is. Sides may be negative; there is no auto.
max_height	Animated_LayoutLength | null	Largest height. None is none.
max_width	Animated_LayoutLength | null	Largest width. None is none.
min_height	Animated_LayoutLength | null	Smallest height. None is auto.
min_width	Animated_LayoutLength | null	Smallest width. None is auto, the CSS automatic minimum size.
opacity	Animated_float | null	Opacity of the box and everything in it, as one group, in 0..=1. Drawn after layout; it never moves a box.
outline	TextOutline | null	A band around the glyphs; its width a fraction of the font size. Inherited; the root has none.
overflow	Overflow | null	Whether content past the padding box is drawn. Default visible.
padding	Animated_Insets | null	Space inside the border: a length, the CSS shorthand ("8px 16px"), or the sides object. Sides at least 0; default 0.
position	Position | null	Whether the box is in its parent's flow. Default relative.
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 (between lines of a wrapping row flex container), in place of gap. At least 0.
scale	Animated_Vec2 | null	Per-axis scale of the box and everything in it about its border-box centre, after layout.
shape	LayoutShape | null	Shapes drawn on a picture the size of the box's content box. Not with children or text.
text	Animated_string | null	The box's text, wrapped at its content width and drawn in the style it inherits; \n starts a line. At most MAX_TEXT_CONTENT_BYTES bytes per value; may be empty. Its keyframes all hold. Not with children or shape.
text_align	TextAlign | null	How lines align within the content width. Inherited; the root's is start.
translate	Animated_LayoutOffset | null	Offset of the box and everything in it, after layout: the object, or one or two lengths as CSS translate writes them.
width	Animated_LayoutLength | null	Border-box width. None is auto. Not on the root, as every item field.

LayoutOffset

An offset, x right and y down: one or two lengths as CSS translate writes them (y 0 when missing), or {x, y}.

One of:

string

object

Field	Type	Description
xrequired	LayoutSize
yrequired	LayoutSize

LayoutShape

A box's shapes, drawn as a shapes generator draws its items on a picture the size of the box's content box: positions normalized to that box, lengths fractions of its shorter side. 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.