fix: remove opacity from indicator

satya164 · Jan 1, 2017 · 6ab4991 · 6ab4991
1 parent 44ba0ee
commit 6ab4991
Show file tree

Hide file tree

Showing 3 changed files with 5 additions and 6 deletions.
diff --git a/example/src/BottomBarIconTextExample.js b/example/src/BottomBarIconTextExample.js
@@ -74,13 +74,13 @@ export default class TopBarIconExample extends Component {
   };
 
   _renderIndicator = (props) => {
-    const { width, opacity, position } = props;
+    const { width, position } = props;
 
     const translateX = Animated.multiply(position, width);
 
     return (
       <Animated.View
-        style={[ styles.container, { width, opacity, transform: [ { translateX } ] } ]}
+        style={[ styles.container, { width, transform: [ { translateX } ] } ]}
       >
         <View style={styles.indicator} />
       </Animated.View>

diff --git a/src/TabBar.js b/src/TabBar.js
@@ -61,7 +61,7 @@ const styles = StyleSheet.create({
 });
 
 type IndicatorProps = SceneRendererProps & {
-  width: number;
+  width: Animated.Value;
 }
 
 type ScrollEvent = {
@@ -311,7 +311,6 @@ export default class TabBar extends Component<DefaultProps, Props, State> {
             this.props.renderIndicator({
               ...this.props,
               width: new Animated.Value(tabWidth),
-              opacity: this.state.visibility,
             }) :
             null
           }

diff --git a/src/TabBarTop.js b/src/TabBarTop.js
@@ -68,12 +68,12 @@ export default class TabBarTop extends Component<DefaultProps, Props, void> {
   };
 
   _renderIndicator = (props: IndicatorProps) => {
-    const { width, opacity, position } = props;
+    const { width, position } = props;
     const translateX = Animated.multiply(position, width);
 
     return (
       <Animated.View
-        style={[ styles.indicator, { width, opacity, transform: [ { translateX } ] }, this.props.indicatorStyle ]}
+        style={[ styles.indicator, { width, transform: [ { translateX } ] }, this.props.indicatorStyle ]}
       />
     );
   };