Layout

SwiftUI layout is a negotiation in three steps, and knowing it turns “why is this the wrong size?” into an answerable question.

1. The parent proposes a size to the child.
2. The child chooses its own size, and may ignore the proposal entirely.
3. The parent places the child, having no power to resize it.

That third point is the one that surprises people. A parent cannot force a size on a child; it can only propose. Text takes the width it needs for its content, Image takes its natural size, and a Rectangle takes everything it is offered.

HStack {
    Text("Label")
    Spacer()
    Image(systemName: "chevron.right")
}
.frame(width: 200)

frame does not resize the HStack — it inserts a new view that proposes 200 points to the stack and then centres whatever the stack decided to be.

Modifier order is not decoration

Text("Hello").padding().background(.blue)   // blue includes the padding
Text("Hello").background(.blue).padding()   // blue stops at the text

Each modifier wraps the view before it, so reading the chain right to left tells you what is actually on screen.

This is a template chapter. The full text is still being written.