Step 5: Solution

Congratulations! You made it 🎉🎉🎉🎉🎉

There are more than one solutions especially when using a ConstraintLayout! If you're happy with what you have you don't need to make any changes.

If you've used a paw as a constraint for another one, you may encounter some weird behavior when we start the animations. Just remember this hint, and if you do, come back here and see what changes you can make to make it smoother.

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout 
    ... ...    >
    
    <de.hdodenhof.circleimageview.CircleImageView
        android:id="@+id/iv_circle"
        android:layout_width="400dp"
        android:layout_height="400dp"
        android:layout_marginStart="24dp"
        android:layout_marginBottom="8dp"
        android:src="@color/colorSun"
        app:layout_constraintBottom_toTopOf="@+id/second_bg"
        app:layout_constraintStart_toStartOf="@+id/guideline_verticalHalf" />

    <!-- Main ImageIview -->
    <!-- CardView --> 
    
    <ImageView
        android:id="@+id/iv_paw_1"
        android:layout_width="65dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="152dp"
        android:layout_marginTop="4dp"
        android:rotation="30"
        android:src="@drawable/ic_paw"
        app:layout_constraintStart_toStartOf="@id/iv_main"
        app:layout_constraintTop_toTopOf="@id/iv_main"
        tools:ignore="ContentDescription" />

    <ImageView
        android:id="@+id/iv_paw_2"
        android:layout_width="65dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="180dp"
        android:layout_marginTop="88dp"
        android:rotation="45"
        android:src="@drawable/ic_paw"
        app:layout_constraintStart_toStartOf="@+id/iv_main"
        app:layout_constraintTop_toTopOf="@id/iv_main"
        tools:ignore="ContentDescription" />

    <ImageView
        android:id="@+id/iv_paw_3"
        android:layout_width="65dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="4dp"
        android:layout_marginEnd="152dp"
        android:rotation="-30"
        android:src="@drawable/ic_paw"
        app:layout_constraintEnd_toEndOf="@+id/iv_main"
        app:layout_constraintTop_toTopOf="@id/iv_main"
        tools:ignore="ContentDescription" />

    <ImageView
        android:id="@+id/iv_paw_4"
        android:layout_width="65dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="88dp"
        android:layout_marginEnd="180dp"
        android:rotation="-45"
        android:src="@drawable/ic_paw"
        app:layout_constraintEnd_toEndOf="@+id/iv_main"
        app:layout_constraintTop_toTopOf="@id/iv_main"
        tools:ignore="ContentDescription" />
    
    <!-- Second Background View -->
    <!-- Guidelines --> 

</android.support.constraint.ConstraintLayout>