问题标签 [react-native-reanimated]

在 react-native 中开发自定义滑块组件时，我遇到了一个非常烦人的问题。在我的应用程序中只使用一个滑块时，一切都很好。但是如果我添加多个滑块，问题就开始了：如果先使用一个滑块，然后在完成动画后，我再次使用相同的滑块，一切都很好。但是，如果我在第一个滑块之后使用另一个滑块，然后再次使用第一个滑块，滑块旋钮会跳到一个随机位置。如果我不使用 react-native-reanimated 中的“diffClamp”功能，那么即使使用多个滑块，问题也不会发生。但我需要 diffClamp 来限制滑块旋钮的空间。我无法弄清楚为什么组件会这样。我使用 react-native-reanimated 库以及 react-native-linear-gradient 库作为滑块的背景。

我在下面提供了一个最小的工作示例：

自定义滑块.js：

应用程序.js：

SliderStyleSheet.js：

也许有人遇到过同样的问题。如果有人能回答，我将不胜感激。

谢谢和问候！

我想从下到上滑动一个盒子。我曾经diffClamp限制滑块的距离。我尝试了很多方法来做到这一点，但找不到解决方案。

在下面的代码片段中，我能够从上到下滑动。在那我也发现了一个问题。另外，当我第二次尝试滑动时，它会从头开始滑动，而不是从当前位置开始滑动。请给我一个解决这两个问题的方法。

零食代码示例

我制作了一个自定义滑块，可以在这里看到。

问题在于以下代码段

当手势处于活动状态时，我可以限制滑块的范围，但在手势完成时我无法设置限制。

我尝试在 中添加diffClamp该set方法cond，但这会将旋钮的位置固定到开头，并且整个滑块的行为方式很奇怪。

任何帮助将非常感激。

伙计们我试图模拟 Instagram 个人资料，react-native-reanimated通过长按来预览照片，而不是PanGestureHandler我们可以喜欢这张照片。但是我在这里遇到了困难，当我想长按照片时，我想将当前按下的图像更改为状态，因此弹出窗口将呈现当前按下的照片，但 PanGestureState立即更改为CANCEL并结束流。如果我不这样做setState，所有手势处理程序都运行良好..

请帮助，我是 react-native-reanimated 的新手，人们对此并没有太多分享

这是我渲染单个照片组件的代码...

我有一个react-native使用react-native-reaniamted.

你可以在这里找到小吃。

问题：

该组件在动画开始之前会短暂闪烁，导致用户体验不佳。我认为问题出在下一行，它设置了strokeDashoffset值，但不知道如何解决它。

我可以确认，当动画开始时， 的值α为零，因此 的值strokeDashoffset也为 0，这应该隐藏圆圈，但它没有这样做。

我正在使用react-native-reanimated和react-native-gesture-handler库开发动画。当我打开页面时，它按预期工作。但是当我使用快速挂钩或hook在函数中更改任何数据时。的值posX正在被重置。即使它出现在debug 'in the event, it does not update the data inAnimated.View` 中。

我试图让我的标签栏在使用动画向下滚动时消失。如果最后一个 y 坐标大于当前 y 坐标，则 onScroll 发送布尔值，它向上滚动，否则向下滚动。如果我继续向下滚动 onScroll 仍然会向我的函数发送真正的价值，并且动画会不止一次地工作。我如何禁用位置，以便只有 toValue 才能工作，并且我的函数不会一次又一次地触发，而从 onScroll 返回的布尔值是相同的。

我对 RN 有点陌生，我很难追踪“超出最大堆栈调用”。我知道该错误与我的代码中发生的某种无限循环有关，但我找不到它。

代码

事件画面：

可折叠标题栏：

错误

到目前为止我所了解的

• 该错误似乎与我将来自 EventScreen 的 react-native-reanimated 值传递给 CollapsibleHeaderBar 有关
• react-native-reanimated 值本身正在工作，因为它在 EventScreen 上使用（请参阅高度插值）
• 该问题似乎也与 CollapsibleHeaderBar 上的插值有关
• 从 EventScreen 中注释掉 CollapsibleHeaderBar 可以解决问题
• 在 CollapsibleHeaderBar 中用插值组件注释掉样式也可以解决问题
• 在 CollapsibleHeaderBar 的渲染阶段之后，代码显然停止工作
• 我见过这种跨组件动画的其他例子，所以理论上应该是可能的
• onScroll 事件永远不会被触发（显然错误发生在之前）
• 每个渲染函数只调用一次，所以没有循环

谢谢你的帮助。

当用户拖动具有特定滑动长度的容器时，我正在尝试执行触觉反馈。因此，使用以下代码，我试图在用户使用事件侦听器拖动容器时获取 translateY 的值：

我的代码没有触发onPan函数，我在这里做错了什么？如何正确获取此侦听器值？

我正在使用 PanGestureHandler 并想注销正在跟踪的值。

在方法中使用 console.log 会call流式传输正确的值，但使用 setState 不会正确更新。

我尝试使用 ref 值而不是无济于事。

有人可以指出我正确的方向吗？