android - 使用 MotionLayout 和 MotionScene 更改 FAB 背景颜色

Question

我有一个 FloatingActionButton，我想使用 MotionLayout 和 MotionScene 将其转换为另一种颜色。

这是我布局文件中的FAB

<androidx.constraintlayout.motion.widget.MotionLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:id="@+id/motion_layout"
        app:layoutDescription="@xml/map_activity_scene"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

    <com.google.android.material.floatingactionbutton.FloatingActionButton
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginBottom="75dp"
            android:layout_marginEnd="32dp"
            android:id="@+id/fab"
            android:visibility="invisible"
            app:backgroundTint="@color/lightPurple"
            app:srcCompat="@drawable/ic_layers_24px"
            app:tint="@color/white"
            app:layout_constraintBottom_toBottomOf="@+id/map"
            app:layout_constraintEnd_toEndOf="parent"/>

</androidx.constraintlayout.motion.widget.MotionLayout>

这是我的 MotionScene

<MotionScene xmlns:app="http://schemas.android.com/apk/res-auto"
             xmlns:android="http://schemas.android.com/apk/res/android">
    <Transition
            app:constraintSetStart="@+id/start"
            app:constraintSetEnd="@+id/end"
            app:duration="400">

    </Transition>

    <ConstraintSet android:id="@+id/start">
        <Constraint
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginBottom="75dp"
                    android:layout_marginEnd="32dp"
                    android:id="@+id/fab"
                    android:visibility="visible"
                    app:backgroundTint="@color/lightPurple"
                    app:srcCompat="@drawable/ic_layers_24px"
                    app:tint="@color/white"
                    app:layout_constraintBottom_toBottomOf="@+id/map"
                    app:layout_constraintEnd_toEndOf="parent">

            <CustomAttribute
                app:attributeName="backgroundTint"
                app:customColorValue="@color/lightPurple" />
        </Constraint>

    </ConstraintSet>

    <ConstraintSet android:id="@+id/end">
        <Constraint
                android:id="@+id/fab"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:visibility="visible"
                app:backgroundTint="@color/map_fab_transform"
                app:layout_constraintEnd_toEndOf="@+id/revealLayout"
                app:layout_constraintStart_toStartOf="@+id/revealLayout"
                app:layout_constraintBottom_toBottomOf="@+id/revealLayout"
                app:layout_constraintTop_toTopOf="@+id/revealLayout">

            <CustomAttribute
                app:attributeName="backgroundTint"
                app:customColorValue="@color/map_fab_transform" />
        </Constraint>
    </ConstraintSet>
</MotionScene>

当我运行场景时，fab 移动到正确的位置，但颜色没有改变，图标也没有从中移除。似乎没有应用任何 app 属性。

如何使用 MotionLayout 更改 fab 的颜色并删除 fab 中的图标？

Answer 1

 app:backgroundTint="@color/lightPurple"
 app:srcCompat="@drawable/ic_layers_24px"
 app:tint="@color/white"

约束不采用任何这些标签。它只需要一组有限的标签您将必须设置具有自定义属性的那些。如果您希望 MotionLayout 插入自定义属性，您必须在开始和结束 ConstraintSet 上设置它们。