如何用好动效元素？
在页面当中的动效要设计得自然，一般需要通过形变、运动时间及缓动曲线来实现。形变表现的是动效元素自身的质地，运动时间及缓动曲线则是表现动效元素周围的环境。
因此，要如何设置缓动曲线以及时间，让动效设计得顺畅而自然，不妨参考以下的建议：
1.linear曲线（匀速运动）除了一些特殊场景如载入、星空背景外，其实很少被使用。
2.easeIn（先缓後快）页面中的场景适用也不多，主要适用於掉落、toWhere的场景当中使用。
3.easeInOut（头尾缓、中间快）通常在需要轮转切换的场景中使用，这类动效元素的触发物件与运动物件并不是同一个元素。
4.easeOut（先快後缓）最常见的效果，其触发物件与运动物件往往是同一个。主要用在展开、收起、出现、移动等动画中。因此，当不知道要用哪个缓动曲线时，就适用这个吧。
5.曲度主要表现动效元素运动过程的力的大小，曲度越大，启示力或阻力越大。
6.回弹则表现的是动效元素运动的剧烈程度及质地。
7.动效元素运动时间一般需要控制在0.3s-0.8s之间，过长的时间会让用户感觉拖遝，不自然。
本文来自投稿，不代表科技代码立场，如若转载，请注明出处https://www.cwhello.com/44468.html
如有侵犯您的合法权益请发邮件951076433@qq.com联系删除
