MotionLayout

MotionLayout è una sottoclasse di ConstraintLayout, e consente di aggiungere animazioni direttamente nell’interfaccia utente, senza dover scrivere molto codice. Le animazioni possono includere scorrimenti, tocchi, rotazioni ed altro ancora. I componenti principali sono:
<MotionScene>: definisce tutta l’animazione.
<ConstraintSet>: definisce l’aspetto iniziale e finale dell’ animazione.
<Transition>: si collega a due constraintSet attivando l’animazione tra di essi.
<KeyFrameSet>: consente di creare movimenti più complessi.
Qui un esempio:

res/layout/activity_main.xml
<?xml version=”1.0″ encoding=”utf-8″?>
<androidx.constraintlayout.motion.widget.MotionLayout xmlns:android=”http://schemas.android.com/apk/res/android&#8221;
    xmlns:app=”http://schemas.android.com/apk/res-auto&#8221;
    xmlns:tools=”http://schemas.android.com/tools&#8221;
    android:layout_width=”match_parent”
    android:layout_height=”match_parent”
app:layoutDescription=”@layout/activity_scene”
    tools:context=”.MainActivity”>

    <View
        android:layout_width=”wrap_content”
        android:layout_height=”wrap_content”
        android:id=”@+id/view”
        android:background=”#FFBB86″/>

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

res/layout/activity_scene.xml
<MotionScene xmlns:android=”http://schemas.android.com/apk/res/android&#8221;
xmlns:motion=”http://schemas.android.com/apk/res-auto”&gt;
<Transition
motion:constraintSetStart=”@+id/start”
motion:constraintSetEnd=”@+id/end”
motion:duration=”100″
motion:motionInterpolator=”easeIn”>

<OnSwipe
motion:dragDirection=”dragRight”
motion:touchAnchorId=”@+id/view”
motion:touchAnchorSide=”@+id/right”/>

<KeyFrameSet>
  <KeyAttribute
android:rotation=”180″
android:scaleX=”3″
android:scaleY=”-3″
motion:framePosition=”20″
motion:motionTarget=”@id/view”/>
  <KeyPosition
motion:framePosition=”20″
motion:keyPositionType=”deltaRelative”
motion:motionTarget=”@id/view”
motion:percentY=”-0.5″/>
</KeyFrameSet>
</Transition>

<ConstraintSet
android:id=”@+id/start”>
<Constraint
android:id=”@+id/view”
android:layout_width=”50dp”
        android:layout_height=”50dp”
motion:layout_constraintBottom_toBottomOf=”parent”
        motion:layout_constraintStart_toStartOf=”parent”
        motion:layout_constraintTop_toTopOf=”parent”>
</Constraint>
</ConstraintSet>

<ConstraintSet
android:id=”@+id/end”>
<Constraint
android:id=”@+id/view”
android:layout_width=”50dp”
        android:layout_height=”50dp”
motion:layout_constraintBottom_toBottomOf=”parent”
        motion:layout_constraintEnd_toEndOf=”parent”
        motion:layout_constraintTop_toTopOf=”parent”>
</Constraint>
</ConstraintSet>

</MotionScene>