ant-design / ant-motion

:bicyclist: Animate specification and components of Ant Design
http://motion.ant.design
MIT License
4.59k stars 358 forks source link

希望增强对 flex 的支持 #140

Closed meikidd closed 6 years ago

meikidd commented 6 years ago

ant-motion 用起来非常棒,做动画再也不蛋疼了。👍👍👍

另外有个一直比较困扰的问题,我们页面中大量的用到了 flex 布局方式,但在 flex 布局中动画会闪动,大概是因为动态插入 dom 的过程中页面元素重新渲染了。为了规避这个问题,我们不得不把 flex 布局改写掉。

下面有两个 codepen,一个是用 flex 布局,一个是用 float 布局,实现的是相同的效果,其中用 flex 实现的就会闪动。 https://codepen.io/meikidd/pen/NwJPRj https://codepen.io/meikidd/pen/qVvEjz

发现很多动画会把 dom 元素从页面删除,然后动态创建,不知道是处于什么原因。能否改成值动态显示/隐藏,而不创建/删除元素。

jljsj33 commented 6 years ago

恩,后续我会考虑一下是否将 queue-anim 增加状态切换,这块需要评估一下。。

目前我想到的如果增加状态切换,,需要考好难 queue-anim 的子级嵌套queue-anim的问题 ,是否考虑用替换掉子级的 delay 来代替。

@afc163

jljsj33 commented 6 years ago

目前你如果碰到这种问题 ,,可考虑用 tween-one.

meikidd commented 6 years ago

@jljsj33 换成 tween-one 好用

colmugx commented 6 years ago

原来是flex的问题,那页面闪得我都哭了... 感谢问题所有者曲线解决了我的问题...