position.interpolate is not a function

Amberon commented 5 years ago

Current behaviour

After upgrading to react-native 0.59 materialTopTabNavigator stopped working on android. People suggested to upgrade react-navigation-tabs (https://github.com/react-navigation/react-navigation/issues/5684) and import navigator component from there. That's what I did. Now I receive an error on ios (when trying to open the screen with materialTopTabNavigator):

TypeError: TypeError: position.interpolate is not a function

This error is located at:
    in TabBarItem (at TabBar.js:336)
    in RCTScrollContentView (at ScrollView.js:953)
    in RCTScrollView (at ScrollView.js:1092)
    in ScrollView (at createAnimatedComponent.js:217)
    in AnimatedComponent (at TabBar.js:302)
    in RCTView (at View.js:45)
    in View (at TabBar.js:301)
    in RCTView (at View.js:45)
    in View (at createAnimatedComponent.js:217)
    in AnimatedComponent (at TabBar.js:280)
    in TabBar (at MaterialTopTabBar.js:145)
    in TabBarTop (at createMaterialTopTabNavigator.js:102)
    in Pager (at TabView.js:108)

Code sample

createAppContainer
  createSwitchNavigator
    createDrawerNavigator
      reateBottomTabNavigator
        createStackNavigator
          createStackNavigator
            createMaterialTopTabNavigator

Your Environment

software	version
ios or android	ios
react-native	0.59.2
react-native-tab-view	2.0.3
react-native-gesture-handler	1.1.0
react-native-reanimated	1.0.0
node	6.9
npm or yarn	npm

xaviershay commented 5 years ago

The releasee notes suggest a fix for this (replace with Animated.interpolate), but it didn't work for me, see: https://github.com/kmagiera/react-native-reanimated/issues/235

xaviershay commented 5 years ago

Updating my previous comment (pulling in from linked issue), the fix did work except in some corner cases that can be easily handled once you know about them.

satya164 commented 5 years ago

Please open the issue in https://github.com/react-navigation/react-navigation-tabs repo with a repro if you're using that.

satya164 / react-native-tab-view