Shapes and paths

Shapes and paths

SwiftUI has built-in shapes — Rectangle, RoundedRectangle, Circle, Capsule, Ellipse — which you fill, stroke, and use for clipping and for backgrounds. For anything else, write a type that conforms to Shape and build a Path in its path(in:) method out of lines, curves, and arcs. A shape draws itself to fit whatever rectangle it is handed, so it scales to any size.

Coming from UIKit, this replaces UIBezierPath and CAShapeLayer. One modifier worth knowing early is .trim(from:to:), which draws only part of a path. It is what progress rings are made of.

Draw a custom shape — a ticket with notched sides, or a speech bubble — and check that it looks right at three different sizes. Then draw a progress ring with Circle().trim(from:to:).

1. What must a custom Shape implement?
2. What is the difference between .fill and .stroke?
3. How do you draw only part of a shape's outline?

• Shapes
• Path
• Drawing and graphics