仅在视图内移动图像(Animated.Image)会产生本地React

yb3bgrhw 于 2023-01-21 发布在 React

关注(0)|答案(1)|浏览(115)

我想在视图内移动图像，但图像不应超出视图（屏幕）的边界
就像这样
https://snack.expo.dev/@aisylu24/draggable-image-within-parent-boundaries-
click to see screenshot - i want to move only inside gray view
但是我需要使用带有手势处理程序和功能组件的Animated或Reanimated
也许我需要使用布局视图，但我不知道如何做到这一点？
这是我的零食，我需要这样做：
https://snack.expo.dev/@aisylu24/lookbook
点击其中一张图片查看

react-native

来源：https://stackoverflow.com/questions/75159669/moving-the-image-animated-image-only-within-the-view-react-native

1条答案

按热度按时间

06odsfpq1#

您可以使用React本机手势处理程序来捕获事件。
https://docs.swmansion.com/react-native-gesture-handler/docs/gesture-handlers/api/pan-gh/
对于动画值，可以使用react-native中的默认Animated
对于边界固定，你需要学习插值的概念，

translateX.interpolate({
  inputRange: [0, 100], 
  outputRange: [0, 100],
}),

translateY.interpolate({
  inputRange: [0, 100],
  outputRange: [0, 100],
}),

而不是[0,100]你需要添加一个范围的基础上，你想要的面积。

赞(0）回复(0）举报 2023-01-21

我来回答

仅在视图内移动图像(Animated.Image)会产生本地React

1条答案

相关问题

热门标签

最新问答