Adding stepperView to a UIView in swift

[godeodg]

Hello, Trying to add this to a UIView, I havnt really used SwiftUI yet.

[badrinathvm]

You can wrap this the swiftuiview in let view controller= UIHostingController(rootview:)and use it UIKit

[godeodg]

Thank you, Got it working. One other question is it possible to refresh and update the status of a step? i.e tap button and update to the next step?
thanks again

[badrinathvm]

Hi @godeodg , Yes it is possible.

The key is to make your steps, indicators, and lifecycle arrays @State properties so SwiftUI re-renders the StepperView when they change.

Here's a complete example with a "Next Step" button:

import StepperView                                                                                                                                                                                           
                                                                                                                                                                                                             
struct DynamicStepExample: View {                                                                                                                                                                            

    @State var currentStep = 0

    let stepTexts = ["Basic Details", "Company Details", "Subscription Plan", "Payment Details"]

    var steps: [Text] {
        stepTexts.map { Text($0).font(.caption) }
    }

    var indicators: [StepperIndicationType<AnyView>] {
        stepTexts.indices.map { index in
            if index <= currentStep {
                return .custom(NumberedCircleView(text: "\(index + 1)", width: 30, color: .green).eraseToAnyView())
            } else {
                return .custom(NumberedCircleView(text: "\(index + 1)", width: 30, color: .gray).eraseToAnyView())
            }
        }
    }

    var lifeCycles: [StepLifeCycle] {
        stepTexts.indices.map { index in
            index <= currentStep ? .completed : .pending
        }
    }

    var body: some View {
        VStack(spacing: 30) {
            StepperView()
                .addSteps(steps)
                .indicators(indicators)
                .stepLifeCycles(lifeCycles)
                .stepIndicatorMode(.vertical)
                .lineOptions(StepperLineOptions.rounded(4, 8, Color.green, Color.gray))
                .spacing(30)

            HStack(spacing: 20) {
                Button("Previous") {
                    if currentStep > 0 { currentStep -= 1 }
                }

                Button("Next Step") {
                    if currentStep < stepTexts.count - 1 { currentStep += 1 }
                }
            }
        }
        .padding()
    }
}

By driving indicators and lifeCycles as computed properties from a single @State var currentStep, tapping the button updates everything — indicator colors, line colors, and lifecycle states all refresh
together.

You can also check out ExampleView9.swift in the example app which demonstrates dynamically adding/inserting steps using @State arrays.