SwiftUI.js
Components

ActivityIndicator

ActivityIndicator is a view that displays a spinning indicator to show that a task is in progress. ActivityIndicator is commonly used to indicate loading states.

ActivityIndicator is a view that displays a spinning indicator to show that a task is in progress. ActivityIndicator is commonly used to indicate loading states.

Examples

Basic Usage

Preview unavailable for this example in the static docs build.

Show code
<VStack spacing={24}>
      <HStack spacing={16}>
        <ActivityIndicator size="small" />
        <ActivityIndicator size="medium" />
        <ActivityIndicator size="large" />
      </HStack>
      <ActivityIndicator color="#FF3B30" />
      <ActivityIndicator color="#34C759" />
    </VStack>

API

PropTypeRequiredDescription
size'small' | 'medium' | 'large'NoThe size of the activity indicator. Default: 'medium'
colorstringNoThe color of the activity indicator. Uses accent color by default.

Inherits additional props from IBaseComponent.

Overview

ActivityIndicator is a view that displays a spinning indicator to show that a task is in progress. ActivityIndicator is commonly used to indicate loading states.

SwiftUI Correspondence: Similar to SwiftUI's ProgressView with indeterminate style.

Notes

  • ActivityIndicator displays an animated spinning indicator
  • Use ActivityIndicator to show that a task is in progress
  • ActivityIndicator supports different sizes (small, medium, large)
  • Custom colors can be applied via the color prop
  • ActivityIndicator is non-interactive and purely visual

Best Practices

  1. Loading states: Use ActivityIndicator to indicate async operations
  2. Placement: Place ActivityIndicator where users expect to see content
  3. Size: Choose appropriate size based on context
  4. Accessibility: Provide text labels for screen readers
  5. Performance: ActivityIndicator is lightweight and doesn't impact performance

On this page