diff --git a/VisualNovel/app/src/main/AndroidManifest.xml b/VisualNovel/app/src/main/AndroidManifest.xml
index 3cc5eb7..0b6ae22 100644
--- a/VisualNovel/app/src/main/AndroidManifest.xml
+++ b/VisualNovel/app/src/main/AndroidManifest.xml
@@ -15,7 +15,6 @@
         <activity
             android:name=".ui.main.MainActivity"
             android:exported="true"
-            android:screenOrientation="portrait"
             >
             <intent-filter>
                 <action android:name="android.intent.action.MAIN" />
diff --git a/VisualNovel/app/src/main/java/com/remax/visualnovel/app/BaseBindingQuickAdapter.kt b/VisualNovel/app/src/main/java/com/remax/visualnovel/app/BaseBindingQuickAdapter.kt
new file mode 100644
index 0000000..b33f128
--- /dev/null
+++ b/VisualNovel/app/src/main/java/com/remax/visualnovel/app/BaseBindingQuickAdapter.kt
@@ -0,0 +1,47 @@
+package com.remax.visualnovel.app
+
+import android.view.LayoutInflater
+import android.view.View
+import android.view.ViewGroup
+import androidx.viewbinding.ViewBinding
+import com.chad.library.adapter.base.BaseQuickAdapter
+import com.chad.library.adapter.base.viewholder.BaseViewHolder
+
+/**
+ * Created by HJW on 2021/10/19
+ */
+abstract class BaseBindingQuickAdapter<T, out VB : ViewBinding>(
+    private val inflate: (LayoutInflater, ViewGroup, Boolean) -> VB,
+    layoutResId: Int = -1,
+    data: MutableList<T>? = null
+) :
+    BaseQuickAdapter<T, BaseBindingQuickAdapter.BaseBindingHolder>(layoutResId, data) {
+
+    override fun onCreateDefViewHolder(parent: ViewGroup, viewType: Int) =
+        BaseBindingHolder(inflate(LayoutInflater.from(parent.context), parent, false))
+
+    class BaseBindingHolder(private val binding: ViewBinding) : BaseViewHolder(binding.root) {
+        constructor(itemView: View) : this(ViewBinding { itemView })
+
+        @Suppress("UNCHECKED_CAST")
+        fun <VB : ViewBinding> getViewBinding() = binding as VB
+
+        var extraObj: Any? = null
+
+    }
+
+    /**
+     * 带左右滑动的item收起
+     */
+//    fun resetDeleteView(position: Int) {
+//        try {
+//            (getViewByPosition(
+//                position + headerLayoutCount,
+//                R.id.easySwipeMenuLayout
+//            ) as? EasySwipeMenuLayout)?.resetStatus()
+//        } catch (e: Exception) {
+//            Timber.d("resetDeleteView position:$position Exception:${e.localizedMessage}")
+//        }
+//    }
+
+}
\ No newline at end of file
diff --git a/VisualNovel/app/src/main/java/com/remax/visualnovel/ui/main/actor/ActorItem.kt b/VisualNovel/app/src/main/java/com/remax/visualnovel/ui/main/actor/ActorItem.kt
new file mode 100644
index 0000000..9915a89
--- /dev/null
+++ b/VisualNovel/app/src/main/java/com/remax/visualnovel/ui/main/actor/ActorItem.kt
@@ -0,0 +1,15 @@
+package com.remax.visualnovel.ui.main.actor
+
+data class ActorItem(
+    val id: Int,
+    val avatarRes: Int,
+    val from: String = "from",
+    val rating: Float,
+    val characterName: String,
+    val age: Int,
+    val tags: List<String>,
+    val description: String,
+    val workTitle: String,
+    val imageRes: Int
+)
+
diff --git a/VisualNovel/app/src/main/java/com/remax/visualnovel/ui/main/actor/ActorListFragment.kt b/VisualNovel/app/src/main/java/com/remax/visualnovel/ui/main/actor/ActorListFragment.kt
index be0574f..aeab5e3 100644
--- a/VisualNovel/app/src/main/java/com/remax/visualnovel/ui/main/actor/ActorListFragment.kt
+++ b/VisualNovel/app/src/main/java/com/remax/visualnovel/ui/main/actor/ActorListFragment.kt
@@ -1,26 +1,31 @@
 package com.remax.visualnovel.ui.main.actor
 
+
 import android.os.Bundle
 import android.util.Log
 import android.widget.Toast
 import androidx.fragment.app.viewModels
+import androidx.recyclerview.widget.DefaultItemAnimator
+import androidx.recyclerview.widget.StaggeredGridLayoutManager
 import com.alibaba.android.arouter.facade.annotation.Route
 import com.alibaba.android.arouter.launcher.ARouter
 import com.dylanc.loadingstateview.BgColorType
+import com.remax.visualnovel.R
 import com.remax.visualnovel.app.base.BaseBindingFragment
+import com.remax.visualnovel.configs.NovelApplication
 import com.remax.visualnovel.databinding.FragmentMainActorBinding
 import com.remax.visualnovel.utils.Routers
-import com.remax.visualnovel.widget.custom.AbsTagBean
 import dagger.hilt.android.AndroidEntryPoint
 import kotlin.getValue
-
+import kotlin.math.max
 
 
 @AndroidEntryPoint
 @Route(path = Routers.ROUTE_FRAG_ACTORLIST)
 class ActorListFragment : BaseBindingFragment<FragmentMainActorBinding>() {
 
-    private val contactViewModel by viewModels<ActorListViewModel>()
+    private lateinit var actorAdapter: ActorsAdapter
+    private val actorsViewModel by viewModels<ActorListViewModel>()
 
     override fun onCreated(bundle: Bundle?) {
         setUI()
@@ -32,15 +37,125 @@ class ActorListFragment : BaseBindingFragment<FragmentMainActorBinding>() {
 
     private fun setUI() {
         initTagLayout()
+        initRecyclerView()
 
         with(binding) {
             tagFlowLayout
         }
     }
 
+    private fun initRecyclerView() {
+        with(binding) {
+            val layoutManager = LayoutManagerHelper.createAdaptiveStaggeredGridLayoutManager()
+            actorsRv.layoutManager = layoutManager
+            actorsRv.addItemDecoration(GridSpacingItemDecoration(16))
+            actorsRv.setHasFixedSize(true)
+            actorsRv.itemAnimator = DefaultItemAnimator()
+            actorAdapter = ActorsAdapter()
+            actorsRv.adapter = actorAdapter
+
+            val characterList = createSampleData()
+            actorAdapter.setList(characterList)
+        }
+
+
+    }
+
+    private fun createSampleData(): List<ActorItem> {
+        return listOf(
+            ActorItem(
+                id = 1,
+                avatarRes = R.drawable.avatar1,
+                rating = 9.5f,
+                characterName = "Lin Feng",
+                age = 18,
+                tags = listOf("#Xianxia", "#Swordsmanship", "#Cultivation"),
+                description = "glory through relentless effort and uncover the conspiracy that destroyed him.",
+                workTitle = "The Last Oracle of Kael",
+                imageRes = R.drawable.character1
+            ),
+            ActorItem(
+                id = 2,
+                avatarRes = R.drawable.avatar2,
+                rating = 9.2f,
+                characterName = "Yue Ling",
+                age = 16,
+                tags = listOf("#Fantasy", "#Magic", "#Adventure"),
+                description = "A young mage with exceptional talent in elemental magic, on a journey to discover ancient magical artifacts.",
+                workTitle = "Elemental Chronicles",
+                imageRes = R.drawable.character2
+            ),
+            ActorItem(
+                id = 1,
+                avatarRes = R.drawable.avatar1,
+                rating = 9.5f,
+                characterName = "Lin Feng",
+                age = 18,
+                tags = listOf("#Xianxia", "#Swordsmanship", "#Cultivation"),
+                description = "Once a prodigy, Lin Feng had his cultivation shattered and was cast out of his clan. Now he must reclaim his former glory through relentless effort and uncover the conspiracy that destroyed him.",
+                workTitle = "The Last Oracle of Kael",
+                imageRes = R.drawable.character1
+            ),
+            ActorItem(
+                id = 2,
+                avatarRes = R.drawable.avatar2,
+                rating = 9.2f,
+                characterName = "Yue Ling",
+                age = 16,
+                tags = listOf("#Fantasy", "#Magic", "#Adventure"),
+                description = "magical artifacts.",
+                workTitle = "Elemental Chronicles",
+                imageRes = R.drawable.character2
+            ),
+            ActorItem(
+                id = 1,
+                avatarRes = R.drawable.avatar1,
+                rating = 9.5f,
+                characterName = "Lin Feng",
+                age = 18,
+                tags = listOf("#Xianxia", "#Swordsmanship", "#Cultivation"),
+                description = "Once a prodigy, Lin Feng had his cultivation shattered and was cast out of his clan. Now he must reclaim his former glory through relentless effort and uncover the conspiracy that destroyed him.",
+                workTitle = "The Last Oracle of Kael",
+                imageRes = R.drawable.character1
+            ),
+            ActorItem(
+                id = 2,
+                avatarRes = R.drawable.avatar2,
+                rating = 9.2f,
+                characterName = "Yue Ling",
+                age = 16,
+                tags = listOf("#Fantasy", "#Magic", "#Adventure"),
+                description = "A ancient magical artifacts.",
+                workTitle = "Elemental Chronicles",
+                imageRes = R.drawable.character2
+            ),
+            ActorItem(
+                id = 1,
+                avatarRes = R.drawable.avatar1,
+                rating = 9.5f,
+                characterName = "Lin Feng",
+                age = 18,
+                tags = listOf("#Xianxia", "#Swordsmanship", "#Cultivation"),
+                description = "ory through relentless effort and uncover the conspiracy that destroyed him.",
+                workTitle = "The Last Oracle of Kael",
+                imageRes = R.drawable.character1
+            ),
+            ActorItem(
+                id = 2,
+                avatarRes = R.drawable.avatar2,
+                rating = 9.2f,
+                characterName = "Yue Ling",
+                age = 16,
+                tags = listOf("#Fantasy", "#Magic", "#Adventure"),
+                description = "A young mage with exceptional talent in elemental magic, on a journey to discover ancient magical artifacts.",
+                workTitle = "Elemental Chronicles",
+                imageRes = R.drawable.character2
+            )
+        )
+    }
+
     private fun initTagLayout() {
         with(binding) {
-            // 模拟数据
             val tags = listOf(
                 ActorTagBean("1", "Youth"),
                 ActorTagBean("2", "Lolita"),
@@ -73,4 +188,22 @@ class ActorListFragment : BaseBindingFragment<FragmentMainActorBinding>() {
         }
     }
 
+    object LayoutManagerHelper {
+        fun createAdaptiveStaggeredGridLayoutManager(): StaggeredGridLayoutManager {
+            val displayMetrics = NovelApplication.appContext().resources.displayMetrics
+            val screenWidthPx = displayMetrics.widthPixels
+            val screenWidthDp = screenWidthPx / displayMetrics.density
+            // 计算列数
+            val columnCount = when {
+                screenWidthDp >= 600 -> {
+                    max(3, (screenWidthDp / 200).toInt())
+                }
+                else -> {
+                    2
+                }
+            }
+            return StaggeredGridLayoutManager(columnCount, StaggeredGridLayoutManager.VERTICAL)
+        }
+    }
+
 }
\ No newline at end of file
diff --git a/VisualNovel/app/src/main/java/com/remax/visualnovel/ui/main/actor/ActorListViewModel.kt b/VisualNovel/app/src/main/java/com/remax/visualnovel/ui/main/actor/ActorListViewModel.kt
index 323ebb8..d1f5fd8 100644
--- a/VisualNovel/app/src/main/java/com/remax/visualnovel/ui/main/actor/ActorListViewModel.kt
+++ b/VisualNovel/app/src/main/java/com/remax/visualnovel/ui/main/actor/ActorListViewModel.kt
@@ -5,7 +5,6 @@ import com.remax.visualnovel.entity.response.Book
 import com.remax.visualnovel.app.viewmodel.base.BaseViewModel
 import com.remax.visualnovel.entity.response.base.Response
 import com.remax.visualnovel.repository.api.ActorsRepository
-import com.remax.visualnovel.repository.api.BooksRepository
 import dagger.hilt.android.lifecycle.HiltViewModel
 import kotlinx.coroutines.flow.MutableSharedFlow
 import kotlinx.coroutines.flow.asSharedFlow
diff --git a/VisualNovel/app/src/main/java/com/remax/visualnovel/ui/main/actor/ActorsAdapter.kt b/VisualNovel/app/src/main/java/com/remax/visualnovel/ui/main/actor/ActorsAdapter.kt
new file mode 100644
index 0000000..485d125
--- /dev/null
+++ b/VisualNovel/app/src/main/java/com/remax/visualnovel/ui/main/actor/ActorsAdapter.kt
@@ -0,0 +1,33 @@
+package com.remax.visualnovel.ui.main.actor
+
+
+import com.chad.library.adapter.base.module.LoadMoreModule
+import com.remax.visualnovel.R
+import com.remax.visualnovel.app.BaseBindingQuickAdapter
+import com.remax.visualnovel.databinding.FragmentMainActorItemBinding
+
+class ActorsAdapter : BaseBindingQuickAdapter<ActorItem, FragmentMainActorItemBinding>(FragmentMainActorItemBinding::inflate), LoadMoreModule {
+    init {
+        addChildClickViewIds(R.id.top_container_left_top)
+
+        setOnItemChildClickListener { _, _, position ->
+            val item = getItem(position)
+            // TODO - goto
+        }
+    }
+
+
+    override fun convert(holder: BaseBindingHolder, item: ActorItem) {
+        holder.getViewBinding<FragmentMainActorItemBinding>().run {
+            ivCharacter.setImageResource(item.imageRes)
+            ivFrom.setImageResource(item.avatarRes)
+
+            tvFrom.text = item.from
+            tvScore.text = "%.1f".format(item.rating)
+            tvChapterNum.text = "${item.characterName}·${item.age}"
+            tvLables.text = item.tags.toString()
+            tvDescription.text = item.description
+            tvLast.text = "[${item.workTitle}]"
+        }
+    }
+}
\ No newline at end of file
diff --git a/VisualNovel/app/src/main/java/com/remax/visualnovel/ui/main/actor/GridSpacingItemDecoration.kt b/VisualNovel/app/src/main/java/com/remax/visualnovel/ui/main/actor/GridSpacingItemDecoration.kt
new file mode 100644
index 0000000..22f5eed
--- /dev/null
+++ b/VisualNovel/app/src/main/java/com/remax/visualnovel/ui/main/actor/GridSpacingItemDecoration.kt
@@ -0,0 +1,30 @@
+package com.remax.visualnovel.ui.main.actor
+
+import android.graphics.Rect
+import android.view.View
+import androidx.recyclerview.widget.RecyclerView
+import androidx.recyclerview.widget.StaggeredGridLayoutManager
+
+class GridSpacingItemDecoration(private val spacing: Int) : RecyclerView.ItemDecoration() {
+
+    override fun getItemOffsets(
+        outRect: Rect,
+        view: View,
+        parent: RecyclerView,
+        state: RecyclerView.State
+    ) {
+        val position = parent.getChildAdapterPosition(view)
+        val layoutManager = parent.layoutManager as? StaggeredGridLayoutManager
+        val spanCount = layoutManager?.spanCount ?: 2
+
+        val column = position % spanCount
+
+        outRect.left = spacing - column * spacing / spanCount
+        outRect.right = (column + 1) * spacing / spanCount
+
+        if (position < spanCount) {
+            outRect.top = spacing
+        }
+        outRect.bottom = spacing
+    }
+}
\ No newline at end of file
diff --git a/VisualNovel/app/src/main/res/drawable/avatar1.webp b/VisualNovel/app/src/main/res/drawable/avatar1.webp
new file mode 100644
index 0000000..13545c4
Binary files /dev/null and b/VisualNovel/app/src/main/res/drawable/avatar1.webp differ
diff --git a/VisualNovel/app/src/main/res/drawable/avatar2.webp b/VisualNovel/app/src/main/res/drawable/avatar2.webp
new file mode 100644
index 0000000..13545c4
Binary files /dev/null and b/VisualNovel/app/src/main/res/drawable/avatar2.webp differ
diff --git a/VisualNovel/app/src/main/res/drawable/avatar_placeholder.webp b/VisualNovel/app/src/main/res/drawable/avatar_placeholder.webp
new file mode 100644
index 0000000..c209e78
Binary files /dev/null and b/VisualNovel/app/src/main/res/drawable/avatar_placeholder.webp differ
diff --git a/VisualNovel/app/src/main/res/drawable/card_background.xml b/VisualNovel/app/src/main/res/drawable/card_background.xml
new file mode 100644
index 0000000..ff59365
--- /dev/null
+++ b/VisualNovel/app/src/main/res/drawable/card_background.xml
@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
+<shape xmlns:android="http://schemas.android.com/apk/res/android">
+    <solid android:color="#FFFFFF" />
+    <corners android:radius="@dimen/dp_12" />
+</shape>
\ No newline at end of file
diff --git a/VisualNovel/app/src/main/res/drawable/character1.png b/VisualNovel/app/src/main/res/drawable/character1.png
new file mode 100644
index 0000000..9aedac1
Binary files /dev/null and b/VisualNovel/app/src/main/res/drawable/character1.png differ
diff --git a/VisualNovel/app/src/main/res/drawable/character2.png b/VisualNovel/app/src/main/res/drawable/character2.png
new file mode 100644
index 0000000..785cef3
Binary files /dev/null and b/VisualNovel/app/src/main/res/drawable/character2.png differ
diff --git a/VisualNovel/app/src/main/res/drawable/character_placeholder.png b/VisualNovel/app/src/main/res/drawable/character_placeholder.png
new file mode 100644
index 0000000..9a19629
Binary files /dev/null and b/VisualNovel/app/src/main/res/drawable/character_placeholder.png differ
diff --git a/VisualNovel/app/src/main/res/drawable/custom_corner_bg.xml b/VisualNovel/app/src/main/res/drawable/custom_corner_bg.xml
new file mode 100644
index 0000000..389fc89
--- /dev/null
+++ b/VisualNovel/app/src/main/res/drawable/custom_corner_bg.xml
@@ -0,0 +1,13 @@
+<?xml version="1.0" encoding="utf-8"?>
+<selector xmlns:android="http://schemas.android.com/apk/res/android">
+    <item>
+        <shape android:shape="rectangle">
+            <corners
+                android:topLeftRadius="@dimen/dp_2"
+                android:topRightRadius="@dimen/dp_25"
+                android:bottomLeftRadius="@dimen/dp_25"
+                android:bottomRightRadius="@dimen/dp_25"/>
+            <solid android:color="@color/white" />
+        </shape>
+    </item>
+</selector>
\ No newline at end of file
diff --git a/VisualNovel/app/src/main/res/drawable/rating_background.xml b/VisualNovel/app/src/main/res/drawable/rating_background.xml
new file mode 100644
index 0000000..a9d0220
--- /dev/null
+++ b/VisualNovel/app/src/main/res/drawable/rating_background.xml
@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
+<shape xmlns:android="http://schemas.android.com/apk/res/android">
+    <solid android:color="#FF6B35" />
+    <corners android:radius="@dimen/dp_8" />
+</shape>
\ No newline at end of file
diff --git a/VisualNovel/app/src/main/res/drawable/tag_background.xml b/VisualNovel/app/src/main/res/drawable/tag_background.xml
new file mode 100644
index 0000000..3d24b32
--- /dev/null
+++ b/VisualNovel/app/src/main/res/drawable/tag_background.xml
@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?>
+<shape xmlns:android="http://schemas.android.com/apk/res/android">
+    <solid android:color="#F5F5F5" />
+    <stroke android:width="@dimen/dp_1" android:color="#E0E0E0" />
+    <corners android:radius="@dimen/dp_6" />
+</shape>
\ No newline at end of file
diff --git a/VisualNovel/app/src/main/res/layout/fragment_main_actor.xml b/VisualNovel/app/src/main/res/layout/fragment_main_actor.xml
index 7fedecc..d475568 100644
--- a/VisualNovel/app/src/main/res/layout/fragment_main_actor.xml
+++ b/VisualNovel/app/src/main/res/layout/fragment_main_actor.xml
@@ -12,7 +12,7 @@
     <com.remax.visualnovel.widget.uitoken.view.UITokenConstraintLayout
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
-        android:paddingHorizontal="@dimen/glo_radius_16"
+        android:paddingHorizontal="@dimen/dp_16"
         android:paddingVertical="@dimen/dp_4"
         android:orientation="horizontal"
         >
@@ -32,14 +32,22 @@
         android:id="@+id/tagFlowLayout"
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
-        android:padding="16dp"
-        app:tag_horizontal_spacing="10dp"
-        app:tag_vertical_spacing="8dp"
-        app:tag_text_size="12sp"
+        android:padding="@dimen/dp_16"
+        app:tag_horizontal_spacing="@dimen/dp_10"
+        app:tag_vertical_spacing="@dimen/dp_8"
+        app:tag_text_size="@dimen/sp_12"
         app:tag_max_lines="1"
         app:tag_text_color="@color/white"
         app:tag_each_line_max_num="2"
         app:tag_expand_drawable="@mipmap/tag_flow_expand"
         app:tag_shrink_drawable="@mipmap/tag_flow_shrink" />
 
+    <androidx.recyclerview.widget.RecyclerView
+        android:id="@+id/actors_rv"
+        android:layout_width="match_parent"
+        android:layout_height="0dp"
+        android:layout_weight="1"
+        android:layout_marginTop="@dimen/dp_4"
+        />
+
 </LinearLayout>
diff --git a/VisualNovel/app/src/main/res/layout/fragment_main_actor_feature_item.xml b/VisualNovel/app/src/main/res/layout/fragment_main_actor_feature_item.xml
new file mode 100644
index 0000000..30a08d1
--- /dev/null
+++ b/VisualNovel/app/src/main/res/layout/fragment_main_actor_feature_item.xml
@@ -0,0 +1,13 @@
+<?xml version="1.0" encoding="utf-8"?>
+<TextView xmlns:android="http://schemas.android.com/apk/res/android"
+    android:layout_width="wrap_content"
+    android:layout_height="wrap_content"
+    android:layout_marginEnd="@dimen/dp_6"
+    android:layout_marginBottom="@dimen/dp_6"
+    android:background="@drawable/tag_background"
+    android:gravity="center"
+    android:paddingHorizontal="@dimen/dp_8"
+    android:paddingVertical="@dimen/dp_4"
+    android:text="#Tag"
+    android:textColor="#666666"
+    android:textSize="@dimen/sp_10" />
\ No newline at end of file
diff --git a/VisualNovel/app/src/main/res/layout/fragment_main_actor_item.xml b/VisualNovel/app/src/main/res/layout/fragment_main_actor_item.xml
new file mode 100644
index 0000000..901bb3c
--- /dev/null
+++ b/VisualNovel/app/src/main/res/layout/fragment_main_actor_item.xml
@@ -0,0 +1,180 @@
+<?xml version="1.0" encoding="utf-8"?>
+<androidx.cardview.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    android:id="@+id/root_card"
+    android:layout_width="match_parent"
+    android:layout_height="wrap_content"
+    app:cardElevation="@dimen/dp_4"
+    app:cardCornerRadius="@dimen/dp_5" >
+
+
+    <LinearLayout
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content"
+        android:orientation="vertical"
+        android:background="@color/white">
+
+        <androidx.constraintlayout.widget.ConstraintLayout
+            android:id="@+id/top_container"
+            android:layout_width="match_parent"
+            android:layout_height="wrap_content"
+            >
+
+            <ImageView
+                android:id="@+id/ivCharacter"
+                android:layout_width="match_parent"
+                android:layout_height="0dp"
+                android:scaleType="centerCrop"
+                android:src="@drawable/character_placeholder"
+                app:layout_constraintDimensionRatio="H,172:229"
+                app:layout_constraintStart_toStartOf="parent"
+                app:layout_constraintEnd_toEndOf="parent"
+                app:layout_constraintTop_toTopOf="parent"
+                app:layout_constraintBottom_toBottomOf="parent"
+                android:visibility="visible"
+                />
+
+
+            <FrameLayout
+                android:id="@+id/top_container_left_top"
+                android:layout_width="wrap_content"
+                android:layout_height="wrap_content"
+                app:layout_constraintStart_toStartOf="parent"
+                app:layout_constraintTop_toTopOf="parent"
+                android:padding="@dimen/dp_3"
+                android:background="@mipmap/actor_item_from_bg_1"
+                >
+                <androidx.cardview.widget.CardView
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    app:cardCornerRadius="@dimen/dp_8"
+                    >
+                    <FrameLayout
+                        android:layout_width="wrap_content"
+                        android:layout_height="wrap_content">
+                        <ImageView
+                            android:id="@+id/iv_from"
+                            android:layout_width="@dimen/dp_33"
+                            android:layout_height="@dimen/dp_44"
+                            android:scaleType="centerCrop"
+                            />
+                        <TextView
+                            android:id="@+id/tv_from"
+                            android:layout_width="wrap_content"
+                            android:layout_height="wrap_content"
+                            android:scaleType="centerCrop"
+                            android:gravity="center"
+                            android:background="@mipmap/actor_item_from_small"
+                            android:text="@string/from"
+                            android:textSize="@dimen/sp_14"
+                            />
+
+                        <ImageView
+                            android:id="@+id/iv_from_type"
+                            android:layout_width="wrap_content"
+                            android:layout_height="wrap_content"
+                            android:scaleType="centerCrop"
+                            android:padding="@dimen/dp_3"
+                            android:layout_gravity="right|bottom"
+                            android:src="@mipmap/actor_item_video_small"
+                            />
+                    </FrameLayout>
+
+                </androidx.cardview.widget.CardView>
+            </FrameLayout>
+
+
+            <LinearLayout
+                android:layout_width="wrap_content"
+                android:layout_height="wrap_content"
+                android:orientation="horizontal"
+                android:gravity="center_vertical"
+                app:layout_constraintEnd_toEndOf="parent"
+                app:layout_constraintTop_toTopOf="parent"
+                android:layout_marginTop="@dimen/dp_10"
+                android:layout_marginRight="@dimen/dp_10"
+                >
+                <ImageView
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:src="@mipmap/score"
+                    />
+
+                <TextView
+                    android:id="@+id/tv_score"
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_marginLeft="@dimen/dp_5"
+                    android:gravity="center"
+                    android:textSize="@dimen/sp_15"
+                    android:textColor="@color/yellow"
+                    android:textStyle="bold"
+                    />
+            </LinearLayout>
+
+
+            <LinearLayout
+                android:id="@+id/top_container_bottom"
+                android:layout_width="wrap_content"
+                android:layout_height="wrap_content"
+                android:orientation="vertical"
+                android:layout_marginLeft="@dimen/dp_10"
+                android:layout_marginBottom="@dimen/dp_10"
+                app:layout_constraintBottom_toBottomOf="parent"
+                app:layout_constraintStart_toStartOf="parent"
+                >
+                <TextView
+                    android:id="@+id/tv_chapter_num"
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:gravity="start"
+                    android:textSize="@dimen/sp_14"
+                    android:textColor="@color/white"
+                    android:textStyle="bold"
+                    />
+                <TextView
+                    android:id="@+id/tv_lables"
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:gravity="start"
+                    android:layout_marginTop="@dimen/dp_10"
+                    android:textSize="@dimen/sp_14"
+                    android:textColor="@color/yellow_light_1"
+                    android:textStyle="bold"
+                    />
+            </LinearLayout>
+
+        </androidx.constraintlayout.widget.ConstraintLayout>
+
+
+        <!-- 底部描述文本 -->
+        <LinearLayout
+            android:layout_width="match_parent"
+            android:layout_height="wrap_content"
+            android:orientation="vertical"
+            android:padding="@dimen/dp_10"
+            >
+
+            <TextView
+                android:id="@+id/tvDescription"
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:lineSpacingExtra="@dimen/dp_4"
+                android:textColor="#666666"
+                android:textSize="@dimen/sp_12"
+                android:maxLines="5"
+                android:ellipsize="end" />
+
+            <TextView
+                android:id="@+id/tv_last"
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:layout_marginTop="@dimen/dp_5"
+                android:textColor="#999999"
+                android:textSize="@dimen/sp_10"
+                android:textStyle="italic" />
+        </LinearLayout>
+
+    </LinearLayout>
+
+</androidx.cardview.widget.CardView>
\ No newline at end of file
diff --git a/VisualNovel/app/src/main/res/mipmap-hdpi/img.png b/VisualNovel/app/src/main/res/mipmap-hdpi/img.png
new file mode 100644
index 0000000..e10003f
Binary files /dev/null and b/VisualNovel/app/src/main/res/mipmap-hdpi/img.png differ
diff --git a/VisualNovel/app/src/main/res/mipmap-xxhdpi/actor_item_book_big.webp b/VisualNovel/app/src/main/res/mipmap-xxhdpi/actor_item_book_big.webp
new file mode 100644
index 0000000..b415450
Binary files /dev/null and b/VisualNovel/app/src/main/res/mipmap-xxhdpi/actor_item_book_big.webp differ
diff --git a/VisualNovel/app/src/main/res/mipmap-xxhdpi/actor_item_from_bg_1.webp b/VisualNovel/app/src/main/res/mipmap-xxhdpi/actor_item_from_bg_1.webp
new file mode 100644
index 0000000..44302d9
Binary files /dev/null and b/VisualNovel/app/src/main/res/mipmap-xxhdpi/actor_item_from_bg_1.webp differ
diff --git a/VisualNovel/app/src/main/res/mipmap-xxhdpi/actor_item_from_bg_2.webp b/VisualNovel/app/src/main/res/mipmap-xxhdpi/actor_item_from_bg_2.webp
new file mode 100644
index 0000000..4156c11
Binary files /dev/null and b/VisualNovel/app/src/main/res/mipmap-xxhdpi/actor_item_from_bg_2.webp differ
diff --git a/VisualNovel/app/src/main/res/mipmap-xxhdpi/actor_item_from_bg_3.webp b/VisualNovel/app/src/main/res/mipmap-xxhdpi/actor_item_from_bg_3.webp
new file mode 100644
index 0000000..1326f4a
Binary files /dev/null and b/VisualNovel/app/src/main/res/mipmap-xxhdpi/actor_item_from_bg_3.webp differ
diff --git a/VisualNovel/app/src/main/res/mipmap-xxhdpi/actor_item_from_big.webp b/VisualNovel/app/src/main/res/mipmap-xxhdpi/actor_item_from_big.webp
new file mode 100644
index 0000000..e011349
Binary files /dev/null and b/VisualNovel/app/src/main/res/mipmap-xxhdpi/actor_item_from_big.webp differ
diff --git a/VisualNovel/app/src/main/res/mipmap-xxhdpi/actor_item_from_small.webp b/VisualNovel/app/src/main/res/mipmap-xxhdpi/actor_item_from_small.webp
new file mode 100644
index 0000000..c66e6d9
Binary files /dev/null and b/VisualNovel/app/src/main/res/mipmap-xxhdpi/actor_item_from_small.webp differ
diff --git a/VisualNovel/app/src/main/res/mipmap-xxhdpi/actor_item_video_big.webp b/VisualNovel/app/src/main/res/mipmap-xxhdpi/actor_item_video_big.webp
new file mode 100644
index 0000000..a22dae3
Binary files /dev/null and b/VisualNovel/app/src/main/res/mipmap-xxhdpi/actor_item_video_big.webp differ
diff --git a/VisualNovel/app/src/main/res/mipmap-xxhdpi/actor_item_video_small.webp b/VisualNovel/app/src/main/res/mipmap-xxhdpi/actor_item_video_small.webp
new file mode 100644
index 0000000..ece3805
Binary files /dev/null and b/VisualNovel/app/src/main/res/mipmap-xxhdpi/actor_item_video_small.webp differ
diff --git a/VisualNovel/app/src/main/res/mipmap-xxhdpi/score.webp b/VisualNovel/app/src/main/res/mipmap-xxhdpi/score.webp
new file mode 100644
index 0000000..f33e326
Binary files /dev/null and b/VisualNovel/app/src/main/res/mipmap-xxhdpi/score.webp differ
diff --git a/VisualNovel/app/src/main/res/values/colors.xml b/VisualNovel/app/src/main/res/values/colors.xml
index e96e1d1..58217c7 100644
--- a/VisualNovel/app/src/main/res/values/colors.xml
+++ b/VisualNovel/app/src/main/res/values/colors.xml
@@ -185,6 +185,9 @@
     <color name="tag_bg_color">#ffbac5d2</color>
     <color name="tag_bg_color_selected">#ff0065ff</color>
     <color name="tag_text_color">#ffe5f1ff</color>
+    <color name="yellow">#FFFF00</color>
+    <color name="yellow_light_1">#FF8800</color>
+
 
 
 
diff --git a/VisualNovel/app/src/main/res/values/dimens.xml b/VisualNovel/app/src/main/res/values/dimens.xml
index 78e3401..ca85cd4 100644
--- a/VisualNovel/app/src/main/res/values/dimens.xml
+++ b/VisualNovel/app/src/main/res/values/dimens.xml
@@ -65,7 +65,7 @@
     <!-- Typeface -->
     <string name="glo_font_family_sys" translatable="false">Poppins</string>
     <string name="glo_font_family_numDisplay" translatable="false">D-Din</string>
-<!--    <string name="glo_font_family_num" translatable="false">Sans</string>-->
+    <!--    <string name="glo_font_family_num" translatable="false">Sans</string>-->
     <string name="glo_font_family_num" translatable="false">Poppins</string>
     <string name="glo_font_family_display" translatable="false">Bangers</string>
 
@@ -143,4 +143,242 @@
     <dimen name="_240dp">240dp</dimen>
     <dimen name="_300dp">300dp</dimen>
 
+
+
+
+
+    <!--  new added  -->
+    <dimen name="dp_1">1dp</dimen>
+    <dimen name="dp_2">2dp</dimen>
+    <dimen name="dp_3">3dp</dimen>
+    <dimen name="dp_4">4dp</dimen>
+    <dimen name="dp_5">5dp</dimen>
+    <dimen name="dp_6">6dp</dimen>
+    <dimen name="dp_7">7dp</dimen>
+    <dimen name="dp_8">8dp</dimen>
+    <dimen name="dp_9">9dp</dimen>
+    <dimen name="dp_10">10dp</dimen>
+    <dimen name="dp_11">11dp</dimen>
+    <dimen name="dp_12">12dp</dimen>
+    <dimen name="dp_13">13dp</dimen>
+    <dimen name="dp_14">14dp</dimen>
+    <dimen name="dp_15">15dp</dimen>
+    <dimen name="dp_16">16dp</dimen>
+    <dimen name="dp_17">17dp</dimen>
+    <dimen name="dp_18">18dp</dimen>
+    <dimen name="dp_19">19dp</dimen>
+    <dimen name="dp_20">20dp</dimen>
+    <dimen name="dp_21">21dp</dimen>
+    <dimen name="dp_22">22dp</dimen>
+    <dimen name="dp_23">23dp</dimen>
+    <dimen name="dp_24">24dp</dimen>
+    <dimen name="dp_25">25dp</dimen>
+    <dimen name="dp_26">26dp</dimen>
+    <dimen name="dp_27">27dp</dimen>
+    <dimen name="dp_28">28dp</dimen>
+    <dimen name="dp_29">29dp</dimen>
+    <dimen name="dp_30">30dp</dimen>
+    <dimen name="dp_31">31dp</dimen>
+    <dimen name="dp_32">32dp</dimen>
+    <dimen name="dp_33">33dp</dimen>
+    <dimen name="dp_34">34dp</dimen>
+    <dimen name="dp_35">35dp</dimen>
+    <dimen name="dp_36">36dp</dimen>
+    <dimen name="dp_37">37dp</dimen>
+    <dimen name="dp_38">38dp</dimen>
+    <dimen name="dp_39">39dp</dimen>
+    <dimen name="dp_40">40dp</dimen>
+    <dimen name="dp_41">41dp</dimen>
+    <dimen name="dp_42">42dp</dimen>
+    <dimen name="dp_43">43dp</dimen>
+    <dimen name="dp_44">44dp</dimen>
+    <dimen name="dp_45">45dp</dimen>
+    <dimen name="dp_46">46dp</dimen>
+    <dimen name="dp_47">47dp</dimen>
+    <dimen name="dp_48">48dp</dimen>
+    <dimen name="dp_49">49dp</dimen>
+    <dimen name="dp_50">50dp</dimen>
+    <dimen name="dp_51">51dp</dimen>
+    <dimen name="dp_52">52dp</dimen>
+    <dimen name="dp_53">53dp</dimen>
+    <dimen name="dp_54">54dp</dimen>
+    <dimen name="dp_55">55dp</dimen>
+    <dimen name="dp_56">56dp</dimen>
+    <dimen name="dp_57">57dp</dimen>
+    <dimen name="dp_58">58dp</dimen>
+    <dimen name="dp_59">59dp</dimen>
+    <dimen name="dp_60">60dp</dimen>
+    <dimen name="dp_61">61dp</dimen>
+    <dimen name="dp_62">62dp</dimen>
+    <dimen name="dp_63">63dp</dimen>
+    <dimen name="dp_64">64dp</dimen>
+    <dimen name="dp_65">65dp</dimen>
+    <dimen name="dp_66">66dp</dimen>
+    <dimen name="dp_67">67dp</dimen>
+    <dimen name="dp_68">68dp</dimen>
+    <dimen name="dp_69">69dp</dimen>
+    <dimen name="dp_70">70dp</dimen>
+    <dimen name="dp_71">71dp</dimen>
+    <dimen name="dp_72">72dp</dimen>
+    <dimen name="dp_73">73dp</dimen>
+    <dimen name="dp_74">74dp</dimen>
+    <dimen name="dp_75">75dp</dimen>
+    <dimen name="dp_76">76dp</dimen>
+    <dimen name="dp_77">77dp</dimen>
+    <dimen name="dp_78">78dp</dimen>
+    <dimen name="dp_79">79dp</dimen>
+    <dimen name="dp_80">80dp</dimen>
+    <dimen name="dp_81">81dp</dimen>
+    <dimen name="dp_82">82dp</dimen>
+    <dimen name="dp_83">83dp</dimen>
+    <dimen name="dp_84">84dp</dimen>
+    <dimen name="dp_85">85dp</dimen>
+    <dimen name="dp_86">86dp</dimen>
+    <dimen name="dp_87">87dp</dimen>
+    <dimen name="dp_88">88dp</dimen>
+    <dimen name="dp_89">89dp</dimen>
+    <dimen name="dp_90">90dp</dimen>
+    <dimen name="dp_91">91dp</dimen>
+    <dimen name="dp_92">92dp</dimen>
+    <dimen name="dp_93">93dp</dimen>
+    <dimen name="dp_94">94dp</dimen>
+    <dimen name="dp_95">95dp</dimen>
+    <dimen name="dp_96">96dp</dimen>
+    <dimen name="dp_97">97dp</dimen>
+    <dimen name="dp_98">98dp</dimen>
+    <dimen name="dp_99">99dp</dimen>
+    <dimen name="dp_100">100dp</dimen>
+    <dimen name="dp_101">101dp</dimen>
+    <dimen name="dp_102">102dp</dimen>
+    <dimen name="dp_103">103dp</dimen>
+    <dimen name="dp_104">104dp</dimen>
+    <dimen name="dp_105">105dp</dimen>
+    <dimen name="dp_106">106dp</dimen>
+    <dimen name="dp_107">107dp</dimen>
+    <dimen name="dp_108">108dp</dimen>
+    <dimen name="dp_109">109dp</dimen>
+    <dimen name="dp_110">110dp</dimen>
+    <dimen name="dp_111">111dp</dimen>
+    <dimen name="dp_112">112dp</dimen>
+    <dimen name="dp_113">113dp</dimen>
+    <dimen name="dp_114">114dp</dimen>
+    <dimen name="dp_115">115dp</dimen>
+    <dimen name="dp_116">116dp</dimen>
+    <dimen name="dp_117">117dp</dimen>
+    <dimen name="dp_118">118dp</dimen>
+    <dimen name="dp_119">119dp</dimen>
+    <dimen name="dp_120">120dp</dimen>
+    <dimen name="dp_121">121dp</dimen>
+    <dimen name="dp_122">122dp</dimen>
+    <dimen name="dp_123">123dp</dimen>
+    <dimen name="dp_124">124dp</dimen>
+    <dimen name="dp_125">125dp</dimen>
+    <dimen name="dp_126">126dp</dimen>
+    <dimen name="dp_127">127dp</dimen>
+    <dimen name="dp_128">128dp</dimen>
+    <dimen name="dp_129">129dp</dimen>
+    <dimen name="dp_130">130dp</dimen>
+    <dimen name="dp_131">131dp</dimen>
+    <dimen name="dp_132">132dp</dimen>
+    <dimen name="dp_133">133dp</dimen>
+    <dimen name="dp_134">134dp</dimen>
+    <dimen name="dp_135">135dp</dimen>
+    <dimen name="dp_136">136dp</dimen>
+    <dimen name="dp_137">137dp</dimen>
+    <dimen name="dp_138">138dp</dimen>
+    <dimen name="dp_139">139dp</dimen>
+    <dimen name="dp_140">140dp</dimen>
+    <dimen name="dp_141">141dp</dimen>
+    <dimen name="dp_142">142dp</dimen>
+    <dimen name="dp_143">143dp</dimen>
+    <dimen name="dp_144">144dp</dimen>
+    <dimen name="dp_145">145dp</dimen>
+    <dimen name="dp_146">146dp</dimen>
+    <dimen name="dp_147">147dp</dimen>
+    <dimen name="dp_148">148dp</dimen>
+    <dimen name="dp_149">149dp</dimen>
+    <dimen name="dp_150">150dp</dimen>
+    <dimen name="dp_151">151dp</dimen>
+    <dimen name="dp_152">152dp</dimen>
+    <dimen name="dp_153">153dp</dimen>
+    <dimen name="dp_154">154dp</dimen>
+    <dimen name="dp_155">155dp</dimen>
+    <dimen name="dp_156">156dp</dimen>
+    <dimen name="dp_157">157dp</dimen>
+    <dimen name="dp_158">158dp</dimen>
+    <dimen name="dp_159">159dp</dimen>
+    <dimen name="dp_160">160dp</dimen>
+    <dimen name="dp_161">161dp</dimen>
+    <dimen name="dp_162">162dp</dimen>
+    <dimen name="dp_163">163dp</dimen>
+    <dimen name="dp_164">164dp</dimen>
+    <dimen name="dp_165">165dp</dimen>
+    <dimen name="dp_166">166dp</dimen>
+    <dimen name="dp_167">167dp</dimen>
+    <dimen name="dp_168">168dp</dimen>
+    <dimen name="dp_169">169dp</dimen>
+    <dimen name="dp_170">170dp</dimen>
+    <dimen name="dp_171">171dp</dimen>
+    <dimen name="dp_172">172dp</dimen>
+    <dimen name="dp_173">173dp</dimen>
+    <dimen name="dp_174">174dp</dimen>
+    <dimen name="dp_175">175dp</dimen>
+    <dimen name="dp_176">176dp</dimen>
+    <dimen name="dp_177">177dp</dimen>
+    <dimen name="dp_178">178dp</dimen>
+    <dimen name="dp_179">179dp</dimen>
+    <dimen name="dp_180">180dp</dimen>
+    <dimen name="dp_181">181dp</dimen>
+    <dimen name="dp_182">182dp</dimen>
+    <dimen name="dp_183">183dp</dimen>
+    <dimen name="dp_184">184dp</dimen>
+    <dimen name="dp_185">185dp</dimen>
+    <dimen name="dp_186">186dp</dimen>
+    <dimen name="dp_187">187dp</dimen>
+    <dimen name="dp_188">188dp</dimen>
+    <dimen name="dp_189">189dp</dimen>
+    <dimen name="dp_190">190dp</dimen>
+    <dimen name="dp_191">191dp</dimen>
+    <dimen name="dp_192">192dp</dimen>
+    <dimen name="dp_193">193dp</dimen>
+    <dimen name="dp_194">194dp</dimen>
+    <dimen name="dp_195">195dp</dimen>
+    <dimen name="dp_196">196dp</dimen>
+    <dimen name="dp_197">197dp</dimen>
+    <dimen name="dp_198">198dp</dimen>
+    <dimen name="dp_199">199dp</dimen>
+    <dimen name="dp_200">200dp</dimen>
+
+    <dimen name="sp_1">1sp</dimen>
+    <dimen name="sp_2">2sp</dimen>
+    <dimen name="sp_3">3sp</dimen>
+    <dimen name="sp_4">4sp</dimen>
+    <dimen name="sp_5">5sp</dimen>
+    <dimen name="sp_6">6sp</dimen>
+    <dimen name="sp_7">7sp</dimen>
+    <dimen name="sp_8">8sp</dimen>
+    <dimen name="sp_9">9sp</dimen>
+    <dimen name="sp_10">10sp</dimen>
+    <dimen name="sp_11">11sp</dimen>
+    <dimen name="sp_12">12sp</dimen>
+    <dimen name="sp_13">13sp</dimen>
+    <dimen name="sp_14">14sp</dimen>
+    <dimen name="sp_15">15sp</dimen>
+    <dimen name="sp_16">16sp</dimen>
+    <dimen name="sp_17">17sp</dimen>
+    <dimen name="sp_18">18sp</dimen>
+    <dimen name="sp_19">19sp</dimen>
+    <dimen name="sp_20">20sp</dimen>
+    <dimen name="sp_21">21sp</dimen>
+    <dimen name="sp_22">22sp</dimen>
+    <dimen name="sp_23">23sp</dimen>
+    <dimen name="sp_24">24sp</dimen>
+    <dimen name="sp_25">25sp</dimen>
+    <dimen name="sp_26">26sp</dimen>
+    <dimen name="sp_27">27sp</dimen>
+    <dimen name="sp_28">28sp</dimen>
+    <dimen name="sp_29">29sp</dimen>
+    <dimen name="sp_30">30sp</dimen>
+
+
 </resources>
\ No newline at end of file
diff --git a/VisualNovel/app/src/main/res/values/strings.xml b/VisualNovel/app/src/main/res/values/strings.xml
index 513ab57..cf9cff2 100644
--- a/VisualNovel/app/src/main/res/values/strings.xml
+++ b/VisualNovel/app/src/main/res/values/strings.xml
@@ -463,4 +463,6 @@
     <string name="about_us_desc_3">Contact Us: support@VisualNovel.ai</string>
     <string name="all">All</string>
 
+    <string name="from">from</string>
+
 </resources>
\ No newline at end of file
diff --git a/VisualNovel/app/src/main/res/values/styles.xml b/VisualNovel/app/src/main/res/values/styles.xml
index 00be17c..92f680c 100644
--- a/VisualNovel/app/src/main/res/values/styles.xml
+++ b/VisualNovel/app/src/main/res/values/styles.xml
@@ -230,4 +230,14 @@
         <item name="android:windowEnterAnimation">@anim/anim_keep</item>
         <item name="android:windowExitAnimation">@anim/anim_keep</item>
     </style>
+
+
+    <style name="Actor_Item_Corner_Shape">
+        <item name="cornerFamily">rounded</item>
+        <item name="cornerSizeTopLeft">5dp</item>
+        <item name="cornerSizeTopRight">25dp</item>
+        <item name="cornerSizeBottomLeft">25dp</item>
+        <item name="cornerSizeBottomRight">25dp</item>
+    </style>
+
 </resources>