CircularSpinner

A Swift package for drawing an animated circular spinner in SwiftUI. Enjoy!

CircularSpinner is a stroked background circle with a spinning foreground puck. The puck's length oscillates between long and short at each spin cycle. You can simply declare a CircularSpinner in your View hierarchy and it will automatically animate.

The stroked foreground and background can be any ShapeStyle. This allows for special effects like shadows and gradients to be applied to either layer. By default, the spinner will fill its container's bounds, but you can supply a diameter to the initializer.

API

There are two initializers. The main initializer offers the most customization, accepting separate background and forground ShapeStyles:

/// Initializes an indefinitely animating CircularSpinner.
/// - Parameters:
///   - strokeWidth: The stroke width to use for the spinner background and foreground circles.
///   - animationDuration: The duration of one spin cycle, which rotates the puck 2 full revolutions around the circle.
///   - diameter: The diameter of the spinner. When nil, the spinner fills the container's bounds.
///   - backgroundStyle: The ShapeStyle to apply to the full background circle.
///   - foregroundStyle: The ShapeStyle to apply to the spinning puck.
public init(strokeWidth: CGFloat = 10,
            animationDuration: TimeInterval = 1.75,
            diameter: CGFloat? = nil,
            backgroundStyle: Background = Color.secondary,
            foregroundStyle: Foreground = Color.primary)

Example use case:

CircularSpinner(
    strokeWidth: 15,
    animationDuration: 1,
    backgroundStyle: .white.shadow(.inner(radius: 3)),
    foregroundStyle: .red.shadow(.inner(radius: 3))
)

Premade styles

There is a second initializer that accepts a premade SpinnerStyle:

public init(strokeWidth: CGFloat = 10,
            animationDuration: TimeInterval = 1.75,
            diameter: CGFloat? = nil,
            style: SpinnerStyle)

Example use case:

CircularSpinner(style: .bubbledForeground)

Here is an example of each SpinnerStyle:

`bubbledForeground`	`hierarchy`	`accent`	`nineties`