点击上方蓝字关注我，知识会给你力量
相对于一般布局方式的笛卡尔坐标系，MotionLayout还拓展了ConstraintLayout中的相对中心布局方式，我们暂且称之为「极坐标布局」方式。
极坐标布局方式在某些场景下，比笛卡尔坐标系的建立更加方便，特别是涉及到一些圆周运动和相对中心点运动的场景。
Rotational OnSwipe
在OnSwipe的基础上，极坐标方式拓展了运动的方向，给dragDirection增加了dragClockwise和dragAnticlockwise参数，用于设置OnSwipe的顺时针滑动和逆时针滑动，这两个属性，在设置rotationCenterId后才会生效。那么借助这个，就可以很方便的实现一些圆形路径的滑动效果和动画。
通过下面这个例子，我们来看下Rotational OnSwipe的使用方法。
首先，极坐标的布局还是借助ConstraintLayout，代码如下所示。
极坐标布局就是借助layout_constraintCircle、layout_constraintCircleAngle、layout_constraintCircleRadius来确定圆心、角度和半径，从而实现极坐标的布局，接下来，再通过OnSwipe来实现圆形滑动效果。
核心就在OnSwipe中，设置rotationCenterId后，再设置滑动的方向为顺时针即可，展示如下所示。
image-20302 Relative Animation
在MotionLayout中，它进一步加强了在动画中对极坐标运动的支持，特别是一些极坐标的相对运动动画，可以通过MotionLayout，以非常简单的方式表现出来。我们举个简单的例子，一个行星环绕的动画，如下所示。
image-208867
我们可以发现，这个动画的轨迹是非常复杂的，太阳以自己为中心自传，地球绕着太阳旋转的同时还在自传，月球绕着地球旋转，卫星绕着地球旋转的同时，逐渐远离地球，靠近月球。
这样一个复杂的极坐标动画效果，虽然借助ConstraintLayout可以很方便的实现定位布局，但是运动时，却无法继续保持极坐标的依赖关系，所以，这里需要使用MotionLayout来维持运动时的极坐标约束关系。
首先，使用ConstraintLayout来完成起始布局的建立，代码如下所示。
接下来，在Scene文件中，设置相对运动关系，代码如下所示。
借助animateRelativeTo来实现Motion中的相对中心点，使用motionPathRotate来设置旋转的角度。
❝ Motion标签中的motionPathRotate和Constraint标签中的transitionPathRotate的作用，都是让其相对于Path旋转一定角度。 ❞
MotionLayout中新增的属性非常多，大家可以参考我的这些文章，从各个方面，逐个击破MotionLayout的各个难点。
向大家推荐下我的网站 https://xuyisheng.top/ 点击原文一键直达
专注 Android-Kotlin-Flutter 欢迎大家访问
本文原创公众号：群英传，授权转载请联系微信(Tomcat_xu)，授权后，请在原创发表24小时后转载。
< END >
作者：徐宜生
更文不易，点个“三连”支持一下
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 举报，一经查实，本站将立刻删除。
如需转载请保留出处：https://bianchenghao.cn/bian-cheng-ri-ji/55345.html