storyboard constraints (Xcode)

Question

I'm new to programming and I'm trying to work with Xcode. I have no experience. I'm trying to make an app with Xcode. I'm done with the code, the only issue i have is with the storyboard constraints. I need some one who can help me to set them up.

So, i have 28 buttons as you can see in the picture, I want to keep the size of 65x65 pixels. that means that the distance between them should vary in different device sizes(4inch, 4.7inch and 5.5inch). i also should mention that i want it to be only in portrait view and only for iPhone.i hope someone can help because I'm to noob for this, I've searched a lot on the internet but I'm not able to do it.

Answer 1

UIStackView (iOS 9+)

UIStackView was introduced in iOS 9, which is very useful in your case.

Edit : Before getting started, make sure to have size classes to be w Any, h Any , this will make thing easier.

1. To use this, search UIStackView in your utility panel.

2. Drag an drop a Vertical Stack View on the view of your view controller and set the constraints so it spans the whole screen.

3. Select the stack view we just placed and set the distribution to Fill Equally .

4. Drag and drop a Horizontal Stack View onto the vertical one.
5. Select the horizontal one and set the distribution to Fill Equally .
6. Place your buttons in the Horizontal Stack View .

7. Copy and paste the horizontal stack view multiple times based on number of rows you want.

That's it.

You can control the buttons' background images to make it smaller (65px), or you can place a view as its' parent then align horizontally/vertically to place it to the center, like this:

Orientation

If you'd like to lock the orientation throughout the app, go to the settings of your project.

Sample project

I made a sample project for this question, you can check it out here: https://github.com/cyhsutw/UIStackView-example