How do I overlay ActivityIndicator in react-native?

For this to work, you’d need to absolute position it, and render it after the elements that should be underneath the overlay:

  loading: {
    position: 'absolute',
    left: 0,
    right: 0,
    top: 0,
    bottom: 0,
    alignItems: 'center',
    justifyContent: 'center'
  }

Then simply compose it into the render method conditionally, based on a loading state. I am going to assume this.handleLogin sets some sort of loading state already.

Make sure it’s rendered last so it takes precedence.

...
{this.state.loading &&
    <View style={styles.loading}>
      <ActivityIndicator size="large" />
    </View>
}