title: React-Native ActivityIndicator doesn't hide after animation finish
body: <p>I have an <strong>ActivityIndicator</strong> that shows while fetch is loading and the wheel disappears when <strong>componentDidMount</strong> is fired, but keeps and empty block space in the layout. I'm guessing how to unmount this component but anything worked for me.</p>
  <p>I'm currently working with these versions:</p>
  <pre class="lang-js prettyprint-override"><code>react-native-cli: 2.0.1
  react-native: 0.40.0
  </code></pre>
  <p>This is part of the code I'm using:</p>
  <pre class="lang-js prettyprint-override"><code>import React, { Component } from 'react';
  import {
    StyleSheet,
    View,
    ... // Couple more components here
    ActivityIndicator,
  } from 'react-native';
  
  import NewsList from './NewsList';
  
  export default class HomeView extends Component {
  
    constructor(props) {
       super(props);
       this.state = {
         noticias: [],
         animating: true,
       };
     }
  
  componentDidMount(){
      fetchFunction() // My fetch function here
        .then(data =&gt; this.setState({ data:data }))
        this.state.animating = false
    }
  
  render() {
  
      return (
          &lt;View&gt;
              &lt;NewsList data={data} /&gt; // My custom component
  
              &lt;ActivityIndicator
              animating={this.state.animating}
              style={[{height: 80}]}
              color=&quot;#C00&quot;
              size=&quot;large&quot;
              hidesWhenStopped={true}
              /&gt;
          &lt;/View&gt;
      );
  
    }
  }
  </code></pre>
  <p>PS: I'm not using Redux.</p>
  <p><a href="https://i.stack.imgur.com/Yc09N.png" rel="nofollow noreferrer">ActivityIndicator with animation working fine</a>
  <a href="https://i.stack.imgur.com/xMQ7y.png" rel="nofollow noreferrer">The empty space when animating is set to false</a></p>