问题标签 [layouttransition]
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.
android - LayoutTransition 高度为 0 导致视图在没有动画的情况下立即消失
给定一个始终对齐父底部的视图,最初高度为 0,我想对其进行动画处理,使其向上滑动到WRAP_CONTENT
. 我正在使用布局转换来实现这一点:
viewGroup
父母在哪里viewToAnimate
并且有animateLayoutChange=true
逻辑是:
这在视图展开时效果很好;视图很好地从底部向上滑动到其高度。但是,当高度设置为 0 时,视图会简单地消失并且不会滑入。viewToAnimate
是与 some 的相对布局TextViews
,没有什么复杂的。任何建议,将不胜感激。
视频展示效果(注意文字没有下滑,只是消失了):https ://www.dropbox.com/s/1pq7yh0bqx8ghif/2017_10_06_23_17_11.mp4?dl=0
查看动画:
java - 将一个视图移动到另一个视图的动画
我正在尝试将一个带有动画的视图移动到另一个视图,但到目前为止没有任何效果。我在RelativeLayout中有两个视图,一个视图应替换另一个视图,如下所示:我尝试了它,但它不起作用:
reactjs - framer-motion layoutTransition 在 React 中确实有效,但在 NextJS 中无效
我正在尝试将我的头包裹起来framer-motion
,这是一个非常好的动画库,我正在尝试与 NextJS 结合使用。我关注了一个 CSS 技巧 youtube 视频,该视频layoutTransition
使用此沙箱进行了解释:
https ://codesandbox.io/s/framer-motion-css-tricks-template-3-07wkh?fontsize=14&module=/src/Image.tsx&file=/ src/Image.tsx:0-783
渴望尝试一下,我复制到我的 NextJs 项目中,但我无法让它工作。我剥离了所有东西以使其更加干净,最终得到了这些沙箱:一个是 React,另一个是 NExtJS。对我来说,它们是相同的,但是使用的图像缩放layoutTransition
似乎在我的 NextJS 沙箱中不起作用,为什么?
https://codesandbox.io/s/framer-motion-image-zoom-forked-774up https://codesandbox.io/s/currying-haze-wii0m