跳转至
Structure

CircularProgressViewStyle

A progress view that visually indicates its progress using a circular gauge.

Declaration

struct CircularProgressViewStyle : ProgressViewStyle

Overview

Use this style to specify a circular "spinner" loading progress view. This is usually best for indeterminant amounts of load time.

To illustrate, look at a ProgressView that uses the init(value:total:) initializer. By default, it is a linear load bar.

struct ContentView: View {
    var body: some View {
        ProgressView(value: 0.75)
    }
}
A view containing a default progress view that displays as a gray loading filled three quarters of the way with blue, as defined by the ProgressView value being 0.75.

But when you apply CircularProgressViewStyle with progressViewStyle(_:), it becomes a spinner:

struct ContentView: View {
    var body: some View {
        ProgressView(value: 0.75)
            .progressViewStyle(CircularProgressViewStyle())
    }
}
A gif displaying a default gray circular style progress view spinning.

You can also apply a tint to the spinner using CircularProgressViewStyle's init(tint:):

struct ContentView: View {
    var body: some View {
        ProgressView(value: 0.75)
            .progressViewStyle(CircularProgressViewStyle(tint: .orange))
    }
}
A gif displaying an orange circular style progress view spinning.

Availability

iOS 14.0+

macOS 11.0+

tvOS 14.0+

watchOS 7.0+

Topics


Initializer

init() Creates a circular progress view style.

init(tint:) Creates a circular progress view style with a tint color.


Instance Method

makeBody(configuration:) Creates a view representing the body of a progress view.


Type Alias

Body A view representing the body of a progress view.