android - 如何使用 MotionLayout 调整 TextView 的大小

Question

我正在尝试使用 MotionLayout 创建一个 CollapsingToolbar 动画。

我已经成功地将所有内容设置为动画，使其表现得像一个高度灵活的 CollapsingToolbar，这意味着我无需编写大量代码即可轻松创建出色的动画。

无论我尝试过什么，我的问题都是；我无法以自然的方式调整标题的 TextView 的大小。

我目前正在使用 ConstraintLayout 版本 2.0.0-beta3

试验 #1

textSize 的

CustomAttribute

<ConstraintSet android:id="@+id/dish_fragment_expanded_set">

    ...

    <Constraint
        android:id="@+id/dish_fragment_title_text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="16dp"
        android:layout_marginLeft="16dp"
        android:layout_marginTop="20dp"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@id/dish_fragment_cover_image">

        <CustomAttribute
            app:attributeName="textSize"
            app:customFloatValue="24" />

    </Constraint>

    ...

</ConstraintSet>

<ConstraintSet android:id="@+id/dish_fragment_collapsed_set">

    ...

    <Constraint
        android:id="@id/dish_fragment_title_text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="12dp"
        app:layout_constraintBottom_toBottomOf="@+id/dish_fragment_navigation_icon"
        app:layout_constraintStart_toEndOf="@+id/dish_fragment_navigation_icon"
        app:layout_constraintTop_toTopOf="@id/dish_fragment_navigation_icon">

        <CustomAttribute
            app:attributeName="textSize"
            app:customFloatValue="16" />

    </Constraint>

    ...

</ConstraintSet>

结果

上面的解决方案有效，但文本在移动时闪烁，这意味着动画不流畅。

---

试验#2

scaleX & scaleY

<ConstraintSet android:id="@+id/dish_fragment_expanded_set">

    ...

    <Constraint
        android:id="@+id/dish_fragment_title_text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="16dp"
        android:layout_marginLeft="16dp"
        android:layout_marginTop="20dp"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@id/dish_fragment_cover_image"
        android:scaleX="1"
        android:scaleY="1"/>

    ...

</ConstraintSet>

<ConstraintSet android:id="@+id/dish_fragment_collapsed_set">

    ...

    <Constraint
        android:id="@id/dish_fragment_title_text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="12dp"
        app:layout_constraintBottom_toBottomOf="@+id/dish_fragment_navigation_icon"
        app:layout_constraintStart_toEndOf="@+id/dish_fragment_navigation_icon"
        app:layout_constraintTop_toTopOf="@id/dish_fragment_navigation_icon"       
        android:scaleX="0.70"
        android:scaleY="0.70"/>

    ...

</ConstraintSet>

结果

上面的解决方案改变了大小而不是布局参数，这意味着它以一种我无法将其与导航图标正确对齐的方式打破了约束。

---

我更喜欢继续使用 MotionLayout，因为使用 CollapsingToolbar 创建流畅且细节丰富的动画是一场噩梦。

Answer 1

我使用了 Trial 2 - 'scale' 方法并在实际的 XML 布局中设置了以下 textview 属性(不是在 MotionScene XML 上)。

android:transformPivotX="0sp"
  android:transformPivotY= Equal to 1/2 of the size of the text view in expanded mode (in sp).

这会更改 TextView 将围绕其缩放的轴心点。