---
title: Animatable
framework: swiftui
role: symbol
role_heading: Protocol
path: swiftui/animatable
---

# Animatable

A type that describes how to animate a property of a view.

## Declaration

```swift
protocol Animatable
```

## Overview

Overview When an animatable value changes inside a withAnimation(_:_:) block (or is affected by an animation(_:value:) modifier), SwiftUI reads the old and new animatableData values, then interpolates between them over successive frames using VectorArithmetic operations. The framework calls the animatableData setter on each frame, giving your type a chance to update any derived state. Use the Animatable macro To conform a type to the Animatable protocol, use the Animatable() macro to avoid writing the animatableData property by hand: @Animatable struct RingSegment: Shape {     var startAngle: Angle     var endAngle: Angle     // ... } The macro inspects every stored property. Properties whose types conform to VectorArithmetic or Animatable are included in the synthesized animatableData. If a property cannot participate, the macro emits an error suggesting you mark it with AnimatableIgnored() or conform its type to VectorArithmetic or Animatable: @Animatable struct RingSegment: Shape {     var startAngle: Angle     var endAngle: Angle     @AnimatableIgnored var isOpaque: Bool     // ... } Manual conformance for custom interpolation Reach for a handwritten animatableData when the interpolated value needs custom logic that does not correspond one-to-one with a stored property, such as normalization, clamping, or driving a derived value. Use AnimatableValues (26.0+ releases) to group multiple animated properties, or AnimatablePair on earlier deployment targets: struct WaveShape: Shape {     var amplitude: CGFloat     var phase: CGFloat     var maxAmplitude: CGFloat

var animatableData:         AnimatableValues<CGFloat, CGFloat>     {         get {             AnimatableValues(amplitude, phase)         }         set {             amplitude = min(                 max(newValue.value.0, 0),                 maxAmplitude)             phase = newValue.value.1                 .truncatingRemainder(                     dividingBy: 2 * .pi)         }     }

// ... }

## Topics

### Animating data

- [Animatable()](swiftui/animatable().md)
- [AnimatableIgnored()](swiftui/animatableignored().md)
- [animatableData](swiftui/animatable/animatabledata-6nydg.md)
- [AnimatableData](swiftui/animatable/animatabledata-swift.associatedtype.md)

## Relationships

### Inherited By

- [AnimatableModifier](swiftui/animatablemodifier.md)
- [GeometryEffect](swiftui/geometryeffect.md)
- [InsettableShape](swiftui/insettableshape.md)
- [Layout](swiftui/layout.md)
- [RoundedRectangularShape](swiftui/roundedrectangularshape.md)
- [Shape](swiftui/shape.md)
- [TextRenderer](swiftui/textrenderer.md)
- [VisualEffect](swiftui/visualeffect.md)

### Conforming Types

- [Angle](swiftui/angle.md)
- [AnyLayout](swiftui/anylayout.md)
- [AnyShape](swiftui/anyshape.md)
- [ButtonBorderShape](swiftui/buttonbordershape.md)
- [Capsule](swiftui/capsule.md)
- [Circle](swiftui/circle.md)
- [Color.Resolved](swiftui/color/resolved.md)
- [Color.ResolvedHDR](swiftui/color/resolvedhdr.md)
- [ConcentricRectangle](swiftui/concentricrectangle.md)
- [ContainerRelativeShape](swiftui/containerrelativeshape.md)
- [DefaultGlassEffectShape](swiftui/defaultglasseffectshape.md)
- [Edge.Corner.Style](swiftui/edge/corner/style.md)
- [EdgeInsets](swiftui/edgeinsets.md)
- [EdgeInsets3D](swiftui/edgeinsets3d.md)
- [Ellipse](swiftui/ellipse.md)
- [EmptyVisualEffect](swiftui/emptyvisualeffect.md)
- [GridLayout](swiftui/gridlayout.md)
- [HStackLayout](swiftui/hstacklayout.md)
- [LayoutRotationUnaryLayout](swiftui/layoutrotationunarylayout.md)
- [ModifiedContent](swiftui/modifiedcontent.md)
- [OffsetShape](swiftui/offsetshape.md)
- [Path](swiftui/path.md)
- [Rectangle](swiftui/rectangle.md)
- [RectangleCornerRadii](swiftui/rectanglecornerradii.md)
- [RotatedShape](swiftui/rotatedshape.md)
- [RoundedRectangle](swiftui/roundedrectangle.md)
- [RoundedRectangularShapeCorners](swiftui/roundedrectangularshapecorners.md)
- [ScaledShape](swiftui/scaledshape.md)
- [SpatialContainer](swiftui/spatialcontainer.md)
- [StrokeStyle](swiftui/strokestyle.md)
- [TransformedShape](swiftui/transformedshape.md)
- [UnevenRoundedRectangle](swiftui/unevenroundedrectangle.md)
- [UnitPoint](swiftui/unitpoint.md)
- [UnitPoint3D](swiftui/unitpoint3d.md)
- [VStackLayout](swiftui/vstacklayout.md)
- [ZStackLayout](swiftui/zstacklayout.md)

## See Also

### Making data animatable

- [AnimatableValues](swiftui/animatablevalues.md)
- [AnimatablePair](swiftui/animatablepair.md)
- [VectorArithmetic](swiftui/vectorarithmetic.md)
- [EmptyAnimatableData](swiftui/emptyanimatabledata.md)