0

enter image description here Hi, Why is this come out this way on iPad 2 air?? I followed this.

I want the white placeholders to be smaller in width.

eChung00
  • 633
  • 1
  • 12
  • 27

1 Answers1

1

If you want all views to be equally spaced, use horizontal UIStackView and set the spacing property to equal.

Or if you want to manually do this via constraints, you have to have to set your views' width proportional to the device/superView's width.

For example, if your iPhone/iPad width is 320, if you want 4 views to be equally spaced, divide the screen width by the number of views while setting equal width constraint to the views:

320 / 4 = 80 (Width of each view)

Do the below steps for all your required views/buttons: (I am using buttons for example purpose)

This is where we begin:

Beginning

Step1:
Set Top and Leading constraints of your Button1 to its superview like this: Top and Leading Constraints

Step 2:

Make your button Equal Width and Equal Height of its superview.

Make button equal width and height of its superview

Step 3:

Now your button would apparently be of same size as your super view. Here comes the fun and easy part. Make your button's width 1/4th (If you have 6 views that needs to be equally spaced, make it 1/6) of your superview's width by editing the constraint.

Set width multiplier to 1/4

Step 4:

Apply constraints from previous steps to all the views/buttons and update frames to see the change.

Final output

These are the constraints for the first button for your reference:

Total constraints for the button

badhanganesh
  • 3,427
  • 3
  • 18
  • 39
  • First, i have tried it with stackview but I could not adjust its height and other values sometimes on storyboard. I do not know why. And it stretched too much on bigger device. – eChung00 May 25 '17 at 13:19
  • I will check this tonight... your way of doing it seems interesting. It makes sense but I could not think of it lol... I have one more question. Is there a way to make its height proportional to its width? I have tried this with stackview and on the bigger size device, the icons stretched too much. I am not sure if your method handles it. – eChung00 May 25 '17 at 20:32
  • There is no way of making height proportional to width via constraints in IB as such. But there is a possibility to do that using custom `NSLayoutConstraint` subclass with `@IBInspectable` property. – badhanganesh May 25 '17 at 20:42