From 4ce565bf23c3e7764bf6f89c4e931caa417b94c4 Mon Sep 17 00:00:00 2001
From: Ferran Negre <fnp.developer@gmail.com>
Date: Tue, 17 Apr 2018 14:08:59 +0200
Subject: [PATCH] fix: reduce non-shifting animation duration and background
 color for bottom navigation (#319)

---
 src/components/BottomNavigation.js | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/components/BottomNavigation.js b/src/components/BottomNavigation.js
index 1e286cd..f70a54b 100644
--- a/src/components/BottomNavigation.js
+++ b/src/components/BottomNavigation.js
@@ -15,7 +15,7 @@ import color from 'color';
 import Icon from './Icon';
 import Paper from './Paper';
 import Text from './Typography/Text';
-import { black, white } from '../styles/colors';
+import { black, grey900, white } from '../styles/colors';
 import withTheme from '../core/withTheme';
 import type { Theme } from '../types';
 import type { IconSource } from './Icon';
@@ -368,12 +368,12 @@ class BottomNavigation<T: Route> extends React.Component<Props<T>, State> {
         useNativeDriver: true,
       }),
       Animated.sequence([
-        Animated.delay(100),
+        Animated.delay(this.props.shifting ? 100 : 0),
         Animated.parallel([
           ...routes.map((_, i) =>
             Animated.timing(this.state.tabs[i], {
               toValue: i === index ? 1 : 0,
-              duration: 200,
+              duration: this.props.shifting ? 200 : 150,
               useNativeDriver: true,
             })
           ),
@@ -462,7 +462,7 @@ class BottomNavigation<T: Route> extends React.Component<Props<T>, State> {
       backgroundColor: approxBackgroundColor = shifting
         ? colors.primary
         : theme.dark
-          ? black
+          ? grey900
           : white,
     } =
       StyleSheet.flatten(barStyle) || {};