XklLocal/app/src/main/res/layout/main_item_coursepack.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:tools="http://schemas.android.com/tools">

    <data>

        <variable
            name="coursePack"
            type="com.xkl.cdl.data.bean.course.CoursePack" />

    </data>

    <androidx.cardview.widget.CardView
        android:layout_width="match_parent"
        android:layout_height="100dp"
        android:layout_marginStart="16dp"
        android:layout_marginEnd="16dp"
        app:cardBackgroundColor="@color/white"
        app:cardCornerRadius="8dp"
        app:cardElevation="0dp">

        <androidx.constraintlayout.widget.ConstraintLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent">
            <!--https://juejin.cn/post/6971647089503633438 玩转ShapeableImageView -->
            <com.google.android.material.imageview.ShapeableImageView
                android:id="@+id/img_cover"
                android:layout_width="75dp"
                android:layout_height="match_parent"
                android:scaleType="fitXY"
                app:imageByteArray="@{coursePack.cover}"
                app:layout_constraintBottom_toBottomOf="parent"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintTop_toTopOf="parent"
                app:shapeAppearance="@style/roundedCornerStyle"
                tools:src="@mipmap/img_default" />

            <com.google.android.material.textview.MaterialTextView
                android:id="@+id/textview_coursePack"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_marginStart="12dp"
                android:layout_marginTop="4dp"
                android:layout_marginEnd="10dp"
                android:ellipsize="end"
                android:maxLines="2"
                android:minHeight="48dp"
                android:text="@{coursePack.coursePackName}"
                android:textColor="@color/main_text_color"
                android:textSize="@dimen/normalSize"
                app:layout_constraintEnd_toStartOf="@+id/my_ranking_view"
                app:layout_constraintStart_toEndOf="@+id/img_cover"
                app:layout_constraintTop_toTopOf="parent"
                tools:text="人教版·小学三年级" />


            <com.google.android.material.imageview.ShapeableImageView
                android:id="@+id/image_view_type_discern"
                android:layout_width="24dp"
                android:layout_height="24dp"
                android:layout_marginTop="8dp"
                android:layout_marginEnd="8dp"
                android:padding="3dp"
                android:src="@drawable/ic_course_discern"
                android:visibility="gone"
                app:layout_constraintEnd_toStartOf="@+id/image_view_type_spell"
                app:layout_constraintHorizontal_bias="0"
                app:layout_constraintHorizontal_chainStyle="packed"
                app:layout_constraintStart_toStartOf="@+id/textview_coursePack"
                app:layout_constraintTop_toBottomOf="@+id/textview_coursePack"
                app:shapeAppearance="@style/roundedCornerStyle"
                app:strokeColor="#1A5082E6"
                app:strokeWidth="5dp"
                tools:visibility="visible" />

            <com.google.android.material.imageview.ShapeableImageView
                android:id="@+id/image_view_type_spell"
                android:layout_width="24dp"
                android:layout_height="24dp"
                android:layout_marginTop="8dp"
                android:layout_marginEnd="8dp"
                android:padding="3dp"
                android:src="@drawable/ic_course_spell"
                android:visibility="gone"
                app:layout_constraintEnd_toStartOf="@+id/image_view_type_voice"
                app:layout_constraintStart_toEndOf="@+id/image_view_type_discern"
                app:layout_constraintTop_toBottomOf="@+id/textview_coursePack"
                app:shapeAppearance="@style/roundedCornerStyle"
                app:strokeColor="#1AF26255"
                app:strokeWidth="5dp"
                tools:visibility="visible" />

            <com.google.android.material.imageview.ShapeableImageView
                android:id="@+id/image_view_type_voice"
                android:layout_width="24dp"
                android:layout_height="24dp"
                android:layout_marginTop="8dp"
                android:layout_marginEnd="8dp"
                android:padding="3dp"
                android:src="@drawable/ic_course_voice"
                android:visibility="gone"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintStart_toEndOf="@+id/image_view_type_spell"
                app:layout_constraintTop_toBottomOf="@+id/textview_coursePack"
                app:shapeAppearance="@style/roundedCornerStyle"
                app:strokeColor="#1A52CC52"
                app:strokeWidth="8dp"
                tools:visibility="visible" />

            <!--进度-->
            <com.xkl.cdl.widget.MyRankingView
                android:id="@+id/my_ranking_view"
                android:layout_width="50dp"
                android:layout_height="50dp"
                app:layout_constraintTop_toTopOf="parent"
                app:layout_constraintBottom_toBottomOf="parent"
                app:layout_constraintEnd_toEndOf="parent"
                android:layout_marginEnd="16dp"
                app:normalColor="@color/gray_1"
                app:progressColor="@color/blue_1"
                app:borderWidth="3dp"
                app:progressNumber="@{(int)coursePack.learnProgress}"
                >
                <TextView
                    android:id="@+id/tv_learning_percent"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:gravity="center"
                    android:textColor="@color/gray_2"
                    android:textSize="@dimen/smallerSize"
                    app:coursePackLearnProgressFormat="@{coursePack.learnProgress}"/>
            </com.xkl.cdl.widget.MyRankingView>


        </androidx.constraintlayout.widget.ConstraintLayout>

    </androidx.cardview.widget.CardView>
</layout>