[TOC]
MotionLayout
MotionLayout 是一种布局类型,可以帮助管理应用中的运动和微件动画,是 ConstraintLayout的子类,在其丰富的布局功能基础之上构建而成。
- 缩小了布局转换与复杂运动处理之间的差距
- 同时在属性动画框架、TransitionManager和 CoordinatorLayout之间提供了各种功能。
- MotionLayout还能够让您为任何布局属性添加动画效果,支持可搜索转换,可以根据某个条件(例如触控输入)立即显示转换中的任意点。
- MotionLayout 还支持关键帧,从而实现完全自定义的转换以满足您的需求。
- MotionLayout是完全声明性的,可以使用 XML 描述任何转换。
注意:MotionLayout 仅适用于其直接子级,不支持嵌套布局层次结构或 Activity 转换。
依赖项
添加 ConstraintLayout 依赖项:要在项目中使用 MotionLayout
,请向应用的 build.gradle
文件添加 ConstraintLayout
2.0 依赖项。如果您使用了 AndroidX,请添加以下依赖项:
1 | dependencies { |
如果您没有使用 AndroidX,请添加以下支持库依赖项:
1 | dependencies { |
注意:constraintlayout 2.0.0-beta3 及以上版本才支持MotionLayout可视化编辑
创建MotionLayout
创建要显示的页面的Layout布局文件:
1 |
|
- MotionLayout作为运动处理的View的根节点
- layoutDescription属性指向一个xml文件,包含相应布局的所有运动描述,每一个MotionLayout都应该引用一个单独的MotionScene。MotionScene中的描述优先级最高。
创建MotionScene
layoutDescription需要指向一个所有运动描述的xml文件,创建MotionScene文件:
1 |
|
编辑和预览MotionScene,可以利用可视化窗口:
大致的步骤:
- 创建start和end的ConstraintSet,描述运动View的起始和结束。
- 创建Transition,设置start和end的运动描述,并设置多种运动属性。
具体内容如下:
Transition:
Transition描述运动过程,每一个MotionScene至少包含一个Transiton,描述一个动画start到end过程中的运动。Transition包含多种子标签:
OnClick 点击触发运动,clickAction设置运动模式,targetId设置目标view
OnSwipe 轻触/拖动触发运行,touchAnchorId设置目标view,根据移动该view的距离进行运动,touchAnchorSide设置跟随view的边界,dragDirection 拖动跟随的方向。
KeyFrameSet 关键帧,设置关键帧的属性,定制复杂动画
- KeyPosition:framePosition 0-100 动画执行的比例,motionTarget 更改当前设置轨迹的view,keyPositionType 运动轨迹更改相对于谁的模式,percentX/percentY 0.0-1.0 动画执行到某比例时轨迹变更的比例。
- KeyAttribute:alpha、scaleX、scaleY、rotation等
- CustomAttribute:attributeName 通过setXXX可以修改view属性的名称,比如setBackgroundColor,那么attributeName=”backgroundColor”,customColorValue 属性名对应的属性值
参考:https://codelabs.developers.google.com/codelabs/motion-layout?hl=zh-cn#5
示例Demo
详见:MotionLayout:https://github.com/gqq519/MotionLayout
参考资料: