React native 自定义切换幻灯片动画，如何使其平滑？

我需要制作切换幻灯片动画，我几乎做到了，右边的幻灯片动画看起来非常好，但左边的幻灯片动画不流畅，有没有办法修复它

这是我的密码：

import * as Animatable from 'react-native-animatable';

 changeLogin = () => {
        if (!this.state.loginEmail){
            this.slideRight()
        } else {
            this.slideLeft()
        }
        this.setState({ loginEmail: !this.state.loginEmail })
      }

  handleViewRef = ref => this.view = ref;  

    slideRight = () => this.view.animate({ 

      0: {
        translateX: 0,
      },
      0.5: {
        translateX: 100,
      },
      1: {
        translateX: 150,
      },
      2: {
        translateX: 300,
    }  
      })


      slideLeft = () => this.view.animate({ 
        0: {
          translateX: 0,
        },
        0.5: {
          translateX: -0.3,
        },
        1: {
          translateX: -0.5,
        },
        2: {
          translateX: -1,
      }  
        })  


                    <TouchableWithoutFeedback  onPress={this.changeLogin}>
                        <View style={styles.buttonRowTop} >
                        <Animatable.View style={styles.buttonSwitch}
                        ref={this.handleViewRef}
                       >

                        </Animatable.View>
                        <View style={{flexDirection: 'row', justifyContent: 'space-between', width: 260, zIndex: 100, marginLeft: -180, marginTop: 5}}>
                            <Text style={[!loginEmail? styles.textSwitchActiveLeft: styles.textSwitchLeft ]}>Phone</Text> 
                            <Text  style={[loginEmail? styles.textSwitchInactive:styles.textSwitch]}>Email</Text> 
                        </View>
                        </View>
                    </TouchableWithoutFeedback>  

import*作为“react native Animatable”中的动画；
changeLogin=（）=>{
如果（！this.state.loginEmail）{
this.slideRight（）
}否则{
this.slideLeft（）
}
this.setState（{loginEmail:！this.state.loginEmail}）
}
handleViewRef=ref=>this.view=ref；
slideRight=（）=>this.view.animate（{
0: {
translateX:0，
},
0.5: {
translateX:100，
},
1: {
translateX:150，
},
2: {
translateX:300，
}  
})
slideLeft=（）=>这个.view.animate（{
0: {
translateX:0，
},
0.5: {
translateX:-0.3，
},
1: {
translateX:-0.5，
},
2: {
translateX:-1，
}  
})  
我更改了slideLeft功能，动画现在看起来更流畅了：

 slideLeft = () => this.view.animate({ 
        0: {
          translateX: 100,
        },
        0.5: {
          translateX: -0.3,
        },
        1: {
          translateX: -0.5,
        },
        2: {
          translateX: -1,
        }  
        })   

你能给我你的样式文件吗？