反应原生标签导航动画

Question

我已经使用以下代码实现了启用动画的 tabnavigator（为了便于阅读，省略了图标代码）。

正如您在导航中看到的那样，当我单击每个选项卡（例如，第一个选项卡，然后是第 5 个选项卡）时，中间的图标都更改了颜色。有没有办法在启用动画的同时“跳”到选项卡？

const FirstStack = createTabNavigator(
  {
    Home: { screen: Home },
    List: { screen: List },
    Check: { screen: Check },
    Open: { screen: Open },
    Settings: { screen: Settings }
  },
  {

    tabBarOptions: {
      activeTintColor: "#00af9d",
      inactiveTintColor: "grey",
      style: {
        backgroundColor: "white",
        paddingTop: 10
      },
      showLabel: false
    },
    animationEnabled: true
  }
)

Answer 1

正如文档中针对反应​​导航所述，要在底部选项卡中启用动画，您需要材料设计选项卡，您可以在此处了解它们以及如何安装它们