Skip to main content

ActivityIndicator

Feedback & Status

ActivityIndicator

Animated spinner that mirrors React Native’s ActivityIndicator but follows your theme.

Usage

Communicate background loading or blocking async work inline or full-screen.

Highlights

  • Themed colors through token parser
  • Hides automatically when not animating

When to use it

  • You need to show indefinite progress for network calls.
  • A button or FAB transitions into a loading state.

Related components

StateLayerButton

Examples​

Default​

Preview (Web)
import { ActivityIndicator } from 'react-native-molecules/components/ActivityIndicator';

export default function Example() {
  return <ActivityIndicator color="tertiary" size={30} animating />;
}
PropTypeDefaultDescription
animatingboolean | undefined—Whether to show the indicator or hide it.
hidesWhenStoppedboolean | undefined—Whether the indicator should hide when not animating.
sizenumber | "small" | "large" | undefined—The color of the spinner. color?: string; /** Size of the indicator.
colorstring | undefined——
Defined in react-native-molecules/components/ActivityIndicator