Coding Auto Layout by Example

Series about building iOS user interfaces using Auto Layout programatically.

Coding Auto Layout

Who is this for?

The series is aimed towards beginners trying to acquire the skill of building UI purely using code. It covers the basics of Auto Layout without going into a great detail, just enough to get you started on your journey. Multiple guided examples from simple to advanced are provided with (hopefully) enough explanation to teach you the what, how and why of Auto Layout.

What should I know?

Basic knowledge of Xcode and Swift syntax is required as not every bit of code is explained in detail. The focus is heavily on Auto Layout. Familiarity with some UI components is helpful.

How should I read the series?

If you are a beginner, simply go through the posts one by one as they range from the very basic to more advanced. If you are already familiar with stack views, constraints, content hugging and other Auto Layout concepts, then simply browse the examples you are interested in.

Is the source code for the examples provided?

It is, grab a copy of all finished examples by cloning the repo from GitHub. The repo also includes starting projects for each example if you wish to follow along.


Should you find any issues with the code presented in the series, unclear information or want to discuss some of the topics further, please do get in touch!

Table of contents

  1. Intro (reading now)
  2. Basics, Part One
  3. Basics, Part Two
  4. Xcode Setup
  5. Sign Up Screen
  6. Stack Views
  7. Custom UIAlert
  8. Players Profile
  9. Twitter Timeline
  10. Twitter Profile
  11. Music Album