Greetings, traveler!

In SwiftUI, animating custom Shape types has always been possible, but not without some effort. With the release of the @Animatable macro in iOS 26, things have become a lot simpler.

What @Animatable Does

The new @Animatable macro marks a Shape as animatable. It automatically handles interpolation for all properties that can be animated—such as numbers, angles, and sizes—without requiring any manual conformance or calculations.

If a property shouldn’t participate in the animation (for example, a Boolean flag or a static configuration), it can be excluded using the @AnimatableIgnored macro.

This makes animating custom paths much more straightforward.

A Practical Example

Here’s a simple arc that updates its start and end angles with animation when tapped. The direction of the arc is controlled by a clockwise property, which doesn’t animate and is ignored by the macro.

import SwiftUI

struct ContentView: View {
    @State private var startAngle: Angle = .degrees(0)
    @State private var endAngle: Angle = .degrees(80)
    
    var body: some View {
        Arc(
            startAngle: startAngle,
            endAngle: endAngle,
            clockwise: true
        )
        .stroke(.purple, lineWidth: 20)
        .frame(width: 320, height: 320)
        .glassEffect()
        .overlay {
            Button("Tap Me") {
                withAnimation {
                    startAngle = .degrees(Double(Int.random(in: 0...100)))
                    endAngle = .degrees(Double(Int.random(in: 100...360)))
                }
            }
            .buttonStyle(.glass)
        }
    }
}

@Animatable
struct Arc: Shape {
    var startAngle: Angle
    var endAngle: Angle
    @AnimatableIgnored var clockwise: Bool
    
    func path(in rect: CGRect) -> Path {
        var path = Path()
        path.addArc(
            center: CGPoint(x: rect.midX, y: rect.midY),
            radius: rect.width / 2,
            startAngle: startAngle,
            endAngle: endAngle,
            clockwise: clockwise
        )
        return path
    }
}

The key part here is the @Animatable macro. Once applied, SwiftUI animates any changes to the startAngle and endAngle properties automatically, with no extra work.

The @AnimatableIgnored macro ensures the clockwise property remains fixed during the animation. It’s still passed to addArc and affects rendering, but it won’t be interpolated.

Availability

The @Animatable macro is available starting in iOS 26.0+, iPadOS 26.0+, Mac Catalyst 26.0+, macOS 26.0+, tvOS 26.0+, visionOS 26.0+ and watchOS 26.0+.

It requires importing SwiftUI and works with standard animation APIs like withAnimation.

Final Notes

This is a small but useful improvement to how custom shapes are animated in SwiftUI. It lowers the friction for building visual effects that rely on animating shape properties, and it keeps the code clean and focused.