问题标签 [react-animated]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
javascript - React-native 切换选择器效果过渡页面
我正在尝试实现 SwitchSelector,但我遇到了页面更改问题。我希望当用户通过页面内部的移动从右到左和从左到右更改页面时,页面之间会发生转换。链接:https ://snack.expo.io/Sk5GY7Je7 有人可以帮帮我吗?
react-native - 如何在 React Native 中使用 Animated 将宽度设置为自动
我有一个 40x40 的按钮,现在这个按钮有一个活动状态,按钮的容器扩展和菜单项进入。活动状态没有特定的宽度,应该扩展以适应内容(类似于width: auto;
CSS )。
有没有办法我可以使用动画这个宽度变化使用Animated
?
提前致谢
react-native - 移动对象时无法插入颜色
我有一个简单的组件,它试图将球从一个点移动到另一个点,同时将颜色从绿色变为黄色。没有错误被抛出并且球确实移动。但是我无法弄清楚哪个部分可能出错了。
我已经实现了让动画同时Animated.parallel
运行并interpolate
在borderColor
withinputRange
以及1 and 0
outputRange
这是你玩转的世博小吃
reactjs - 通过“Animated.Event”和“setValue”在 onPanResponderMove 方法中设置动画值有什么区别?
如果要使用 PanResponder 拖放元素,可以通过两种方式将移动值传递给 onPanResponderMove 方法:
1. 带动画的.Event
2. 使用 .setValue
在我的测试中,两者似乎都做同样的事情。有什么区别?
react-native - 如何使用 React Native Animate 为不同的 Svg 属性设置动画
我在 android 上使用 react-native-svg=6.3.1 和 react-native-0.55.4 。使用下面的代码,我可以成功地为圆的半径设置动画,但不能为它围绕某个点的旋转设置动画。这是什么原因。理论上,旋转动画应该与半径相同,因为它也需要一个字符串值。
react-native - 开玩笑:如何模拟动画循环?
我正在尝试为具有以下动画代码(在 componentDidMount 上调用)的动画组件运行快照测试:
我尝试使用以下内容模拟 Animated :
但是,运行测试会导致此错误:
我已经将重置模拟放在不同的地方,并检查了 React Native 中“循环”方法的源代码,但没有成功模拟它。有没有人成功地做到过这一点?
react-native - 反应导航自定义比例过渡动画,例如应用程序打开时
我想在为我的下一个屏幕按下按钮时创建缩小效果,就像从主屏幕按下应用程序并且启动屏幕出现时那样的自定义过渡。
我已经在 stackNavigator 中尝试了 transitionConfig 并使用了带有以下代码的自定义转换
我面临的问题是从屏幕中间开始缩放,所以如果我将位置作为屏幕右上角的 (237,16) 传递,我无法让 translateX 和 translateY 正确设置为下一个比例的动画screen 比屏幕尺寸小(我们正在从最后一个屏幕中按下的按钮为下一个屏幕设置动画),因此它的坐标系没有点 (237,16)。
这不是共享元素动画问题,我也尝试了反应导航文档中推荐的https://github.com/fram-x/FluidTransitions,但是在这个(从它的示例中,没有广泛的文档)我的屏幕在 FluidNavigator 下似乎从来没有标题。
animation - 在 React Native Animated 中使用 useNativeDriver 时出错
当我useNativeDriver
在 React Native Animated 中使用时
并渲染
这些错误给了我
本机动画模块不支持样式属性“底部”
和
无法在未安装的组件上调用 setState(或 forceUpdate)。这是一个空操作,但它表明您的应用程序中存在内存泄漏。要修复,请取消 componentWillUnmount 方法中的所有订阅和异步任务。
css - 基于多个值的 React Native Animated 插值不透明度
我有一个 React Native Animated.view 组件,我想根据滚动视图位置对其不透明度进行插值。但是,我想使用两个值(x 和 y)而不是一个值来插入不透明度。
这当然不起作用,因为一个不透明度值会覆盖另一个,但它清楚地表明了我想要实现的目标。