React-Native:LayoutAnimation

Question

我使用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)接收道具将圆圈设置在左侧或右侧

在我看来问题是当交换机改变值时其他组件也发生了变化:即当交换机被命中时:

1)切换更改

2)图标发生变化

3)一些文字变化

所有上述动画.我想减少动画只影响开关

更新:我尝试使用动画API,但它似乎不支持动画flex属性.是否真的没有人广泛使用动画API？

Answer 1

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