Resizing Constraints

You can define the resizing behavior of a shape using the resizing constraints in the Inspector:

These constraints define the relationship between a shape and its frame. There are six constraints: left, right, top, bottom, width and height.

When defining the relationship between shape and its frame, horizontal constraints (left, width, right) are entirely independent from vertical constraints (top, height, bottom). For clarity, we will only describe the behavior of horizontal constraints.

Each constraint can be either rigid or flexible.

The left constraint represents the distance between the left side of the shape and the left side of the enclosing frame. When the left constraint is rigid, PaintCode will make sure that no matter how you resize the frame, the left side of the shape will maintain a constant distance from the left side of the frame. When the left constraint is flexible, PaintCode will try to make the corresponding distance as large as possible, respecting the other two (width, right) constraints.

Width and right constraints work similarly. With specific combinations of rigid/flexible constraints, you can achieve a wide variety of useful behaviors.

Centering a fixed-width shape

Making the shape resize proportionally

Shape with a constant margin on both sides

Shape that sticks to the right

Shape that sticks to the left and resizes proportionally