Loading indicator

SecureLoadingView and .secureLoadingOverlay are optional library components that display an animated loading indicator during payment processing. When bound to ComgateSecureSession, the overlay shows and hides automatically based on payment state.

Tip

The component is optional — the payment proceeds correctly without it. Its sole purpose is visual feedback for the user.

Structure

The library offers two loading-indicator variants:

• SecureLoadingView — an inline view you can place anywhere in the SwiftUI hierarchy (e.g. centered on the screen).
• .secureLoadingOverlay(...) — a view modifier that shows the indicator as a floating panel above the entire screen with a dimmed background.

The indicator consists of two visual elements:

• Animated spinner — a circular spinner with a smoothly rotating arc above a static track
• Text label — optional text below the spinner; the default is automatically derived from the session language

SecureLoadingView

Inline indicator for custom placement:

import SwiftUI
import ComgateSDK

VStack {
    Spacer()
    SecureLoadingView(text: "Processing payment…")
    Spacer()
}

Initializer

public init(text: String? = nil, style: LoadingStyle = .indicator)

Parameter	Type	Description
text	String?	Optional text below the spinner. nil hides the label.
style	LoadingStyle	Style struct. Default: .indicator.

SecureLoadingOverlay (modifier)

SecureLoadingOverlay is a view modifier you apply to a parent view to show a floating indicator over it. The library provides two variants:

Manual control

struct ContentView: View {
    @State private var isLoading = false

    var body: some View {
        ZStack { /* ... */ }
            .secureLoadingOverlay(
                isVisible: isLoading,
                text: "Processing payment…"
            )
    }
}

Parameter	Type	Description
isVisible	Bool	Shows/hides the overlay.
text	String?	Optional text.
style	LoadingStyle	Style struct. Default: .overlay.

Automatic session binding

Recommended variant — the overlay shows and hides automatically based on session.isProcessingPayment:

struct ContentView: View {
    @ObservedObject var session: ComgateSecureSession

    var body: some View {
        ZStack { /* ... */ }
            .secureLoadingOverlay(session: session)
    }
}

Parameter	Type	Description
session	ComgateSecureSession	Session whose isProcessingPayment the overlay observes.
text	String?	Optional text. When nil, session.translation.loadingProcessingText is used.
style	LoadingStyle	Style struct. Default: .overlay.
isLoadingEnabled	Bool	When false, the overlay does not appear even during processing. Default: true.

With the auto-bound variant, the overlay appears as soon as payment processing starts (session.processPayment(...) or session.processApplePayPayment(...)) and hides once a terminal result arrives.

Information

To temporarily disable the automatic behavior, pass isLoadingEnabled: false. Manual display via secureLoadingOverlay(isVisible:) remains independent.

LoadingStyle

Styling is done with the LoadingStyle struct.

Properties

Property	Type	Default	Description
spinnerColor	Color	#4287F5	Color of the rotating arc.
trackColor	Color	#E0E0E0	Color of the static spinner track.
strokeWidth	CGFloat	4	Stroke width of the arc and track in points.
spinnerSize	CGFloat	48	Spinner diameter in points.
textColor	Color	#666666	Label text color.
textSize	CGFloat	14	Label text size in points.
textGap	CGFloat	8	Gap between the spinner and the label in points.
textFontName	String?	nil	Custom font name.
backgroundColor	Color	.white	Background color of the card (overlay panel).
cornerRadius	CGFloat	12	Card corner radius in points.
paddingHorizontal	CGFloat	16	Card horizontal padding.
paddingVertical	CGFloat	20	Card vertical padding.
dimAmount	CGFloat	0.0	Opacity of the dim layer (0–1).

Presets

Preset	Description
LoadingStyle.indicator	For inline use (SecureLoadingView). Default.
LoadingStyle.overlay	For the overlay variant. Larger padding, corner radius 16.

Example

let style = LoadingStyle(
    spinnerColor: Color(red: 0.10, green: 0.47, blue: 0.91),
    trackColor: Color(red: 0.85, green: 0.92, blue: 1.00),
    strokeWidth: 4,
    spinnerSize: 52,
    backgroundColor: .white,
    cornerRadius: 16,
    paddingHorizontal: 28,
    paddingVertical: 28,
    dimAmount: 0.5
)

ContentView()
    .secureLoadingOverlay(session: session, style: style)

Label translation

The default text below the spinner in the auto-bound variant is automatically derived from the chosen session language via Translation.loadingProcessingText. To set custom text, pass the text parameter:

ContentView()
    .secureLoadingOverlay(
        session: session,
        text: "Processing your payment, please wait…"
    )