MotionLayout学习笔记

参考官方文档,手敲一份代码:
https://developer.android.com/training/constraint-layout/motionlayout?hl=zh-cn

滑动效果如下:


跟随手势滑动效果.gif

首先需要导包,注意是android还是androidx. androidx是

dependencies {
 implementation"androidx.constraintlayout:constraintlayout:2.0.0-beta4"
}

注意:beta2会报错
AAPT: error: resource attr/flow_horizontalSeparator not found
参考
https://github.com/android/views-widgets-samples/issues/37 改为beta4

android 则是:
dependencies {
implementation 'androidx.constraintlayout:constraintlayout:2.0.0-beta1'
}

activity_main.xml



    
    


[图片上传中...(image.png-64183b-1606878949252-0)]

res/xml/test_motion_scene.xml




    

        
    

    
        

            
        

    

    
        

            
        
    

其他 MotionLayout 属性
除了上述示例中的属性之外,MotionLayout 还包含您可能想要指定的其他属性:

app:applyMotionScene="boolean" 表示是否应用 MotionScene。此属性的默认值为 true。
app:showPaths="boolean" 表示在运动进行时是否显示运动路径。此属性的默认值为 false。
app:progress="float" 可让您明确指定转换进度。您可以使用从 0(转换开始)到 1(转换结束)之间的任意浮点值。
app:currentState="reference" 可让您指定具体的 ConstraintSet。
app:motionDebug 可让您显示与运动有关的其他调试信息。可能的值为“SHOW_PROGRESS”、“SHOW_PATH”或“SHOW_ALL”。

可以看到:

  1. showPaths的效果就是虚线和起始、结束的点。app发布需要取消显示Path.
  2. 设置2端颜色,可以看到颜色是渐变过来的。设置自定义属性,使用CustomAttribute, 必须设置motion:attributeName 和自定义属性值。属性名称必须是具备getr 和set方法的。
  3. 设置手势,可以看到手指左滑、右滑可以响应动画(从start到end和从end到start)。同样也可以设置上下滑动。
  4. 2种状态不可中断,要么变成另一种状态,要么状态恢复。
  5. 可以同时设置动画 缩放、旋转、透明、移动,以及部分属性:可见性、透明度、投影范围。
插入的属性
在 MotionScene 文件中,ConstraintSet 元素可包含在转换期间插入的其他属性。除了位置和边界之外,MotionLayout 还插入以下属性:

alpha
visibility
elevation
rotation、rotationX、rotationY
translationX、translationY、translationZ
scaleX、scaleY

6.app:motionDebug="SHOW_ALL" 显示 debug 信息。数据格式:

61.77 fps start->end(progress:38.00) state=undefined
  1. app:motionProgress="0.5" 设置初始进度,在这个案例中,就是一进去就在屏幕中间位置。
  2. motion:motionInterpolator 还可以设置动画的interpolator.

说句题外话:
markdown 模式,不能上传MP4,只能用gif代替。
解决办法:将mp4在线转换成gif并下载(搜索:mp4在线转换gif),然后将gif文件拖到文档中,复制只能复制png图片。

你可能感兴趣的:(MotionLayout学习笔记)