Layout in Code

Storyboards are useful for visualizing your UI without running it on your device. However it also poses a problem for projects with multiple developers. Merging changes in storyboard files (or nibs) is a huge pain and so many teams choose not to use them. It's also much easier to visualize diffs and evolution over time in code when multiple people are making changes. In this series we will explore creating an iOS application entirely in code.

Length: about 1 hour

Installments

1. Setting up Scene Delegates in Code

Subscribers only

When working on a project that doesn't use Storyboards, we have to create our window and root view controller manually. iOS 13 introduced the concept of Scene Delegates, which change how this is typically set up. In this episode we will review how to set up a new project, remove the storyboard references, and set up the window and root view controller in code.

2. SwiftUI Previews for UIKit

Subscribers only

In this episode we will see how we can leverage SwiftUI's live previews even if we aren't using SwiftUI and even if our deployment target is less than iOS 13! We'll cover previewing our view controllers and using that to give us rapid feedback on our layout as we work.

3. Gradient View

Subscribers only

One really useful UIView subclass I generally have on all my projects is a simple GradientView. You give it two colors and optionally some location values and it draws a gradient from top to bottom. In this episode we build this so that we can integrate a fade to black effect to overlay on top of the background image.

4. Extracting View and Layout Code into a Custom View

Subscribers only

If you look at our view controller now, it is full of code that mostly is dealing with constraints, subviews, and overall layout. This is really the job of the view. In this episode we will extract this into a new view class. We'll also introduce a reusable base class that will handle the required view initializer dance for us, making the job of creating custom view classes a bit easier.

5. Easier Autolayout Constraints with SnapKit

Subscribers only

The built-in way of adding constraints in code requires quite a bit of code and is a bit cumbersome to write. I believe that we should aim to reduce friction when writing code like this to make it easier to add new views and change your layout. SnapKit is a pretty useful dependency that gives you a DSL for making autolayout constraints. In this episode we'll integrate SnapKit into the project and simplify our existing layout code.

6. Styling Text with Attributed Strings

Subscribers only

To work with styled text we'll use NSAttributedStrings, which allow us to apply styles to ranges of text. Doing this in code is a bit more cumbersome than in storyboards, but allows us to control things like font size, color, style, kerning, line spacing and more.

7. Handling Links in Text

Subscribers only

Sometimes our text contains links that should be styled differently and react to taps so a URL can be opened in a web browser. While we can use a UILabel to detect and style links, they don't respond to touches. Let's see how we can leverage UITextView instead to handle links in NSAttribtedStrings.

8. Easier Styled Strings with BonMot

Subscribers only

Working with NSAttributedStrings can be a bit cumbersome, and can present some challenges when you want to localize your strings. We can make things much easier to work with by leveraging the BonMot library, which provides a cleaner interface for styling strings, allows us to separate styling from the views and strings, and customize tags we can use to mix styles in the same string.