Strange width behavior on IOS

[felippepuhle]

• I have reviewed the documentation
• I have searched existing issues
• I am using the latest React Native version

I created a custom tab component and I got a strange width behavior on IOS (Android seems to be fine). Every time I use Animated to change the current tab, the previous one loses a bit of width. I tried a lot of implementations, and all of them got the same result... The strange fact is: if I use setValue() instead of Animated.timing, the bug won't occur.

PS: I decided to create this custom tab 'cause the existing one use ScrollView to handle the 'swipe gesture'(dragging to change tab), and I use a FlatList at the tab content... This was causing a lot of onEndReached calls... see satya164/react-native-tab-view#501

Demo

Environment

Environment:
  OS: macOS High Sierra 10.13.4
  Node: 8.9.0
  Yarn: 0.24.6
  npm: 5.7.1
  Watchman: 4.9.0
  Xcode: Xcode 9.1 Build version 9B55
  Android Studio: 3.1 AI-173.4670197

Packages: (wanted => installed)
  react: ^16.3.0 => 16.3.2
  react-native: 0.55.4 => 0.55.4

Steps to Reproduce

See https://snack.expo.io/rksdq1qCf

Expected Behavior

Don't change tab width whenever I change the current tab.

Actual Behavior

Every time I change the tab, the previous one lost some width, overriding my style

[RomualdPercereau]

It looks like the bug only occurs then:
useNativeDriver: false

[felippepuhle]

already tried to set uesNativeDriver: true, but it seems native driver doesn't support color style prop 😢

[felippepuhle]

fixed! used translateX instead of left, marginLeft and others... 😄