react-native - React-Native : LayoutAnimation

我正在使用react-native的LayoutAnimation来实现自定义开关组件。



我使用LayoutAnimation动画圆的运动，如下所示:

componentWillUpdate() {
  let switchAnimation = {
    duration: 250,
     update: {
       type: LayoutAnimation.Types.linear,
       property: LayoutAnimation.Properties.opacity,
     },
  };
  LayoutAnimation.configureNext(switchAnimation);
}

开关是其自己的组件。它接收使用css(justifyContent flex-start或flex-end)将圆设置在左侧或右侧的 Prop

我认为问题是，当开关更改值时，其他组件也会发生变化:即，当按下开关时:

1)切换变更

2)图标更改

3)一些文本更改

以上所有动画。我想减少动画以仅影响切换

更新:我尝试使用Animated API，但它似乎不支持动画flex属性。真的没有人广泛使用Animated API吗？

最佳答案

LayoutAnimation在后台做了很多事情。除非您愿意查看源代码，否则可以设置和更改边距值以在容器中移动圆。您可以在组件内进行所有计算，并将一些样式公开为 Prop 。