"Another day wasted. Shouldn’t Auto Layout be... automatic? Why am I spending so much time on it yet the position of labels and images in my app still looks way off?"

"I don't feel it's normal at all to spend well over 6 hours just to get a simple UI to work!"

You picked up Swift and enjoyed learning it, you managed to put up a simple functional app after following tutorials, but when it comes to designing user interface, Auto Layout seems unreasonable to you.

You have spent countless hours trial and error setting constraint in Xcode hoping to make the layout work. Add constraint, run the app, tweak the value, run the app, add more constraint, run the app, deletes all constraints and start adding again....

When you finally got the layout working on your iPhone and think “That’s it!”, but then go to see it on another device ( eg: your friend's iPhone SE ), it all looks absolutely off. Those UILabels and images isn't even at the position they are supposed to be.

Months of coding work is getting thrown away as you can’t even get the user interface to behave as intended on different iPhones and iPads.

At this point it seems like it would be much easier if you just designed UI for every single iPhone and iPad by itself. Spending time fighting with Auto Layout doesn't feel worth it anymore.


red lines



“I’ve watched around 10 youtube tutorials and even read Apple documentation on Auto Layout but I still have no idea how Auto Layout works”

You have watched a bunch of Youtube video tutorials but when you open up Xcode and try it, you have no idea what you’re doing. Sometimes you managed to do the layout shown in the video, but when it comes to your own layout, you’re clueless. “I mean, on some UIViewControllers with a button and a label like in those tutorials, no problem at all. But for setups like these?

complex layout
How do I even?

When you ask for advice on internet forum, you get different conflicting advices. “Ditch the Interface Builder, do Auto Layout in code!”, “Use library like SnapKit!”, “Try UIStackViews!”. Which advice should you take? Should you spend extra time on learning third party library just to make the user interface work? (Answer: No, you don't need to learn extra third party library to make layout work)

What if you knew exactly what constraint to add for each element, and able to create user interface that render perfectly on any screen size?

What if you knew exactly which constraint to place for each element? You could save hours from trial and error-ing constraints. You’d know how to troubleshoot constraints whenever your layout looks off from their supposed position. You’d be confident that your app will look exactly like how you want it in all iPhones and iPads. You could finish the app that you have been working on for months, submit it to the App Store, and have a better resume for applying iOS developer positions..

Learn the fundamentals of Auto Layout and create working layout

The problem with Auto Layout is that winging it as you go along is not an option. With coding you often can trial and error until it works, so we are used to it. Auto Layout needs to be properly understood and applied systematically, you have to understand what every single constraint is doing, throwing them in at random until its ‘all blue’ is never going to work.

Making Sense of Auto Layout will explain the fundamentals of Auto Layout including how it decides an UI Element (UIView, UILabel etc) position and size, what problems do Auto Layout solve and why do Xcode shows you red lines and how to troubleshoot them.

What’s in the book?

Instead of showing you a specific complex layout to follow step by step, this book will break down and explain the fundamentals of Auto Layout and let you connect the dots before you start designing your own layout. This book will focus on doing Auto Layout using Interface Builder (Xcode GUI), but its core concept can be applied to doing it programmatically (using code) as well.

  • How User Interface is being designed prior to Auto Layout and why Auto Layout is introduced
  • How Auto Layout determine position and size of a UI Element by using constraints you defined
  • Why missing constraints (Red lines!) appear and how to solve them
  • Why conflicting constraints (Red lines, with numbers!) happen and how to solve them
  • What is intrinsic content size and the importance of it
  • Using Tableview for content with dynamic size
  • Using Scrollview for content with dynamic size
  • What is constraint priority and when to use it
  • What is content hugging and compression resistance
  • What is Stackview and how does it simplify constraints
  • Animating views with constraint

The Book + Case Studies

buy the book with case studies

  • The book in PDF format, 147 pages
  • 6 practice Xcode projects (Xcode 9.2+) to follow-along the chapters
  • Future updates on the book, if available
  • 2 case studies (Twitter Profile UI, Spotify's Now Playing UI)
  • Explanation of each constraints used for replicating the UI in the case studies, and also breakdown of components in the UI
  • Completed demo Xcode projects for the Spotify / Twitter UI


With the case studies, you'll learn how to breakdown complex UI in other apps into individual components and implement them methodically. You would be able to apply the Auto Layout concept you learned in the book into implementing real layout you saw in other apps.


Get the book + case studies for $39

Just the book

buy just the book

  • The book in PDF format, 147 pages
  • 6 practice Xcode projects (Xcode 9.2+) to follow-along the chapters
  • Future updates on the book, if available

Get the book for $29

Testimonial

“dude… wow… good job on this series! One of the best explanations I’ve read!” – Alex Kluew

Can I try a free sample?

Absolutely! Grab your free sample below and start Making Sense of Auto Layout today.

Understand Auto Layout and design the user interface you want





+ Bi-Weekly ish iOS Development tips.
Unsubscribe any time.

FAQ

Q: Which programming language will the book use?
The book will use Swift 4 for code samples, although majority of the book focuses on interface builder (without code).

Q: How advanced is Making Sense of Auto Layout?
A lot of beginners to iOS Development struggle to understand Auto Layout and how constraints work. This book is written with the motivation of aiding beginner iOS developer to gain an understanding of how Auto Layout and constraints works and why Apple designed this way. The book is not about super-complex layout with a step-by-step guide, it is about making sense of Auto Layout and constraints. If you can implement a responsive user interface using constraints by yourself, and understand how it works, this might not be for you.

Q: What if I’m unhappy with the book?
I want you to be happy with the book, if for some reason you’re not, just send me an email and I’ll give you a refund as soon as I can.

I have another question...
If your question is not covered here, drop me an email: axel@fluffy.es, I'll be happy to answer.

About the Author



Hi, I'm Axel Kee. I’ve been developing iOS apps for companies, clients and myself — from small indie app to social app that get hundreds of thousands of downloads — since 2016.

I used to struggle on Auto Layout when I first started picking up iOS development, it took me a lot of practice until it 'clicks' for me. Once I understand the intention behind Auto Layout and how it works, I come to appreciate it as it simplify UI development a lot.

I hope this book can make it 'click' for you too.

I write about iOS development stuff here.