Constraints exist to indicate how the inner layers will react to changes in the size of the outer layers.

1. This block schematically displays the selected parameters. By default, Left and Top are selected
2. Horizontal constraints, denote the behavior of the element along the X-axis
3. Vertical constraints, denote the behavior of the element along the Y-axis

‍

Horizontal  

‍

Left - saves the position of the layer relative to the left side of the outer frame

‍

Right - saves the position of the layer relative to the right side of the outer frame

‍

Left & Right - saves the position of the layer relative to both the right and left sides. This means that when changing the outer frame, the inner layer will stretch in width, “sticking” to the left and right sides.

‍

Center - maintains the position of the layer relative to the horizontal center of the outer frame.

‍

Vertical

‍

Top - keeps the position of the layer relative to the top side of the outer frame.

‍

Bottom - keeps the position of the layer relative to the bottom side of the outer frame.

‍

Top & Bottom - saves the position of the layer relative to both the top and left sides of the outer frame. This means that when the outer frame changes, the inner one will stretch in height, “pulling” to the top and bottom sides.

‍

Center - saves the position of the layer relative to the vertical center of the outer frame.

‍

You can apply Constraints to any layer. If you apply Constraints to an outer frame, when you add it inside another frame, all constraints will be preserved.

‍