美文网首页动画Androidandroid技术
Android新控件之MotionLayout 动画管理布局简单

Android新控件之MotionLayout 动画管理布局简单

作者: 没有了遇见 | 来源:发表于2022-01-14 16:39 被阅读0次
效果

开局三连,MotionLayout 是什么?,MotionLayout 是做什么的呢????,MotionLayout 怎么用呢???

1. MotionLayout 是什么呢???

MotionLayout 是ConstraintLayout 2.0 版本以后新增的一个继承于ConstraintLayout的一个新布局

2. MotionLayout 是做什么的呢???

MotionLayout 是一种布局类型,可帮助您管理应用中的运动和微件动画。MotionLayoutConstraintLayout 的子类,在其丰富的布局功能基础之上构建而成。作为 ConstraintLayout 库的一部分,MotionLayout 可用作支持库,并可向后兼容 API 级别 14

3. MotionLayout 怎么用呢???

MotionLayout 在ConstraintLayout 2.0 包下,所以直接引用ConstraintLayout 2.0的包就可以直接因引用了

implementation 'androidx.constraintlayout:constraintlayout:2.1.2'

具体什么时候用到MotionLayout呢 ?

MotionLayout提供了对其直属的子View提供各种变换功能,所以当我们需要控制页面多个子控件伴随动效的时候MotionLayout就可以很好的完成任务了

示例:

<?xml version="1.0" encoding="utf-8"?>
<MotionScene xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:motion="http://schemas.android.com/apk/res-auto">

    <!-- 配置动画属性 -->
    <Transition
        motion:constraintSetEnd="@+id/end"
        motion:constraintSetStart="@+id/start"
        motion:duration="1000">
        <!-- 触摸属性 -->
        <OnSwipe
            motion:dragDirection="dragDown"
            motion:touchAnchorId="@+id/button"
            motion:touchAnchorSide="bottom" />
    </Transition>

    <!-- 是定义描述您的运动的各种限制条件的位置 -->
    <!-- 开始的View限制 -->
    <ConstraintSet android:id="@+id/start">
        <!-- 条件限制 -->
        <Constraint
            android:id="@+id/button"
            android:layout_width="200dp"
            android:layout_height="64dp"
            motion:layout_constraintEnd_toEndOf="parent"
            motion:layout_constraintStart_toStartOf="parent"
            motion:layout_constraintTop_toTopOf="parent">
             <!--  自定义条件限制,backgroundColor:方法名,customColorValue:参数类型 并且必须与具有
             getter 和 setter 方法的对象匹配-->
            <!-- 设置背景色 -->
            <CustomAttribute
                motion:attributeName="backgroundColor"
                motion:customColorValue="#D81B60" />
            <!--           设置文字-->
            <CustomAttribute
                motion:attributeName="text"
                motion:customStringValue="开始" />
        </Constraint>
    </ConstraintSet>

    <!-- 结束的View限制  -->
    <ConstraintSet android:id="@+id/end">
        <Constraint
            android:id="@+id/button"
            android:layout_width="200dp"
            android:layout_height="64dp"
            android:layout_marginBottom="8dp"
            motion:layout_constraintBottom_toBottomOf="parent"
            motion:layout_constraintEnd_toEndOf="parent"
            motion:layout_constraintStart_toStartOf="parent">

            <CustomAttribute
                motion:attributeName="backgroundColor"
                motion:customColorValue="#9999FF" />
            <CustomAttribute
                motion:attributeName="text"
                motion:customStringValue="结束" />
        </Constraint>
    </ConstraintSet>

</MotionScene>
        

下边介绍下MotionLayout用到的重点方法以及类

  • MotionLayout :翻译而来叫运动布局,继承于constraintlayout
    • layoutDescription: MotionLayout 的属性,引用一个 MotionScene资源文件来描述这个运动的状态
  • MotionScene: 是一个 XML 资源文件,其中包含相应布局的所有运动描述
    • ConstraintSet: 是定义描述您的运动的各种限制条件的位置

      • Constraint :添加各种数据行对View进行限制
        • CustomAttribute: 自定义属性 必须与getter() 和 setter ()方法的对象匹配
          • attributeName: 属性名字
          • customStringValue: 参数数据
            包含方法:

          从以下支持的类型中选择:
          motion:customColorValue 适用于颜色
          motion:customIntegerValue 适用于整数
          motion:customFloatValue 适用于浮点值
          motion:customStringValue 适用于字符串
          motion:customDimension 适用于尺寸
          motion:customBoolean 适用于布尔值

    • Transition: 包含运动的基本定义

      • motion:constraintSetStart:指的是运动开始的端点
      • motion:constraintSetEnd:指的是运动结束的端点
        • OnSwipe:可让您通过轻触控制运动

        motion:touchAnchorId 指的是您可以滑动并拖动的视图。
        motion:touchAnchorSide 表示我们从右侧拖动视图
        motion:dragDirection 表示拖动的进度方向
        motion:dragDirection="dragRight" 表示当您向右拖动时,进度会增加

总结

MotionLayout 整合了Android动画操作,让开发者可以处理一些相对复杂的动画页面,效果很棒,且最低兼容到API 14 .所以以后的时间,我会一点点的学习这个新控件,争取写成个系列

参考文献

1.Google的MotionLayout介绍说明

2.MotionLayout的文档简介

3.MotionLayout 源码地址

相关文章

网友评论

    本文标题:Android新控件之MotionLayout 动画管理布局简单

    本文链接:https://www.haomeiwen.com/subject/tpiacrtx.html