Loading Indicator

SecureLoadingIndicator (Jetpack Compose) and SecureLoadingView (XML/View) are optional library components that display an animated loading indicator during payment processing. Once bound to ComgateSecureSession, the component shows and hides automatically based on payment state.

Tip

The component is optional - payment works correctly even without it. It serves only as visual feedback for users.

Structure

Loading indicator consists of two visual elements:

• Animated spinner - circular spinner with smoothly rotating arc over static track
• Text label - optional text shown below spinner; default text is automatically derived from session language

By default, component is hidden (visibility GONE) and appears only when payment processing starts.

Jetpack Compose usage

import cz.comgate.sdk.compose.*

val loadingState = rememberLoadingIndicatorState(session)

SecureLoadingIndicator(
	state = loadingState,
	modifier = Modifier
		.fillMaxWidth()
		.padding(top = 12.dp)
)

rememberLoadingIndicatorState(session) creates LoadingIndicatorState, automatically binds component to session, and remembers it across recompositions. No additional initialization call is needed.

XML (View) usage

Add SecureLoadingView to layout:

<cz.comgate.sdk.SecureLoadingView
	android:id="@+id/loadingView"
	android:layout_width="match_parent"
	android:layout_height="wrap_content"
	android:layout_marginTop="12dp"
	app:loadingSpinnerColor="#1E88E5"
	app:loadingTrackColor="#BBDEFB"
	app:loadingStrokeWidth="5dp"
	app:loadingSpinnerSize="52dp"
	app:loadingBackgroundColor="#F5F9FF"
	app:loadingCornerRadius="12dp"
	app:loadingPaddingHorizontal="16dp"
	app:loadingPaddingVertical="20dp" />

Then bind component to session in activity/fragment code:

binding.loadingView.setup(session)

Automatic session integration

After binding (setup(session) or rememberLoadingIndicatorState(session)), component behaves automatically:

• Shows when payment processing starts (user presses payment button)
• Hides when terminal payment result arrives (Paid, Cancelled, Failed, or Pending)

Automatic behavior can be disabled anytime, for example if you control loading visibility yourself:

// Compose (via state)
loadingState.isLoadingEnabled = false

// View
binding.loadingView.isLoadingEnabled = false

Information

With isLoadingEnabled = false, show() / hide() methods remain fully functional. Only automatic state-driven visibility is disabled.

Manual control

Component can be controlled independently from session, for custom loading scenarios unrelated to payment:

// Compose
loadingState.show()
loadingState.hide()

// View
binding.loadingView.show()
binding.loadingView.hide()

Text label translation

Default text under spinner is automatically derived from selected payment session language - no manual setup required.

Custom label text can be set like this:

// Compose (via LoadingIndicatorState)
loadingState.setLoadingText("Processing payment...")

// View
binding.loadingView.setLoadingText("Processing payment...")

After custom text is set, automatic session-based translation is no longer applied to this label, even if payment language changes.

Hide label by passing null or empty string:

loadingState.setLoadingText(null)

Styling

Methods

All methods below are available in composable SecureLoadingIndicator update block (direct access to SecureLoadingView instance) and via direct calls on View.

Subset marked as View only is not exposed through LoadingIndicatorState or Compose update block.

Method	Parameter	Description
setSpinnerColor(color)	Int	Rotating arc color.
setTrackColor(color)	Int	Static spinner track color.
setStrokeWidthDp(dp)	Float	Arc/track thickness in dp.
setSpinnerSizeDp(dp)	Float	Spinner diameter in dp.
setLoadingText(text)	String?	Label text below spinner. null or "" hides label.
setLoadingTextColor(color)	Int	Label text color.
setLoadingTextSizeSp(sp)	Float	Label text size in sp.
setLoadingBackgroundColor(color)	Int	Background color of whole component.
setLoadingCornerRadiusDp(dp)	Float	Background corner radius in dp.
setLoadingPaddingDp(horizontalDp, verticalDp)	Float, Float	Component inner padding in dp.
setLoadingTextGapDp(dp)	Float	Gap between spinner and label in dp. (View only)
setLoadingFontFamily(family)	String	Label font family (for example "sans-serif-medium"). (View only)
setLoadingTypeface(typeface)	Typeface	Label font using Typeface instance. (View only)

Information

In Compose, LoadingIndicatorState exposes a reduced method set: setSpinnerColor, setTrackColor, setStrokeWidthDp, setSpinnerSizeDp, setLoadingText, setLoadingTextColor, and setLoadingTextSizeSp. Other methods (background, corner radius, padding, etc.) are available only through update block, see example below.

Compose example (update block)

SecureLoadingIndicator(
	state = loadingState,
	modifier = Modifier.fillMaxWidth(),
	update = {
		setSpinnerColor(Color.parseColor("#FF0000"))
		setTrackColor(Color.parseColor("#FFEBEE"))
		setStrokeWidthDp(4f)
		setSpinnerSizeDp(48f)
		setLoadingBackgroundColor(Color.WHITE)
		setLoadingCornerRadiusDp(12f)
		setLoadingPaddingDp(16f, 20f)
	}
)

XML attributes

XML attribute	Format	Default	Description
app:loadingSpinnerColor	color	#4287f5	Rotating arc color.
app:loadingTrackColor	color	#E0E0E0	Static spinner track color.
app:loadingStrokeWidth	dimension	4dp	Arc and track thickness.
app:loadingSpinnerSize	dimension	48dp	Spinner diameter.
app:loadingText	string	(session translation)	Custom label text. If not provided, translated session text is used.
app:loadingTextColor	color	#666666	Label text color.
app:loadingTextSize	dimension	14sp	Label text size.
app:loadingTextGap	dimension	8dp	Gap between spinner and label.
app:loadingBackgroundColor	color	Transparent	Background color of whole component.
app:loadingCornerRadius	dimension	0dp	Background corner radius.
app:loadingPaddingHorizontal	dimension	16dp	Horizontal inner padding.
app:loadingPaddingVertical	dimension	16dp	Vertical inner padding.
app:loadingEnabled	boolean	true	Enables/disables automatic visibility during payment processing.