Android中使用MotionLayout实现动画

每天学一点2021.8.24（Android-4）

今天所要分享的是Android中实现类似gif动画，通过xml配置实现一些动画效果。显示效果如下所示：

实现步骤

1. 创建布局文件

<?xml version="1.0" encoding="utf-8"?>
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.motion.widget.MotionLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:padding="10dp"
    app:layoutDescription="@xml/activity_main_scene"
    tools:context=".MainActivity">

    <TextView
        android:id="@+id/tv_textview"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="25sp" />
</androidx.constraintlayout.motion.widget.MotionLayout>

其中tv_textview为应用动画的控件。

2. 创建动画配置文件

通过MotionLayout标签创建动画效果，设置app:layoutDescription 属性来配置动画。配置动画的xml文件需要在res的xml文件夹中进行创建，该文件位置如下图所示。

• ConstraintSet标签： 指定所有视图在运动序列中某一点处的位置和属性，一般情况下需要创建起始和终止两个状态。
• Constraint标签： 指定运动序列中其中一个元素的位置和属性，需要配置应用动画view的id。
• Transition标签： 指定运动序列的开始和结束状态、任何所需的中间状态以及触发该序列的用户交互，constraintSetStart属性用于配置起始状态，constraintSetEnd用于配置终止状态，duration属性用于配置动画所执行的时间。
• OnClick标签：指定当用户点按特定视图时要执行的操作。单个 Transition 可以具有多个 onClick 节点，其中每个 onClick 可指定一个不同的目标视图和一个在点按此视图时要执行的其他操作。
  motion:targetId
  受监控的视图。当用户点按此视图时，将会发生转换。
  motion:ClickAction
  点按视图时要执行的操作。支持的值包括：
  transitionToStart
  为从当前布局到 元素的 motion::constraintSetStart 属性指定的布局添加动画效果。
  transitionToEnd
  为从当前布局到 元素的 motion:constraintSetEnd 属性指定的布局添加动画效果。
  jumpToStart
  从当前布局跳转到 元素的 motion::constraintSetStart 属性指定的布局。
  jumpToEnd
  从当前布局跳转到 元素的 motion:constraintSetEnd 属性指定的布局。
  toggle
  如果布局当前处于开始状态，请将动画效果切换为结束状态；否则，请将动画效果切换为开始状态。

到此就能够实现如上展示的效果，想要实现更多的动画效果可以参考官方文档，希望所分享的东西能够帮到你们。