Merge pull request #61 from charpeni/issue-59

Ensure animation is called on initial render

Author: davidLeonardi

components/NavBarContent.js

@@ -70,28 +70,38 @@ class NavBarContent extends React.Component {
     this.state = {
       opacity: this.props.willDisappear ? new Animated.Value(1) : new Animated.Value(0),
     };
+
+    this.doAnimation = this.doAnimation.bind(this);
+  }
+
+  componentDidMount() {
+    // componentWillReceiveProps is not called on initial render, ensure animation is.
+    this.doAnimation();
   }
 
   componentWillReceiveProps(newProps) {
     if (newProps.route !== this.props.route) {
       this.state.opacity.setValue(this.props.willDisappear ? 1 : 0);
-
-      setTimeout(() => {
-        Animated.timing(
-          this.state.opacity,
-          {
-            fromValue: this.props.willDisappear ? 1 : 0,
-            toValue: this.props.willDisappear ? 0 : 1,
-            duration: 300,
-            easing: Easing.easeOutQuad,
-          }
-        ).start();
-      }, 0);
+      this.doAnimation();
     } else if (newProps.route === this.props.route) {
       this.state.opacity.setValue(1);
     }
   }
 
+  doAnimation() {
+    setTimeout(() => {
+      Animated.timing(
+        this.state.opacity,
+        {
+          fromValue: this.props.willDisappear ? 1 : 0,
+          toValue: this.props.willDisappear ? 0 : 1,
+          duration: 300,
+          easing: Easing.easeOutQuad,
+        }
+      ).start();
+    }, 0);
+  }
+
   goBack() {
     if (!this.props.willDisappear) {
       this.props.goBack();