Progress bar

A component that visually represents the progress of a task or process using a horizontal bar.

Preview

Button Preview

Code Example

let model = ProgressBarVM {
  $0.currentValue = 65
  $0.cornerRadius = .large
  $0.style = .striped
  $0.color = .primary
}

API

ProgressBarVM Props

A model that defines the appearance properties for a progress bar component.

NameTypeDefaultDescription
colorComponentColoraccentThe color of the progress bar.
cornerRadiusComponentRadiusmediumThe corner radius of the progress bar.
currentValueCGFloat0The current value of the progress bar.
maxValueCGFloat100The maximum value of the progress bar.
minValueCGFloat0The minimum value of the progress bar.
sizeComponentSizemediumThe size of the progress bar.
styleStylestripedThe visual style of the progress bar component.

SUProgressBar

public init(model: ProgressBarVM)

UKProgressBar

Initializers

public init(model: ProgressBarVM)

Public Properties

NameTypeDescription
modelProgressBarVMA model that defines the appearance properties.

Public Subviews

NameTypeDescription
backgroundViewUIViewThe background view of the progress bar.
progressViewUIViewThe view that displays the current progress.
stripedLayerCAShapeLayerA shape layer used to render striped styling.