MotionLayout系列之四

在改变路径的同时我们也可以对路径上的view进行缩放、平移、旋转、透明度的变化等。这是通过KeyAttribute实现的。他可以配合一起使用，也可以单独使用 它可以改变的属性如下

比如实现如下效果

代码为

<KeyFrameSet>
    <KeyPosition
            app:framePosition="25"
            app:motionTarget="@id/moon"
            app:keyPositionType="parentRelative"
            app:percentY="0.6"
    />
    <KeyPosition
            app:framePosition="50"
            app:motionTarget="@id/moon"
            app:keyPositionType="parentRelative"
            app:percentY="0.5"
    />
    <KeyPosition
            app:framePosition="75"
            app:motionTarget="@id/moon"
            app:keyPositionType="parentRelative"
            app:percentY="0.6"
    />

    <!-- KeyAttributes modify attributes during motion -->
    <KeyAttribute
            app:framePosition="50"
            app:motionTarget="@id/moon"
            android:scaleY="2.0"
            android:scaleX="2.0"
            android:rotation="-360"
    />
    <KeyAttribute
            app:framePosition="100"
            app:motionTarget="@id/moon"
            android:rotation="-720"
    />
    <KeyAttribute
            app:framePosition="85"
            app:motionTarget="@id/credits"
            android:alpha="0.0"
    />
</KeyFrameSet>

上面所说的KeyAttribute只能更改view的那几个特定的属性，如果想要修改view的其他属性，就得用到CustomAttribute。它是KeyAttribute中的标签，在它的内部必须指名两个属性

• app:attributeName：在这个view中所定义的setter方法的名字，比如下面的例子则是调用drawable中的setColorFilter
• app:customXXXValue：这个属性所对应参数值的类型，这里一共有如下几种，Color、Integer、Float、String、Dimension、Boolean

比如改变月亮的颜色

<KeyAttribute
        app:framePosition="0"
        app:motionTarget="@id/moon">
    <CustomAttribute
            app:attributeName="colorFilter"
            app:customColorValue="#FFFFFF"
    />
</KeyAttribute>
<KeyAttribute
        app:framePosition="50"
        app:motionTarget="@id/moon">
    <CustomAttribute
        app:attributeName="colorFilter"
        app:customColorValue="#FFB612"
    />
</KeyAttribute>
<KeyAttribute
        app:framePosition="100"
        app:motionTarget="@id/moon">
    <CustomAttribute
            app:attributeName="colorFilter"
            app:customColorValue="#FFFFFF"
    />
</KeyAttribute>

当然之前的那些KeyPosition以及KeyAttribute修改rotate及scale的都得要

此效果完整的KeySet如下

<KeyFrameSet>
    <KeyPosition
            app:framePosition="25"
            app:motionTarget="@id/moon"
            app:keyPositionType="parentRelative"
            app:percentY="0.6"
    />
    <KeyPosition
            app:framePosition="50"
            app:motionTarget="@id/moon"
            app:keyPositionType="parentRelative"
            app:percentY="0.5"
    />
    <KeyPosition
            app:framePosition="75"
            app:motionTarget="@id/moon"
            app:keyPositionType="parentRelative"
            app:percentY="0.6"
    />
    <KeyAttribute
            app:framePosition="50"
            app:motionTarget="@id/moon"
            android:scaleY="2.0"
            android:scaleX="2.0"
            android:rotation="-360"
    />
    <KeyAttribute
            app:framePosition="100"
            app:motionTarget="@id/moon"
            android:rotation="-720"
    />
    <KeyAttribute
            app:framePosition="85"
            app:motionTarget="@id/credits"
            android:alpha="0.0"
    />
    <KeyAttribute
            app:framePosition="85"
            app:motionTarget="@id/credits"
            android:alpha="0.0"
    />
    <KeyAttribute
            app:framePosition="0"
            app:motionTarget="@id/moon">
        <CustomAttribute
                app:attributeName="colorFilter"
                app:customColorValue="#FFFFFF"
        />
    </KeyAttribute>
    <KeyAttribute
            app:framePosition="50"
            app:motionTarget="@id/moon">
        <CustomAttribute
            app:attributeName="colorFilter"
            app:customColorValue="#FFB612"
        />
    </KeyAttribute>
    <KeyAttribute
            app:framePosition="100"
            app:motionTarget="@id/moon">
        <CustomAttribute
                app:attributeName="colorFilter"
                app:customColorValue="#FFFFFF"
        />
    </KeyAttribute>
</KeyFrameSet>

如果不插入KeyAttribute，那么这个CustomAttribute标签可以直接写在ConstraintSet中的Constraint标签里，比如这样

<ConstraintSet android:id="@+id/start">
    <Constraint
        android:id="@id/button"
        android:layout_width="64dp"
        android:layout_height="64dp"
        android:layout_marginStart="8dp"
        motion:layout_constraintBottom_toBottomOf="parent"
        motion:layout_constraintStart_toStartOf="parent"
        motion:layout_constraintTop_toTopOf="parent">
        <CustomAttribute
            motion:attributeName="BackgroundColor"
            motion:customColorValue="#D81B60" />
    </Constraint>
</ConstraintSet>