Expo Docs

Hey friend! We are co-hosting a conference with Software Mansion, learn more.

ProgressBarAndroid

Android-only React component used to indicate that the app is loading or there is some activity in the app.
Example:

import React, { Component } from "react";
import {
  ProgressBarAndroid,
  AppRegistry,
  StyleSheet,
  View
} from "react-native";

export default class App extends Component {
  render() {
    return (
      <View style={styles.container}>
        <ProgressBarAndroid />
        <ProgressBarAndroid styleAttr="Horizontal" />
        <ProgressBarAndroid styleAttr="Horizontal" color="#2196F3" />
        <ProgressBarAndroid
          styleAttr="Horizontal"
          indeterminate={false}
          progress={0.5}
        />
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: "space-evenly",
    padding: 10
  }
});

AppRegistry.registerComponent("App", () => App);


Reference

Whether to show the ProgressBar (true, the default) or hide it (false).
TypeRequired
boolNo

Color of the progress bar.
TypeRequired
colorNo

If the progress bar will show indeterminate progress. Note that this can only be false if styleAttr is Horizontal.
TypeRequired
indeterminateTypeNo

The progress value (between 0 and 1).
TypeRequired
numberNo

Style of the ProgressBar. One of:
  • Horizontal
  • Normal (default)
  • Small
  • Large
  • Inverse
  • SmallInverse
  • LargeInverse
TypeRequired
enum('Horizontal', 'Normal', 'Small', 'Large', 'Inverse', 'SmallInverse', 'LargeInverse')No

Used to locate this view in end-to-end tests.
TypeRequired
stringNo