Motion Layout - 为 Transition constraintSetEnd 和 constraintSetStart 使用两个布局文件时，文本大小不会改变

Question

我有两个布局文件，用于使用运动布局进行开始和结束转换。

文本按照预期移动，基于开始布局文件到结束布局文件。但是文本大小不会改变，即使在两种布局中定义了不同的文本大小。

有人可以帮忙吗？文件已提供如下：

motion_layout_start.xml

<androidx.constraintlayout.motion.widget.MotionLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:showPaths="true">


        <TextView
            android:id="@+id/title"
            android:layout_width="@dimen/match_constraints"
            android:layout_height="wrap_content"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintBottom_toTopOf="@id/description"
            android:text="HEADING"
            style="@style/TextStyle.Title"
            app:layout_constraintVertical_chainStyle="packed"
            app:layout_constraintVertical_bias="0"/>

        <TextView
            android:id="@+id/description"
            android:layout_width="@dimen/match_constraints"
            android:layout_height="wrap_content"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/title"
            app:layout_constraintBottom_toTopOf="@+id/recycler_view"
            tools:text="DESCRIPTION"
            style="@style/TextStyle.DESC"/>


        <androidx.recyclerview.widget.RecyclerView
            android:id="@+id/recycler_view"
            android:layout_height="@dimen/match_constraints"
            android:layout_width="match_parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/description"
            app:layout_constraintBottom_toBottomOf="parent" />



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

motion_layout_end.xml

<androidx.constraintlayout.motion.widget.MotionLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:showPaths="true">


        <TextView
            android:id="@+id/title"
            android:layout_width="@dimen/match_constraints"
            android:layout_height="wrap_content"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintBottom_toTopOf="@id/recycler_view"
            android:text="HEADING"
            style="@style/TextStyle.SmallTitle"
            app:layout_constraintVertical_chainStyle="packed"
            app:layout_constraintVertical_bias="0"/>


        <androidx.recyclerview.widget.RecyclerView
            android:id="@+id/recycler_view"
            android:layout_height="@dimen/match_constraints"
            android:layout_width="match_parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/title"
            app:layout_constraintBottom_toBottomOf="parent" />

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

运动xml文件 fragment_motion.xml

<MotionScene xmlns:app="http://schemas.android.com/apk/res-auto">


    <Transition
        app:constraintSetStart="@layout/motion_layout_start"
        app:constraintSetEnd="@layout/motion_layout_end">

        <OnSwipe app:touchAnchorSide="top"
            app:touchAnchorId="@id/recycler_view"
            app:dragDirection="dragUp"
            app:moveWhenScrollAtTop="true"/>
    </Transition>


</MotionScene>

谢谢

Answer 1

虽然在技术上支持在两个 ConstraintLayout 之间插入 MotionLayout，但您可以通过创建一个独立的 MotionScene 来获得更多功能

上图是来自链接here的一篇非常有用的Medium文章的截图。

为了让您的文本根据需要更改大小，您可以进行一些小的更改以包含运动场景文件中的大部分功能。请注意，虽然我已尽力根据您给定的代码创建这些文件，但可能需要进行一些调整才能在您的代码中正常工作。

首先，创建一个如下所示的motionLayout文件（随便你怎么称呼，我叫我的motion_layout.xml）：

<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"
    app:layoutDescription="@xml/fragment_motion"
    tools:showPaths="true">

    <TextView
        android:id="@+id/title"
        style="@style/TextStyle.Title"
        android:layout_width="@dimen/match_constraints"
        android:layout_height="wrap_content"
        android:text="HEADING" />

    <TextView
        android:id="@+id/description"
        style="@style/TextStyle.DESC"
        android:layout_width="@dimen/match_constraints"
        android:layout_height="wrap_content"
        tools:text="DESCRIPTION" />


    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/recycler_view"
        android:layout_width="match_parent"
        android:layout_height="@dimen/match_constraints" />

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

这里有一些重要的事情需要注意。首先，请注意 MotionLayout 中的 app:layoutDescription="@xml/fragment_motion"。这定义了定义运动的位置。此外，所有约束都已从此文件中删除。这是因为现在将在运动场景中定义约束。

您需要确保在您的活动中，您膨胀的布局是上述运动布局。

接下来，我们需要为您的 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">

        <OnSwipe app:touchAnchorSide="top"
            app:touchAnchorId="@id/recycler_view"
            app:dragDirection="dragUp"
            app:moveWhenScrollAtTop="true"/>
    </Transition>

    <ConstraintSet
        android:id="@+id/start">
        <Constraint
            android:id="@id/title">
            <Layout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintTop_toTopOf="parent"
                app:layout_constraintEnd_toEndOf="parent"/>
            <CustomAttribute
                app:attributeName="textSize"
                app:customFloatValue="24"/>
        </Constraint>

        <Constraint
            android:id="@id/description">
            <Layout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintTop_toBottomOf="@+id/title"/>
        </Constraint>

        <Constraint
            android:id="@id/recycler_view">
            <Layout
                android:layout_height="wrap_content"
                android:layout_width="match_parent"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintTop_toBottomOf="@+id/description"/>
        </Constraint>

    </ConstraintSet>

    <ConstraintSet
        android:id="@+id/end">
        <Constraint
            android:id="@id/title">
            <Layout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintTop_toTopOf="parent"
                app:layout_constraintEnd_toEndOf="parent"/>
            <CustomAttribute
                app:attributeName="textSize"
                app:customFloatValue="14"/>
        </Constraint>

        <Constraint
            android:id="@id/description">
            <Layout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintTop_toBottomOf="@+id/title"/>
        </Constraint>

        <Constraint
            android:id="@id/recycler_view">
            <Layout
                android:layout_height="wrap_content"
                android:layout_width="match_parent"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintTop_toBottomOf="@+id/description"/>
        </Constraint>
    </ConstraintSet>

</MotionScene>

您会注意到 textSize 设置为标题上的 customAttribute。为 textSize 设置一个浮点值可能看起来很奇怪，但它会在幕后调用 setTextSize ，这会在将其解释为文本时自动应用可缩放像素，这是最佳实践。

如果您有任何问题，请发表评论。在this blog series

中再次有一些很好的例子