Home Guides Learn SwiftUI

Learn SwiftUI, one view at a time

Learn SwiftUI by writing one view and watching it run. Not a course, not a book, and not a place to assemble an app. A component, on your iPhone.

A sketch of the component. The file below is the real one. It plays on the phone.

One view

import SwiftUI

struct HelloMark: View {
    var body: some View {
        VStack(spacing: 10) {
            Circle()
                .fill(.orange)
                .frame(width: 28, height: 28)
            Text("Hello")
                .font(.title)
                .foregroundStyle(.orange)
        }
    }
}

That file is a fair first hour. A circle, a word, a vertical stack, two modifiers. fill paints the shape. foregroundStyle paints the text. frame gives the circle a size, because a circle with no frame has nothing to draw into.

Change one thing

Swap .orange for .mint. Change the words. Make the circle 64 wide instead of 28. Press play again. If a line cannot run the way Xcode would, Swoop stops and names it. The stop is the lesson. A preview that invents a result would teach you the wrong language.

Stay on one component. Swoop is postcard size on purpose. Screens, navigation, and lists are a different job, and the player refuses them rather than faking them.

Then make it move

Motion is the same file with a clock or a state change added. These are complete, and each one plays:

What you are not signing up for

There is no syllabus, no certificate, and no PDF. Your files stay on the phone. Copy gives you the source you wrote. The stage is there so you can see that source run before you paste it into Xcode.

Get Swoop

iPhone. iOS 17 and later. The file plays on the phone.