问题标签 [react-animated]

此动画异常仅影响 iOS - Android 按预期执行动画事件。动画只是<Animated.View/>用动画margin-top或top值隐藏和显示 ，但在大约 4 次动画之后，里面的元素<Animated.View/>完全消失了，我只剩下<Animated.View/>.

为了说明这一点，这里有一些截图：

然后我就只能和 no Balloons 玩捉迷藏了。:(

这是代码，非常简单的Animated.timing调用，没什么花哨的..

你可以想象，其他一切都和蜜蜂一样正常。动画在 Android 上运行完全正常，但在 iOS 上却发生了这种情况……为什么？我已经尝试过transform: [{translateY: this.animatedTop}]了，但是在文本不透明后留下了一个空白空间。我希望它离开屏幕，但它拒绝回来。为什么？！？

我有一些状态变量要为用户微交互设置动画。这些变量不是视图的属性或样式属性；它们实际上是 SVG 的属性，例如圆半径（使用 react-native-svg）。我已经使用 window.requestAnimationFrame 来为这些圆圈设置动画，并且效果非常流畅，但我想获得 React.Animated 和 Easing 的功能，如果可能的话，可能会减少一些代码。

所以我正在努力让 Animated.timing(...).start() 更新每一帧的状态，以便进行渲染。

在事件处理程序中，我有类似的东西：

这样就设置了动画。现在在我的 render() 代码的某个地方，我有：

现在因为我的半径Animated.Value 不是 Animated.View 道具的一部分，我猜它不会生成补间帧。我确实从 Animated.timing(..).start(callback) 中得到了“完成”消息，但显然因为没有任何东西直接连接到修改我的状态，所以我没有接到渲染补间的调用。那么如何让 Animated.timing() 修改我的状态？

我尝试将 Svg 转换为动画控件，但这实际上使 iOS 模拟器崩溃到主屏幕（没有红屏异常错误）。

是否有来自 Animated.timing(...) 的回调，我可以设置为然后调用 setState()？

上面的代码非常伪，试图让问题保持轻松。

我有一个我认为非常简单的 Animated.View 和 Animated.Value 用法来控制滑动打开菜单栏的位置。我试图将 Animated.timing() 放在构造函数 componentWillMount、componentDidMount; 这些选项都没有奏效。打击配置的错误是：Attempted to assign readonly property

如果我将 Animated.timing() 移动到构造函数，我得到：you attempted to set the key on an object that is meant to be immutable.

这是我当前的代码：

同一个项目在 iOS 模拟器上运行 60FPS，但在 android 模拟器中一切都很慢。我什么都不做，但帧速率从 53 跳到 56。JS FPS 和 UI FPS 总是相同的。我创建了动画组件，当我点击它时，一切都在 iOS 上顺利运行（~60FPS），但 android 的 JS FPS 和 UI FPS 下降到 10FPS。正常吗？我已经阅读了链接。调试模式已关闭，代码中没有任何 console.log()。我插入Android手机，界面变得更流畅，但是当我开始动画时JS FPS下降到~14。React Native 中的动画使用原生线程。这怎么可能？我应该应用一些调整吗？

PS Mac Mini 2012 年末，四核 i7，16Gb RAM，SSD。AVD：Pixel XL，Android 6，x86，API 23，2048Mb RAM，图形 - 硬件 GLES 2.0，多核 CPU 4。据我所知，使用了 HAXM...

我想制作一个动画，其中图像应该同时缩放并移动到中心。但是，最终的位置是不正确的。如果我没有规模，翻译工作完美。我想使图像居中，所以 (screenW / 2 - IMAGE_RADIUS * SCALE) 应该是正确的。

(1) 之前：https ://ibb.co/efjAW8 ，(2)：之后：https ://ibb.co/bUL64T

代码：

我怎样才能做到这一点？我尝试过矩阵转换和 setNativeProps 但失败了。这应该是一件很简单的事情...

我试图获取animated.Value选项useNativeDriver设置为 true 的当前值，但它不起作用。将其他具有相同选项的动画值设置为 false，它可以完美运行。

我正在尝试在 Animated Api 中使用 interpolate 函数，当我使用 Image 组件时，这是可行的，但是当我使用 Animated.Image 时，什么也没有出现，或者如果我用一个值硬编码旋转它也不起作用或抛出错误.

我正在尝试在 react-native 上使用scrollToIndex功能。FlatList但是，当我切换FlatList到 时createAnimatedComponent(FlatList)，它ref变为undefined.

有没有办法在我使用时保留FlatList？refcreateAnimatedComponent

谢谢你的关心。

我的 React Native 应用程序中有一个覆盖视图，当用户按下按钮时，我需要在屏幕上和屏幕外设置动画。我知道如何定位视图并为其设置动画，但我不知道如何触发动画。

我的 redux 商店有一个非常简单的状态，带有一个 isOpen 标志，表示面板是打开还是关闭。我将状态映射到面板组件的道具，当 isOpen 道具发生变化时，我想触发打开或关闭动画。显然，如果用户在动画中间按下切换按钮，则需要取消当前正在运行的动画。

这应该很简单，但我找不到任何例子。任何帮助将非常感激。

我试图让这个组件在安装时移入但得到

这是一个简化的代码（我已经准备好了所有的 CSS 类）：

https://codesandbox.io/s/rj5046zxoo