iActivityIndicator

Quickly implement & easily customize a great looking activity indicator.

1.

Install iActivityIndicator.

2.

Add iActivityIndicator to your project.

import SwiftUI
import iActivityIndicator

struct ContentView: View {
    var body: some View {
        iActivityIndicator()
    }
}

3.

Customize your iActivityIndicator.



Examples

Modern Loading

Use width and count to modify your apps modern aesthetic.

import SwiftUI
import iActivityIndicator

struct ContentView: View {
    var body: some View {
        iActivityIndicator()
            .style(.arcs())

        iActivityIndicator()
            .style(.arcs(width: 8))

        iActivityIndicator()
            .style(.arcs(count: 10))
    }
}

The Classic

Use count and width to modify Apple's original indicator.

import SwiftUI
import iActivityIndicator

struct ContentView: View {
    var body: some View {
        VStack {
            iActivityIndicator() // Default 

            iActivityIndicator()
                .style(.classic(count: 20, width: 2))

            iActivityIndicator()
                .style(.classic(count: 3, width: 50))
        }
        .foregroundColor(.purple)
        .padding()
    }
}

Blinker

Use count and size to change the feel of your loading indicator.

import SwiftUI
import iActivityIndicator

struct ContentView: View {
    var body: some View {
        VStack {
            iActivityIndicator()
                .style(.blinking())

            iActivityIndicator()
                .style(.blinking(count: 30))

            iActivityIndicator()
                .style(.blinking(count: 3, size: 120))
        }
        .foregroundColor(.red)
        .padding()
    }
}

Web OG

Use opacityRange and scaleRange to range the opacity & size of the bars.

import SwiftUI
import iActivityIndicator

struct ContentView: View {
    var body: some View {
        VStack {
            iActivityIndicator()
                .style(.bars(opacityRange: 1...1))

            iActivityIndicator()
                .style(.bars(scaleRange: 1...1))

            iActivityIndicator()
                .style(.bars(count: 20, scaleRange: 0...1, opacityRange: 0...1))
        }
        .foregroundColor(.pink)
        .padding()
    }
}

Custom Shape

Use rotatingShapes(content: ...) to make any view an activity indicator.

import SwiftUI
import iActivityIndicator

struct ContentView: View {
    var body: some View {
        VStack {
            iActivityIndicator()
                .style(.rotatingShapes())

            iActivityIndicator()
                .style(.rotatingShapes(count: 3, size: 50))

            iActivityIndicator()
                .style(.rotatingShapes(content: AnyView(Text("🎃").fixedSize())))
        }
        .padding()
    }
}

Customize

iActivityIndicator supports a variety of styles, each with their own parameters. Styles are specified through a style modifier. Parameters, such as width, count, spacing, scaleRange, and opacityRange all refer to the individual rotating units in an activity indicator, as opposed to the activity indicator as a whole. Therefore, all custom parameters are built into the style enum declaration.

Example: Change the activity indicator style, and modify the width of its individual rotating units with:

iActivityIndicator()
    .style(.arcs(count: 10, width: 5, spacing: 2))

Use our exhaustive input list to customize your chart.

Parameter Description
.style(style: AStyle) -> iActivityIndicator
style takes an activity indicator style as it's parameter. There are 7 styles: arcs, bars, blinking, classic, rotatingShapes, rowOfShapes, rowOfCircle.
 AStyle.arcs(count: UInt = 3,
             width: CGFloat = 2,
             spacing: CGFloat = 1) 
You can modify arcs width, the total arc count, and the spacing between arcs.
 AStyle.bars(count: UInt = 8,
             spacing: CGFloat = 8,
             cornerRadius: CGFloat = 8,
             scaleRange: ClosedRange<Double> = (0.5...1),
             opacityRange: ClosedRange<Double> = (0.25...1)) 
You can modify the total number of bars in your indicator, the spacing between bars, the corner radius on each individual bar, the scale at which each bar changes while animated, and the range of opacities during animation.
 AStyle.blinking(count: UInt = 8,
                 size: CGFloat = 16)
You can modify the total number of blinking circles in your indicator and the size of each individual circle.
 AStyle.classic(count: UInt = 8,
                width: CGFloat = 0)
You can modify the total number of classic rotating rectangles and each rectangle's individual width.
 AStyle.rotatingShapes(count: UInt = 6,
                       size: CGFloat = 10,
                       content: AnyView = AnyView(Circle()))
You can modify the total number of rotating shapes, the size of each shape, and the content within each shape.
 AStyle.rowOfShapes(count: UInt = 5,
                    spacing: CGFloat = 8,
                    scaleRange: ClosedRange<Double> = (0.75...1),
                    opacityRange: ClosedRange<Double> = (0.25...1),
                    content: AnyView = AnyView(Circle()))
You can modify the total number of shapes in your row, the spacing between each shape, the scale at which each shape changes while animated, the range of opacities of each shape during animation, and the content within each shape.

Community

Meet the developers behind iActivityIndicator.

@MojtabaHs


iOS 13.0+

WatchOS 6.0+