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——
colorstring | undefined——
hidesWhenStoppedboolean | undefined——
sizenumber | "small" | "large" | undefined——
style((false | "" | ViewStyle | RegisteredStyle<ViewStyle> | RecursiveArray<Falsy | ViewStyle | RegisteredStyle<ViewStyle>> | null) & ViewStyle) | undefined——
Defined in react-native-molecules/components/ActivityIndicator