From 49713d2bb1f43049d7491b792e8d52914cacccd8 Mon Sep 17 00:00:00 2001
From: Nate <nate.hunzaker@gmail.com>
Date: Mon, 24 Jun 2019 02:04:04 -0700
Subject: [PATCH] Possible fix for #9023: Use View.INVISIBLE instead of
 View.GONE to hide ActivityIndicator (#25354)

Summary:
On Android, if the ActivityIndicator component is initially set to `animate={false}`, it does not display if later set to `true` (https://github.com/facebook/react-native/issues/9023)

For some reason, the layout width/height of the associated ProgressBar remains 0, despite the parent layout having the correct width/height:

![image](https://user-images.githubusercontent.com/590904/59955251-f8d2ef00-943d-11e9-8019-0977e19186b3.png)

I wasn't able to determine why this is the case, but I did notice that changing the visibility settings from `View.GONE` to `View.INVISIBLE` fixes the issue while not (as far as I can tell) having an impact on the React Native layout:

#### Before:

![before](https://user-images.githubusercontent.com/590904/59955177-a1cd1a00-943d-11e9-80da-876c99b7d5bf.gif)

#### After:

![after](https://user-images.githubusercontent.com/590904/59955183-a7c2fb00-943d-11e9-952b-892bdc23bd48.gif)

Using `View.INVISIBLE` appears to alleviate the issue.

This should fix https://github.com/facebook/react-native/issues/9023

## Changelog

[Android][fixed] - ActivityIndicator appears as expected when `animated={false}` is later set to `true`.
Pull Request resolved: https://github.com/facebook/react-native/pull/25354

Test Plan:
Link this branch to a new React native project with the following App.js class:

```javascript
import React, { Component } from "react";
import {
  StyleSheet,
  Text,
  Button,
  View,
  ActivityIndicator,
  TouchableHighlight
} from "react-native";

export default class App extends Component {
  constructor() {
    super();

    this.state = {
      show: false
    };
  }

  hide = () => {
    this.setState({ show: false });
  };

  show = () => {
    this.setState({ show: true });
  };

  render() {
    return (
      <View>
        <ActivityIndicator
          animating={this.state.show}
          size="large"
          style={styles.indicator}
        />

        <ActivityIndicator
          animating={this.state.show}
          size="small"
          style={styles.indicator}
        />

        <View style={{ flexDirection: "row" }}>
          <Button title="Hide" style={styles.button} onPress={this.hide} />
          <Button title="Show" style={styles.button} onPress={this.show} />
        </View>

        <Text>Showing ? {this.state.show.toString()}</Text>
      </View>
    );
  }
}

const styles = StyleSheet.create({
  indicator: {
    borderColor: "red",
    borderWidth: 1
  },
  button: {
    marginRight: 8
  }
});
```

Differential Revision: D15963366

Pulled By: cpojer

fbshipit-source-id: ee3df3fd84acbff342599dc6f4f4a391704876fa
---
 .../react/views/progressbar/ProgressBarContainerView.java       | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/ReactAndroid/src/main/java/com/facebook/react/views/progressbar/ProgressBarContainerView.java b/ReactAndroid/src/main/java/com/facebook/react/views/progressbar/ProgressBarContainerView.java
index 2aa39dc8bb8bd5..e4a3b463376154 100644
--- a/ReactAndroid/src/main/java/com/facebook/react/views/progressbar/ProgressBarContainerView.java
+++ b/ReactAndroid/src/main/java/com/facebook/react/views/progressbar/ProgressBarContainerView.java
@@ -73,7 +73,7 @@ public void apply() {
     if (mAnimating) {
       mProgressBar.setVisibility(View.VISIBLE);
     } else {
-      mProgressBar.setVisibility(View.GONE);
+      mProgressBar.setVisibility(View.INVISIBLE);
     }
   }