Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to split UIView into equal parts using autolayout?

I am struggling with finding a logical rule or a constraint that would allow me to split the contents of UIView to equal parts.

To be more concrete, imagine a UIView with initial width of 300pt. Then let's place three subviews and set them up so that each will effectively have a width of 100 and origin.x will be 0, 100 and 200. One subview will constitute a third of superview. If I the resize the superview, all three subviews will get wider horizontally but they will keep equal size.

Any help?

like image 381
Earl Grey Avatar asked Apr 03 '14 08:04

Earl Grey


1 Answers

  1. Place your view.
  2. Place and position your three subviews with each taking one third of the width.
  3. Select all three subviews by holding cmd and clicking on each.
  4. Go Editor > Pin > Widths Equally

Make sure you set constraints for subview x and y position. In your case, you'd pin leading space of the most left subview to superview, and trailing space of your most right subview to superview ( Editor > Pin > Leading/Trailing space to superview) and vertical spacing depending on your case.

like image 134
Mercurial Avatar answered Nov 02 '22 23:11

Mercurial