> For the complete documentation index, see [llms.txt](https://cosmicmind.gitbook.io/motion/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://cosmicmind.gitbook.io/motion/api/motionanimation.md).

# MotionAnimation

## Background Color

Animates a view's current background color to the given color.

```swift
.background(color: UIColor)
```

## Border Color

Animates a view's current border color to the given color.

```swift
.border(color: UIColor)
```

## Border Width

Animates a view's current border width to the given width.

```swift
.border(width: CGFloat)
```

## Corder Radius

Animates a view's current corner radius to the given radius.

```swift
.corner(radius: CGFloat)
```

## Transform

Animates a view's current transform (perspective, scale, rotate) to the given one.

```swift
.transform(_ transform: CATransform3D)
```

## Rotate

Rotation animations rotate a view or layer around a given axis using 360 degree intervals. For example, rotating 180 degrees will rotate the view a half interval around a given axis.

### X Axis, Y Axis, Z Axis

Animates a view's current rotation to the given x, y, and z values. The x, y, and z axis animation is a general purpose configuration.

```swift
.rotate(x: CGFloat, y: CGFloat, z: CGFloat)
```

### Touch

Animates a view's current rotation to the given point and z value. A point and z axis animation would generally be used when a user triggers a touch or gesture event.

```swift
.rotate(_ point: CGPoint, z: CGFloat)
```

### 2D

Animates a view's rotation around the z axis, which is a 2D perspective.

```swift
.rotate(_ z: CGFloat)
```

## Spin

Spin animations rotate a view or layer around a given axis using full circle intervals. For example, rotating 0.5 will rotate the view a half interval around a given axis.

### X Axis, Y Axis, Z Axis

Animates a view's current spin to the given x, y, and z values. The x, y, and z axis animation is a general purpose configuration.

```swift
.spin(x: CGFloat, y: CGFloat, z: CGFloat)
```

### Touch

Animates a view's current spin to the given point and z value. A point and z axis animation would generally be used when a user triggers a touch or gesture event.

```swift
.spin(_ point: CGPoint, z: CGFloat)
```

### 2D

Animates a view's spin around the z axis, which is a 2D perspective.

```swift
.spin(_ z: CGFloat)
```

## Scale

Animates the view's current scale to the given x, y, and z scale values.

```swift
.scale(x: CGFloat, y: CGFloat, z: CGFloat)
```

Animates the view's current x & y scale to the given scale value.

```swift
.scale(_ xy: CGFloat)
```

## Translate

Animates a view equal to the distance given by the x, y, and z values.

```swift
.translate(x: CGFloat, y: CGFloat, z: CGFloat)
```

Animates a view equal to the distance given by a point and z value.

```swift
.translate(_ point: CGPoint, z: CGFloat)
```

## Position

Animates a view's current position to the given point.

```swift
.position(_ point: CGPoint)
```

## Fade

### Fade In

Fades the view in during an animation.

```swift
.fadeIn
```

### Fade Out

Fades the view out during an animation.

```swift
.fadeOut
```

### Dynamic Fade

Animates a view's current opacity to the given one.

```swift
.fade(_ opacity: Double)
```

## Z Position

Animates a view's current zPosition to the given zPosition.

```swift
.zPosition(_ position: CGFloat)
```

## Size

Animates a view's current size to the given size.

```swift
.size(_ size: CGSize)
```

## Shadow Path

Animates a view's current shadow path to the given one.

```swift
.shadow(path: CGPath)
```

## Shadow Color

Animates a view's current shadow color to the given one.

```swift
.shadow(color: UIColor)
```

## Shadow Offset

Animates a view's current shadow offset to the given one.

```swift
.shadow(offset: CGSize)
```

If [Material](https://github.com/CosmicMind/Material) is being used, you can use the [Offset](https://github.com/CosmicMind/Material/blob/master/Sources/iOS/Offset.swift) type.

```swift
.shadow(offset: Offset)
```

## Shadow Opacity

Animates a view's current shadow opacity to the given one.

```swift
.shadow(opacity: Float)
```

## Shadow Radius

Animates a view's current shadow radius to the given one.

```swift
.shadow(radius: CGFloat)
```

## Depth

Animates the views shadow offset, opacity, and radius, using raw values.

```swift
.depth(offset: CGSize, opacity: Float, radius: CGFloat)
```

Animates the views shadow offset, opacity, and radius, using a tuple.

```swift
.depth(_ depth: (CGSize, Float, CGFloat))
```

If [Material](https://github.com/CosmicMind/Material) is being used, you can use the [Depth](https://github.com/CosmicMind/Material/blob/master/Sources/iOS/Depth.swift) enum or type.

Animates the views shadow offset, opacity, and radius, using a DepthPreset enum value.

```swift
.depth(_ preset: DepthPreset)
```

Animates the views shadow offset, opacity, and radius, using a Depth instance.

```swift
.depth(_ depth: Depth)
```

## Spring

You would typically use a spring animation to animate a view's position so that it appears to be pulled towards a target by a spring. The further the view is from the target, the greater the acceleration towards it is.

Spring allows control over physically based attributes such as the spring's damping and stiffness.

**stiffness** - The spring stiffness coefficient.

**damping** - Defines how the spring’s motion should be damped due to the forces of friction.

```swift
.spring(stiffness: CGFloat, damping: CGFloat)
```

## Duration

The duration of the view's animation. If a duration of 0 is used, the value will be converted to 0.01, to give a close to zero value.

```swift
.duration(_ time: TimeInterval)
```

## Delay

Delays the animation of a given view.

```swift
.delay(_ time: TimeInterval)
```

## Timing Function

Sets the view's timing function for the animation.

```swift
.timingFunction(_ timingFunction: CAMediaTimingFunction)
```

## Completion

Creates a completion block handler that is executed once the animation is done.

```swift
.completion(_ execute: @escaping () -> Void)
```

Another approach to using a completion handler is to pass in an Array of MotionAnimations and then add a callback handler to the end of the function call. For example:

```swift
view.animate([.delay(1), .duration(0.5), .translate(x: 50, y: 100), .background(color: Color.cyan.base)]) { [weak self] in
    // Do something, animation has completed.
}
```