问题标签 [react-animated]

React-Native Animated 文档将此示例显示为使 Animated.Value (_panX) 跟踪平移手势的一种方式：

同样，Animated.event 文档说我可以传递第二个配置参数，其中：

useNativeDriver：为真时使用本机驱动程序。默认假。

不幸的是，这样做似乎被打破了：

特别是，因为PanResponder.create具有执行以下操作的onResponderMove功能：

这会导致错误，当它被视为config.onPanResponderMove一个函数时，当它实际上是一个对象时......

难道我做错了什么？还是在进行手势跟踪useNativeDriver时不受支持？Animated.Value要是能像这样无缝地跟踪鼠标就好了……

我正在尝试创建一个类似于 Snackbar 的状态消息组件，其签名如下所示：

当“open”设置为 true 时，消息应该在屏幕上显示动画，在屏幕上停留一段时间，然后再次关闭。

因此，下面的代码可以正常工作，除了在一个相当常见的用例中：当调用组件在旧消息动画关闭屏幕之前设置新消息时。在这种情况下，下面的代码只是替换当前显示的消息并使用相同的计时器。

理想情况下，当添加新消息时，应该首先使旧消息在屏幕外显示动画，然后在新消息中显示动画。（即使新消息文本与旧消息文本相同，我也想确保它这样做。）

我似乎无法弄清楚如何做这样的事情。我最好的猜测是 StatusMsg 实际上应该是一个工厂，用于创建包含消息的动画视图，但我不知道如何使其工作。具体来说，如何使先前的消息在创建新消息时自行关闭。

我想做一个动画标题。

1. 我创建了一个 FlatList 的动画组件，
2. 使用onScroll函数更新动画值。
3. 使用绝对位置放置一个视图 (Animated.View) 作为动画 FlatList 上方的标题。
4. 最后，使用变换属性插入动画值以更改视图 (Animated.View)。

动画效果很好，但动画一点也不流畅。

我看到了这个问题如何使用scrollEventThrottle有助于平滑度。所以我认为使用 FlatList 会很顺利，但事实并非如此。如果按下时滚动，则很流畅。但是如果你滚动并离开手指，它会很跳跃（我不知道如何描述它。对不起）。滚动很流畅，但动画视图（标题）动画一点也不流畅。

环境

• 反应：16.0.0-alpha.12，
• 反应原生：^0.47.0，
• 节点：v7.7.3
• npm：4.1.2
• 纱线：0.21.3

目标平台： iOS和Android

构建工具： expo

链接到小吃演示

更新

因此，我尝试使用 ScrollView 实现相同的功能。但是，我认为，与 FlatList 相比，使用 ScrollView 的情况更糟。

这是世博小吃演示：Animated ScrollView Header

我想我需要先提一下我是如何来到这里的。因此，我尝试通过Medium 中的一个非常好的教程以及观看Brent 的这个很棒的 youtube react conf viedo来实现这一点。但是，youtube 视频上使用的确切代码具有相同的效果。另外，在 Medium 教程中，作者给出了一个指向他的expo Animated header 链接的链接，效果非常好。但是当我复制粘贴代码时，相同的代码无法顺利运行。所以，我认为问题在于反应或反应本机版本。如果我有任何新的更新，我会更新。谢谢你。

出于某种原因，我无法看到我的代码做错了什么。正如文档所示，我似乎正在使用 Animated ，但此错误不断出现。代码片段：

我正在尝试在呈现 ScrollView 的屏幕上创建自定义 NavBar。在 NavBar 内部，有一个按钮，当按下该按钮时，会导致 NavBar 向下平移，从而呈现出 NavBar 正在扩展的外观（使用选项完成此操作Animated.spring()）useNativeDriver。一切都很好，除非在点击按钮时 ScrollView 仍在滚动（即：当“动量”滚动发生时）。在这种情况下，启动 NavBar 动画的 onPress 处理程序按预期调用，但调用Animated.spring()不会导致任何动画发生。是否可以在滚动期间发生 NavBar“扩展”动画，或者暂停滚动以允许动画继续？

我有 2 张卡片，点击时可以翻转。目前，当任何一张牌被点击时，两张牌都在翻转。我只想翻转被抽出的牌。如何完成这项工作？示例代码可在此处获得https://snack.expo.io/rkBr-Ezpb

我看到许多移动应用程序具有用户可以绘制一个正方形来指示要在图像上标记的内容的功能。

我正在构建Face Tagging应用程序，基本上用户在图像上的人脸边界上绘制正方形。

我用谷歌搜索了很多次，但我不确定 RN 是否有一些用于标记的功能库。

我怎样才能做到这一点？有没有什么好的图书馆可以在图像上绘制正方形？如果我能记住它的坐标宽度、高度和矩形的位置就更好了。

任何想法或建议将不胜感激！

这是下面的示例

我有两个平面列表，一个包含数据（dataScroll），另一个包含每个数据项的复选框（checkScroll）。

这样做的原因是，当用户在 dataScroll 上水平滚动时，复选框必须始终可见（我将 dataScroll 放在可水平滚动的滚动视图中）。

演示：

世博小吃演示

到目前为止尝试过：

在 dataScroll 的滚动事件中，我得到了 y 偏移并将 checkScroll 移动到那个 y 位置。

它（几乎）完成了这项工作，但是滚动时 2 个平面列表之间存在巨大延迟。

--

我读到可能是使用动画组件的方式，但我无法弄清楚动画在本机反应中是如何工作的。

因此，我想就如何将两个平面列表绑定在一起获得一些帮助，以便如果我在一个列表上滚动，另一个列表会跟随它而没有（或至少最小）延迟。

如果只有 dataScroll flatlist 是可滚动的，那也没关系。

过去两天我一直在尝试解决问题，它在 iOS 上运行良好

这个组件是 child ，在 parent 中这样使用：<FeedBack ref={ref => this.feedback = ref}/>没有任何条件检查是否显示（因为动画比例在构造函数中设置为零，所以不需要）

toggle()按下按钮时，从父级调用该方法。

现在this works fine on iOS，当组件加载时，视图不存在，直到按下按钮（然后缩放）。但是在android组件加载时，视图已经存在。当我按下按钮时，动画视图消失并重新出现（带有动画缩放），随后的切换工作正常。android中的问题是即使initialValue比例为零，视图在第一次加载时仍然存在。

我面临一个任务，我想在背景图像上放置一个可拖动的标记，然后在背景图像中获取标记的坐标。

我已经按照这个简洁的教程使用Animated.Image,PanResponder和Animated.ValueXY. 问题是我无法弄清楚如何将可拖动视图限制为仅在其父级（背景图像）的边界内移动。

很感谢任何形式的帮助 ：）

最好的问候
Jens