-
Book Overview & Buying
-
Table Of Contents
React and React Native - Sixth Edition
By :
In this section, you'll learn how to use the ActivityIndicator component. As its name suggests, you render this component when you need to indicate to the user that something is happening. The actual progress may be indeterminate, but at least you have a standardized way to show that something is happening, even though there are no results to display yet.
Let's create an example so that you can see what this component looks like. Here's the App component:
export default function App() {
return (
<View style={styles.container}>
<ActivityIndicator size="large" />
</View>
);
}
The <ActivityIndicator /> component is platform-agnostic. Here's how it looks on iOS:

Figure 24.1: An activity indicator on iOS
It renders an animated spinner in the middle of the screen. This is the large spinner, as specified in the size property. The ActivityIndicator spinner can also be small, which makes more sense if...