remove underline animation from FacebookTabBar

it seems to be redundant there also it simplify example a lot

Author: skv-headless

examples/FacebookTabsExample/FacebookTabBar.js

@@ -4,7 +4,6 @@ import {
   Text,
   View,
   TouchableOpacity,
-  Animated,
 } from 'react-native';
 import Icon from 'react-native-vector-icons/Ionicons';
 
@@ -18,7 +17,6 @@ const FacebookTabBar = React.createClass({
   },
 
   componentDidMount() {
-    this.setAnimationValue({ value: this.props.activeTab, });
     this._listener = this.props.scrollValue.addListener(this.setAnimationValue);
   },
 
@@ -42,25 +40,17 @@ const FacebookTabBar = React.createClass({
   },
 
   render() {
-    const tabWidth = this.props.containerWidth / this.props.tabs.length;
-    const left = this.props.scrollValue.interpolate({
-      inputRange: [0, 1, ], outputRange: [0, tabWidth, ],
-    });
-
-    return <View>
-      <View style={[styles.tabs, this.props.style, ]}>
-        {this.props.tabs.map((tab, i) => {
-          return <TouchableOpacity key={tab} onPress={() => this.props.goToPage(i)} style={styles.tab}>
-            <Icon
-              name={tab}
-              size={30}
-              color={this.props.activeTab == i ? 'rgb(59,89,152)' : 'rgb(204,204,204)'}
-              ref={(icon) => { this.tabIcons[i] = icon; }}
-            />
-          </TouchableOpacity>;
-        })}
-      </View>
-      <Animated.View style={[styles.tabUnderlineStyle, { width: tabWidth }, { left, }, ]} />
+    return <View style={[styles.tabs, this.props.style, ]}>
+      {this.props.tabs.map((tab, i) => {
+        return <TouchableOpacity key={tab} onPress={() => this.props.goToPage(i)} style={styles.tab}>
+          <Icon
+            name={tab}
+            size={30}
+            color={this.props.activeTab === i ? 'rgb(59,89,152)' : 'rgb(204,204,204)'}
+            ref={(icon) => { this.tabIcons[i] = icon; }}
+          />
+        </TouchableOpacity>;
+      })}
     </View>;
   },
 });
@@ -82,12 +72,6 @@ const styles = StyleSheet.create({
     borderRightWidth: 0,
     borderBottomColor: 'rgba(0,0,0,0.05)',
   },
-  tabUnderlineStyle: {
-    position: 'absolute',
-    height: 3,
-    backgroundColor: '#3b5998',
-    bottom: 0,
-  },
 });
 
 export default FacebookTabBar;