Animation 反应本机TabBarIOS过渡动画?

Animation 反应本机TabBarIOS过渡动画?,animation,tabs,transition,react-native,navigator,Animation,Tabs,Transition,React Native,Navigator,是否可以对TabBarIOS渲染和显示的视图进行转换?Navigator组件有它们。 我必须通过TabBarIOS实现导航和控制,这似乎有点冗长React Native v0.21 class Tabs extends Component { constructor(props) { super(props) this.state = { tab: 1 } } render() { this.anim = new Animated.

是否可以对TabBarIOS渲染和显示的视图进行转换?Navigator组件有它们。
我必须通过TabBarIOS实现导航和控制,这似乎有点冗长

React Native v0.21

class Tabs extends Component {

  constructor(props) {
    super(props)

    this.state = {
      tab: 1
    }
  }

  render() {

    this.anim = new Animated.Value(0)

    return (
      <View style={{ flex: 1 }}>
        <TabBarIOS>
          <TabBarIOS.Item
            title="Tab 1"
            selected={this.state.tab === 1}
            onPress={() => {
              this.setState({
                tab: 1
              })

              Animated.spring(this.anim, {
                toValue: 0,
                velocity: 3,
                tension: -10, 
                friction: 1
              }).start()
            }}>
            <Animated.View style={[{
              flex: 1,
              backgroundColor: 'red',
              justifyContent: 'center',
              alignItems: 'center',
              transform: [   
                {
                  scale: this.anim.interpolate({
                    inputRange: [0, 1],
                    outputRange: [1, 4],
                  })
                },
                {
                  translateX: this.anim.interpolate({
                    inputRange: [0, 1],
                    outputRange: [0, 500],
                  })
                },
                {
                  rotate: this.anim.interpolate({
                    inputRange: [0, 1],
                    outputRange: [
                      '0deg', '360deg'
                    ],
                  })
                },
              ]
            }]}>
              <Text>Tab 1</Text>
            </Animated.View>
          </TabBarIOS.Item>
          <TabBarIOS.Item
            title="Tab 2"
            selected={this.state.tab === 2}
            onPress={() => {
              this.setState({
                tab: 2
              })
            }}>
            <Text>Tab 2</Text>
          </TabBarIOS.Item>
        </TabBarIOS>
      </View>
    )
  }
}
类选项卡扩展组件{
建造师(道具){
超级(道具)
此.state={
表:1
}
}
render(){
this.anim=新的动画.Value(0)
返回(
{
这是我的国家({
表:1
})
动画。春天(this.anim{
toValue:0,
速度:3,
张力:-10,
摩擦:1
}).start()
}}>