如何使用 MotionLayout 调整 TextView 的大小

Gil*_*eig 7 android android-collapsingtoolbarlayout android-motionlayout

我正在尝试CollapsingToolbar使用MotionLayout.

我已经成功地将所有内容动画化为CollapsingToolbar具有高度灵活性的行为,这意味着我可以轻松创建出色的动画而无需编写大量代码。

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

我目前使用的ConstraintLayout版本2.0.0-beta3

试验#1

CustomAttributetextSize

<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>
Run Code Online (Sandbox Code Playgroud)
<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>
Run Code Online (Sandbox Code Playgroud)

结果

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


试验#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>
Run Code Online (Sandbox Code Playgroud)
<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>
Run Code Online (Sandbox Code Playgroud)

结果

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


我更喜欢继续使用,MotionLayout因为使用创建流畅而详细的动画CollapsingToolbar是一场噩梦。

小智 5

我使用了试用 2 -“缩放”方法,并在实际 XML 布局中(不是在 MotionScene XML 上)设置了以下 textview 属性。

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

这会更改文本视图缩放所围绕的枢轴点。