Auto Layout Item Overrides

When a layer sits inside an auto layout container, you can override its behavior without breaking the parent container.

Standard Item Controls

  • Select the child layer inside an auto layout container.
  • In Auto Layout Item, choose Main Size and Cross Size modes.
  • Use Align Self to override the container’s cross-axis alignment.
  • In grid flow, set per-item Row/Column span to control cell occupation.

Absolute Items

  • Toggle Absolute Position to opt out of normal stack placement while staying inside the container.
  • Absolute items keep their own transform and can use resize constraints:
    • Horizontal: left, right, center, stretch, scale
    • Vertical: top, bottom, center, stretch, scale
  • By default, absolute children do not contribute to parent hug size.

Tip: Absolute items stay mounted in the frame and keep responding to parent resize rules. The canvas shows an Absolute badge when the selected item is opted out of stack flow. The Layers panel shows the same Absolute label for opted-out Auto Layout children. Note: When the parent is a component instance, item-level auto layout controls are read-only.

Direct-Child Constraints

Direct children can also carry min/max size constraints through the Auto Layout Item panel, saved data, imports, or programmatic updates.

  • Packed layouts respect child min/max when cross-axis stretch is active.
  • Fill layouts clamp the final resolved size through the child’s own min/max.
  • Wrapped layouts use the clamped size before grouping children into tracks.

Visibility

Hidden layers do not participate in auto layout flow or hug sizing. Show the layer again to re-enter the layout.

Canvas Drag Reorder

You can reorder auto layout items directly on the canvas:

  • Drag an item inside or into an auto layout container.
  • The candidate drop position shows a blue insertion line during drag.
  • Release the pointer to commit the new order.
  • If the drop does not cross a reorder threshold, the item snaps back to its current slot.
  • Drag a child fully outside its current auto layout frame to detach it back onto the canvas as a regular outside object.
  • Drag an outside object over an auto layout container to insert it into the stack at the highlighted position.

Hold Shift while dragging to temporarily move the item as absolute during the drag gesture.