Your First iOS & SwiftUI App: Polishing the App

The custom alert is looking great at this point, but before we move on, I want to take the opportunity to talk about something we can do to clean up our code a bit.

Currently, we have a lot of numbers that we pulled from Luke’s design scattred throughout our code. Values like 2 for the stroke width, 21 for the round rect corner radius, and so on. You can easily notice them in Xcode because these hardcoded numbers are highlighted in blue.

When you use hardcoded numbers like this, they are often called “magic numbers”. They’re called “magic” because if someone else looks at your code, it’s not always easy to tell where that number came from, or what it refers to - it just feels like magic.

As a general best practice, you should avoid using magic numbers like this whenever possible.

This is because if Luke looks at the design later and says “you know what? I think the app would look better if the stroke width was 3 instead of 2”, currently you’d have to search through your code for all areas you’re using the number “2”, see if that’s a “2” that has to do with a stroke width or just a general 2, and hope you don’t miss anything - which is basically a recipe for disaster.

Instead, of using magic numbers, it’s better to use named constants. For example, instead of using the magic number “2”, you’d use a named constant “strokeWidth”, which is set to 2.

The top block of here shows the syntax you use to define the constants, and in the bottom you can see how you can then use the ocnstants in code.

Moving from magic numbers to named constants has two advantages.

• First, if you ever need to change a constant, you can just change it in one place, rather than trying to hunt it down across your entire codebase.
• Second, the numbers aren’t magic anymore. Now that you’re using the name “strokeWidth”, someone else reading your code now understands what that number is for.

Let’s give this a try, and clean up our code a bit.

Create a new Swift File in Models called Constants.swift.

import UIKit

enum Constants {
  enum General {
    public static let strokeWidth = CGFloat(2.0)
    public static let roundedViewLength = CGFloat(56.0)
    public static let roundRectViewWidth = CGFloat(68.0)
    public static let roundRectViewHeight = CGFloat(56.0)
    public static let roundRectCornerRadius = CGFloat(21.0)
  }
}

Search for stroke, replace all cases with:

Constants.General.strokeWidth

In RoundedViews.swift, replace cases of 56.0 in RoundedImageViews to:

Constants.General.roundedViewLength

And for RoundRectTextView:

.frame(width: Constants.General.roundRectViewWidth, height: Constants.General.roundRectViewHeight)

Search for 21. Rplace cases with:

Constants.General.roundRectCornerRadius

Thanks to using Constants, our code is now easier to understand, and easier to update the design.

Note that we just changed a few of the magic numbers to constants. How far you go with this is really up to you. Some people like to use constants for absolutely every magic number, and some people only like to use constants for thing that are used in multiple places, or things that might change.

But now that you understand the basic concept, you’re armed with the knowledge and can choose what’s best for your app.