Layout Object Layer Order

Intermediate

Control the stacking order of layout objects to achieve overlapping designs, tooltip effects, and interactive panels using Bring to Front, Send to Back, and grouping.

What you'll learn

  • How to control object layer order with Bring to Front/Send to Back
  • How overlapping fields and objects interact with click events
  • How to build overlay panels using layer order and Hide Object When
  • How groups and the Send Backward/Bring Forward commands work

Every layout object exists on a specific layer -- objects added later sit on top of earlier ones by default. Layer order determines which object is visible when objects overlap, which receives click events, and how designs with overlapping panels and popovers render. Mastering layer order lets you build sophisticated overlay UI without additional layouts.

1/4
1

Layer order commands

The Arrange menu (in Layout mode) provides four commands for layer control. Bring to Front and Send to Back move an object to the absolute top or bottom. Bring Forward and Send Backward move it one position relative to adjacent objects.

TEXT
// Layer order commands (Layout mode -> Arrange menu):
// Bring to Front      -- moves object to the topmost layer
// Bring Forward       -- moves object one layer up
// Send Backward       -- moves object one layer down
// Send to Back        -- moves object to the bottommost layer

// Keyboard shortcuts (Mac):
// Cmd+Shift+F  = Bring to Front
// Cmd+F        = Bring Forward
// Cmd+Shift+B  = Send to Back
// Cmd+B        = Send Backward
Object Naming StrategyMerge Fields vs. Field Objects

Sign in to track your progress and pick up where you left off.

Sign in to FM Dojo