Frame elements

Frame related elements together and manipulate them as a single element

By framing your elements, you can:

• Move your elements around as one and add animation effect to the entire frame, eliminating the need for repetitive adjustments.

• Simplify editing and formatting tasks by treating grouped as a cohesive unit (for example: if you want to apply a background to a frame).

• Maintain design consistency by keeping related elements together.

How to frame elements

Steps:

1. Click an element that you want to be in the frame.

2. Hold down the Shift key and select the other elements you want to include.

3. Select the Frame selection button.

Protip: After selecting the elements, use the keyboard shortcuts Ctrl + Shift + F (Windows) or Command + Shift + F (Mac) to frame elements even faster.

A group can be moved, resized, rotated, and animated as a single unit.

You can apply constraints between the elements included in the frame with the frame container.

Frame sizes are set independently from their child elements. If you reposition or scale the child elements inside a frame, its bounds will not auto-adjust.

How to remove an element from a frame

If you no longer want your element to behave as one component, you can easily remove it from the frame.

Steps:

1. Click the element you want to ungroup as a frame.

2. Drag and drop it outside the frame container.

Nested frames within other frames

In FoxStudio, you can create frames within other frames by nesting them. This allows you to combine frames with different properties to build complex designs.

FAQ

How do I add an element to an existing frame?

1. Click the frame.

2. Hold down the Shift key on your keyboard and click the additional element.

3. Click Frame selection.