React and React Native

Indicating progress

In this section, you'll learn how to use the <ActivityIndicator> component. As the 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 means to show that something is happening, despite there being no results to display yet.

We'll create a super simple example just, so you can see what this component looks like. Here's the main module for the app:

import React from 'react'; import { AppRegistry, View, ActivityIndicator, } from 'react-native'; import styles from './styles'; // Renders an "<ActivityIndicator>" component in the // middle of the screen. It will animate on it's own // while displayed. ...