skeleton_layout_full.xml

<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:bones="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools">

    <data>
        <variable name="viewModel" type="com.eudycontreras.bones.SomeViewModel" />

        <import type="com.eudycontreras.boneslibrary.properties.ShapeType" />
        <import alias="Utils" type="com.eudycontreras.boneslibrary.extensions.NumberExtensionsKt" />
    </data>

    <androidx.constraintlayout.widget.ConstraintLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="start"
        android:layout_margin="8dp"
        android:background="@drawable/shape_section_background"
        android:clipChildren="false"
        android:clipToPadding="false"
        android:elevation="4dp"
        android:padding="10dp"
        bones:skeletonBoneColor="@{@color/bone_color}"
        bones:skeletonBoneCornerRadius="@{Utils.getDp(10)}"
        bones:skeletonBoneMaxThickness="@{Utils.getDp(12)}"
        bones:skeletonBoneMinThickness="@{Utils.getDp(10)}"
        bones:skeletonEnabled="@{viewModel.demoDataTwo.loading}"
        bones:skeletonShimmerRayColor="@{@color/bone_ray_color}"
        bones:skeletonShimmerRayCount="@{4}"
        bones:skeletonShimmerRayInterpolator="@{@android:interpolator/accelerate_quad}"
        bones:skeletonShimmerRaySharedInterpolator="@{true}"
        bones:skeletonShimmerRaySpeedMultiplier="@{1f}"
        bones:skeletonShimmerRayThicknessRatio="@{0.45f}"
        bones:skeletonShimmerRayTilt="@{-0.2f}"
        bones:skeletonTransitionDuration="@{250L}"
        bones:skeletonDissectLargeBones="@{false}"
        bones:skeletonUseStateTransition="@{true}"
        bones:skeletonAnimateRestoredBounds="@{true}"
        bones:skeletonAllowSavedState="@{true}"
        tools:background="@color/white">

        <de.hdodenhof.circleimageview.CircleImageView
            android:id="@+id/photo"
            android:layout_width="80dp"
            android:layout_height="80dp"
            android:layout_gravity="center"
            android:layout_marginStart="8dp"
            android:layout_marginTop="20dp"
            android:background="@drawable/shape_background_oval_alt"
            android:backgroundTint="@color/bone_color_alt"
            android:elevation="4dp"
            app:imageUrl="@{viewModel.demoDataOne.data.imageUrl}"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            bones:skeletonBoneStateOwner="@{true}"
            bones:skeletonBoneShadeMultiplier="@{0.9f}"
            bones:skeletonBoneShapeType="@{ShapeType.CIRCULAR}"
            bones:skeletonBoneShimmerRayColor="@{@color/bone_ray_color}"
            bones:skeletonBoneShimmerRayCount="@{3}"
            bones:skeletonBoneShimmerRayInterpolator="@{@android:interpolator/decelerate_quad}"
            bones:skeletonBoneShimmerRaySharedInterpolator="@{false}"
            bones:skeletonBoneShimmerRaySpeedMultiplier="@{1.4f}"
            bones:skeletonBoneShimmerRayThickness="@{Utils.getDp(50)}"
            bones:skeletonBoneShimmerRayTilt="@{-0.2f}" />

        <TextView
            android:id="@+id/textOne"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_gravity="start"
            android:layout_marginStart="12dp"
            android:justificationMode="inter_word"
            android:text="@{viewModel.demoDataTwo.data.text}"
            android:padding="6dp"
            android:textColor="@color/text_color"
            app:layout_constraintBottom_toBottomOf="@id/photo"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toEndOf="@id/photo"
            app:layout_constraintTop_toTopOf="@id/photo"
            bones:skeletonBoneDissectLargeBones="@{true}"
            tools:text="@string/lorem_ipsum"
            tools:targetApi="o" />

        <TextView
            android:id="@+id/textThree"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_gravity="start"
            android:layout_marginTop="12dp"
            android:layout_marginBottom="12dp"
            android:padding="2dp"
            android:singleLine="true"
            android:text="@{viewModel.demoDataTwo.data.text}"
            android:textAlignment="gravity"
            android:textStyle="bold"
            android:textSize="16sp"
            android:textColor="@color/text_color"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@id/photo"
            bones:skeletonBoneShadeMultiplier="@{0.9f}"
            tools:targetApi="o"
            tools:text="@string/lorem_ipsum"/>

        <TextView
            android:id="@+id/textFive"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_gravity="start"
            android:layout_marginTop="12dp"
            android:padding="2dp"
            android:text="@{viewModel.demoDataOne.data.textTwo}"
            android:textAlignment="gravity"
            android:textColor="@color/text_color"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@id/textThree"
            bones:skeletonBoneEnabled="@{viewModel.demoDataOne.loading}"
            bones:skeletonBoneDissectLargeBones="@{true}"
            tools:text="@string/lorem_ipsum"/>

        <androidx.constraintlayout.widget.ConstraintLayout
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:clipChildren="false"
            android:clipToPadding="false"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@id/textFive">

            <ImageView
                android:id="@+id/someImage"
                android:layout_width="120dp"
                android:layout_height="120dp"
                android:layout_marginTop="12dp"
                android:layout_marginBottom="12dp"
                android:background="@drawable/shape_section_background"
                android:backgroundTint="@color/bone_color_alt"
                android:elevation="8dp"
                android:foreground="?attr/selectableItemBackgroundBorderless"
                app:imageUrl="@{viewModel.demoDataOne.data.imageUrl}"
                app:layout_constraintBottom_toBottomOf="parent"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintTop_toTopOf="parent"
                app:layout_constraintVertical_bias="0.0"
                bones:skeletonBoneStateOwner="@{true}"
                bones:skeletonBoneShadeMultiplier="@{1.021f}" />

            <LinearLayout
                android:layout_width="0dp"
                android:layout_height="0dp"
                android:layout_marginStart="10dp"
                android:orientation="vertical"
                app:layout_constraintBottom_toBottomOf="parent"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintStart_toEndOf="@id/someImage"
                app:layout_constraintTop_toTopOf="parent"
                bones:skeletonBoneMaxThickness="@{Utils.getDp(20)}"
                bones:skeletonBoneMinThickness="@{Utils.getDp(10)}"
                bones:skeletonDissectLargeBones="@{false}">

                <TextView
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_gravity="start"
                    android:layout_weight="1"
                    android:gravity="center_vertical"
                    android:padding="2dp"
                    android:singleLine="true"
                    android:text="@{viewModel.demoDataTwo.data.text}"
                    android:textAlignment="gravity"
                    android:textColor="@color/text_color"
                    tools:text="@string/lorem_ipsum"/>

                <TextView
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_gravity="start"
                    android:layout_weight="1"
                    android:gravity="center_vertical"
                    android:padding="2dp"
                    android:singleLine="true"
                    android:text="@{viewModel.demoDataTwo.data.text}"
                    android:textAlignment="gravity"
                    android:textColor="@color/text_color"
                    tools:text="@string/lorem_ipsum"/>

                <TextView
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_gravity="start"
                    android:layout_weight="1"
                    android:gravity="center_vertical"
                    android:padding="2dp"
                    android:singleLine="true"
                    android:text="@{viewModel.demoDataTwo.data.text}"
                    android:textAlignment="gravity"
                    android:textColor="@color/text_color"
                    tools:text="@string/lorem_ipsum"/>
            </LinearLayout>
        </androidx.constraintlayout.widget.ConstraintLayout>
    </androidx.constraintlayout.widget.ConstraintLayout>
</layout>