问题
I'm trying to create a CollapsingToolbar
animation using MotionLayout
.
I've successfully animated everything to behave just like a CollapsingToolbar
with a high level of flexibility, which means I can easily create awesome animations without writing a large amount of code.
My problem is no matter what I tried; I can't resize the title's TextView
in a natural way.
I'm currently using ConstraintLayout
version 2.0.0-beta3
Trial #1
CustomAttribute
of textSize
<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>
Result
The solution above works, but the text flickers on movement, which means the animation is not smooth.
Trial #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>
Result
The solution above changes the size but not the layout params, which means it breaks the constraints in a way that I can't align it correctly with the navigation icon.
I prefer to keep using MotionLayout
because creating a smooth and detailed animation using CollapsingToolbar
is a nightmare.
回答1:
I used Trial 2 - 'scale' method and set the following textview attributes in the actual XML layout (NOT on the MotionScene XML).
android:transformPivotX="0sp"
android:transformPivotY= Equal to 1/2 of the size of the text view in expanded mode (in sp).
This changes the pivot point around which the text view will scale.
来源:https://stackoverflow.com/questions/58860350/how-to-resize-textview-using-motionlayout