RayWenderlich.com Layout in IOS Course - Part 6

Here we go! The final chapter. Possibly two entries but I may be able to do it in one. Then the Auto Layout is complete. As always I will do a consolidation entry. This chapter is all about constraints. 

Start time - 13:35

Intro

Attributes can be added - position, width and height

Some of this is implied e.g. if you give the leading (left) and trailing (right) edges, then the width is derived from those

Formulas are used to work out the position, width and height.

Top and bottom

Layout guide - keeps tab bars etc. separate.

Stack views are usually the best way to set up views but constraints still needed.


Add New Constraints

So some cool shortcuts - add multiple heights/weights in one go. Do the whole make same height feature, based on one constraint already in.

Minimum font scales - great if text is too big, then it will work on multiple devices.

Drag Constraints

Ok, so selecting options in the attributes - in this case centre horizontally and vertically in container - do NOT count as the specific constraints - it changes the position though.

So something that has changed in recent Xcode is you CAN'T shift and click to then select constraint. You have to select options separately.

Challenge!

Here we go! I solved this by putting in the leading and trailing constraints of 0 on the super stack view.

Then I changed the priority hugging horizontally by 1, so that the the bottom two boxes were equally aligned.

Could have changed the attributes bit to fill equally but both ways work!

Edit Constraints

Not a huge amount here!

You can make them more advanced than the initial creation of them basically.

Troubleshooting

If the label box is too small for the text, that means the label does not match its intrinsic content size

Right the whole click and drag bit does work but with CONTROL (not shift!)

Conclusion

So lots of good stuff here and nothing too complex. Three parting tips -

1. Avoid fixed values for width and height - it makes so inflexible and hard to adapt
2. Use the highest level construct you can - use the stack view of most higher order!
3. Combine stack views with constraints - use nested views

A useful course in summary! Tomorrow I'll do a consolidation entry and am now looking at what course to go for next! Some of this was Swift UI and some UI Kit, so it was good to see in both.

Finish Time - 14:22 (approx 50 minutes)

Comments

Popular posts from this blog

*Xcode Project Entry 2* F1 Quiz - part 1

Angela Yu Course Part 10 (up to lesson 112)

Angela Yu Xcode 12 Course - Part 7 (lectures 74 to 79)