activity-indicator.md

title	ActivityIndicator
description	UI component for signaling activity.
contributors	rigor789 Ombuweb

<ActivityIndicator> is a UI component that shows a progress indicator signaling to the user of an operation running in the background.

<<< @/../examples/vue/src/ui/ActivityIndicator/component.vue#example

<<< @/../examples/typescript/src/ui/ActivityIndicator/template.xml#example

<<< @/../examples/typescript/src/ui/ActivityIndicator/template.xml#example

<<< @/../examples/angular/src/ui/ActivityIndicator/component.html#example

<<< @/../examples/svelte/app/components/ui/ActivityIndicator.svelte#example

<<< @/../examples/react/src/components/ui/activityindicator.tsx#example

<<< @/../examples/solid/src/ui/activityindicator.tsx#example

Examples

Always busy ActivityIndicator

<ActivityIndicator busy="true" />

Props

busy

busy: boolean

Gets or sets whether the indicator is busy.

iosIndicatorViewStyle 8.9+

iosIndicatorViewStyle: IOSIndicatorViewStyle = 'medium' | 'large'

Specifies the style of the indicator. This property is iOS specific.

Valid values: medium and large.

Default value: medium.

---

...Inherited

For additional inherited properties, refer to the API Reference.

Events

busyChange

on('busyChange', (args: EventData) => {
  const indicator = args.object as ActivityIndicator
  console.log(`indicator.busy changed to: ${indicator.busy}`)
})

Emitted when the busy property changes.

See EventData.

Native component

• Android: android.widget.ProgressBar (indeterminate = true)
• iOS: UIActivityIndicatorView