How it works
LinearProgressViewStyle is a concrete ProgressViewStyle that renders a ProgressView as a horizontal bar that fills from leading to trailing as work completes. Reach for it when you want the familiar track-and-fill look for determinate progress — a download, an upload, or any task whose fraction of completion you can express as a value between 0 and 1. Because it is a style rather than a separate view, you keep using the standard ProgressView and simply swap in this style to control its appearance.
Apply the style with progressViewStyle(_:)
A
ProgressViewadopts a linear appearance when you pass an instance of the style to the.progressViewStyle(...)modifier. In the example eachProgressViewis followed by.progressViewStyle(LinearProgressViewStyle()), which is what turns the default indicator into a horizontal bar.Drive the fill with a determinate value
The bar's fill represents fractional completion, so the style is meant for a
ProgressViewinitialized with avalue.ProgressView("Downloading", value: 0.6)draws the track filled to 60 percent, andProgressView(value: 0.3)fills to 30 percent; without a value the bar would have nothing to measure against.Color the fill with the tint initializer
LinearProgressViewStyleexposes an initializer that takes atintcolor, letting you recolor the filled portion of the bar to match your interface.LinearProgressViewStyle(tint: .green)paints the second bar's fill green, while the plainLinearProgressViewStyle()leaves the first using the system accent color.Pair it with an optional label
Because the style only governs the bar itself, any label you give the
ProgressViewis laid out alongside it. The first bar carries the"Downloading"label and the second omits one, showing that the style adapts to aProgressViewwith or without descriptive text.
ProgressView(value: 0.3) to ProgressView(value: 0.9) and watch the green linear bar fill nearly to the trailing edge.Example & preview
Press Run live & edit to compile it in your browser — then edit the Swift on the left and the preview re-renders live.
struct LinearProgressViewStyleDemo: View {
var body: some View {
VStack(spacing: 16) {
ProgressView("Downloading", value: 0.6)
.progressViewStyle(LinearProgressViewStyle())
ProgressView(value: 0.3)
.progressViewStyle(LinearProgressViewStyle(tint: .green))
}
.padding()
}
}