介绍

在 Android 开发中，我们通常需要在应用中呈现一些内容，比如图片、文字等等。为了更好的展示这些内容，我们经常使用 RecyclerView 和 CardView 来实现。

本文将介绍如何在 Android 中使用 RecyclerView 和 CardView，以及一些示例代码。

RecyclerView

RecyclerView 是 Android 中一个强大的控件，它可以帮助我们展示大量的数据。

如何使用

使用 RecyclerView 需要进行以下几个步骤：

1. 在 build.gradle 文件中添加依赖

implementation 'androidx.recyclerview:recyclerview:1.2.0'

2. 在布局文件中添加 RecyclerView 控件

<androidx.recyclerview.widget.RecyclerView
    android:id="@+id/recyclerView"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    />

3. 创建 RecyclerView.Adapter 和 ViewHolder 类

class MyAdapter(private val dataList: List<String>) : RecyclerView.Adapter<MyAdapter.ViewHolder>() {

    class ViewHolder(itemView: View) : RecyclerView.ViewHolder(itemView) {
        val textView: TextView = itemView.findViewById<TextView>(R.id.textView)
    }

    override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): ViewHolder {
        val view = LayoutInflater.from(parent.context).inflate(
            R.layout.item_view,
            parent, false
        )
        return ViewHolder(view)
    }

    override fun onBindViewHolder(holder: ViewHolder, position: Int) {
        holder.textView.text = dataList[position]
    }

    override fun getItemCount(): Int {
        return dataList.size
    }
}

4. 在 Activity 或 Fragment 中设置 RecyclerView.Adapter 和 LayoutManager

val dataList = listOf("Android", "Java", "Kotlin", "Flutter", "React Native")

val myAdapter = MyAdapter(dataList)
recyclerView.adapter = myAdapter

val layoutManager = LinearLayoutManager(this)
recyclerView.layoutManager = layoutManager

示例代码

下面是一个简单的示例代码，展示如何使用 RecyclerView 来展示一些文本内容。

布局文件（activity_main.xml）

<androidx.recyclerview.widget.RecyclerView
    android:id="@+id/recyclerView"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    />

ViewHolder 布局文件（item_view.xml）

<TextView
    android:id="@+id/textView"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:padding="16dp"
    android:textSize="16sp"
    />

RecyclerView.Adapter 和 ViewHolder 类

class MyAdapter(private val dataList: List<String>) : RecyclerView.Adapter<MyAdapter.ViewHolder>() {

    class ViewHolder(itemView: View) : RecyclerView.ViewHolder(itemView) {
        val textView: TextView = itemView.findViewById<TextView>(R.id.textView)
    }

    override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): ViewHolder {
        val view = LayoutInflater.from(parent.context).inflate(
            R.layout.item_view,
            parent, false
        )
        return ViewHolder(view)
    }

    override fun onBindViewHolder(holder: ViewHolder, position: Int) {
        holder.textView.text = dataList[position]
    }

    override fun getItemCount(): Int {
        return dataList.size
    }
}

Activity 类

class MainActivity : AppCompatActivity() {

    lateinit var recyclerView: RecyclerView

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        recyclerView = findViewById(R.id.recyclerView)

        val dataList = listOf("Android", "Java", "Kotlin", "Flutter", "React Native")

        val myAdapter = MyAdapter(dataList)
        recyclerView.adapter = myAdapter

        val layoutManager = LinearLayoutManager(this)
        recyclerView.layoutManager = layoutManager
    }
}

CardView

CardView 是一个用于展示信息的控件，它提供了一个类似于卡片的 UI 设计。

如何使用

使用 CardView 需要进行以下几个步骤：

1. 在 build.gradle 文件中添加依赖

implementation 'androidx.cardview:cardview:1.0.0'

2. 在布局文件中添加 CardView 控件

<androidx.cardview.widget.CardView
    android:id="@+id/cardView"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_margin="16dp"
    app:cardCornerRadius="8dp"
    app:cardElevation="4dp"
    app:cardUseCompatPadding="true"
    >

    <TextView
        android:id="@+id/textView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:padding="16dp"
        android:textSize="16sp"
        />
</androidx.cardview.widget.CardView>

3. 在 Activity 或 Fragment 中设置 CardView 控件的属性和内容

val cardView = findViewById<CardView>(R.id.cardView)
val textView = findViewById<TextView>(R.id.textView)
textView.text = "Hello World"

示例代码

下面是一个简单的示例代码，展示如何使用 CardView 来展示一些文本内容。

布局文件（activity_main.xml）

<androidx.cardview.widget.CardView
    android:id="@+id/cardView"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_margin="16dp"
    app:cardCornerRadius="8dp"
    app:cardElevation="4dp"
    app:cardUseCompatPadding="true"
    >

    <TextView
        android:id="@+id/textView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:padding="16dp"
        android:textSize="16sp"
        />
</androidx.cardview.widget.CardView>

Activity 类

class MainActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        val cardView = findViewById<CardView>(R.id.cardView)
        val textView = findViewById<TextView>(R.id.textView)
        textView.text = "Hello World"
    }
}

RecyclerView 和 CardView 结合使用

RecyclerView 和 CardView 可以结合使用，来同时展示多个卡片视图。

如何使用

使用 RecyclerView 和 CardView 结合使用需要进行以下几个步骤：

1. 在 build.gradle 文件中添加依赖

implementation 'androidx.recyclerview:recyclerview:1.2.0'
implementation 'androidx.cardview:cardview:1.0.0'

2. 在布局文件中添加 RecyclerView 控件

<androidx.recyclerview.widget.RecyclerView
    android:id="@+id/recyclerView"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    />

3. 在 RecyclerView.Adapter 中创建 ViewHolder，将 CardView 控件作为 item 布局

class MyAdapter(private val dataList: List<String>) : RecyclerView.Adapter<MyAdapter.ViewHolder>() {

    class ViewHolder(view: View) : RecyclerView.ViewHolder(view) {
        val cardView = view.findViewById<CardView>(R.id.cardView)
        val textView = view.findViewById<TextView>(R.id.textView)
    }

    override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): ViewHolder {
        val view = LayoutInflater.from(parent.context).inflate(R.layout.item_view, parent, false)
        return ViewHolder(view)
    }

    override fun onBindViewHolder(holder: ViewHolder, position: Int) {
        holder.textView.text = dataList[position]
    }

    override fun getItemCount(): Int {
        return dataList.size
    }
}

4. 在 item_view.xml 中添加 CardView 控件和 TextView 控件，用于显示内容

<androidx.cardview.widget.CardView
    android:id="@+id/cardView"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:cardBackgroundColor="@color/card_background_color"
    app:cardCornerRadius="8dp"
    app:cardElevation="4dp"
    app:cardUseCompatPadding="true">

    <TextView
        android:id="@+id/textView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:padding="16dp"
        android:textSize="16sp" />

</androidx.cardview.widget.CardView>

5. 在 Activity 或 Fragment 中设置 RecyclerView.Adapter 和 LayoutManager

val dataList = listOf("Android", "Java", "Kotlin", "Flutter", "React Native")

val myAdapter = MyAdapter(dataList)
recyclerView.adapter = myAdapter

val layoutManager = LinearLayoutManager(this)
recyclerView.layoutManager = layoutManager

示例代码

下面是一个简单的示例代码，展示如何使用 RecyclerView 和 CardView 结合使用来展示多个卡片视图。

布局文件（activity_main.xml）

<androidx.recyclerview.widget.RecyclerView
    android:id="@+id/recyclerView"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />

ViewHolder 布局文件（item_view.xml）

<androidx.cardview.widget.CardView
    android:id="@+id/cardView"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:cardBackgroundColor="@color/card_background_color"
    app:cardCornerRadius="8dp"
    app:cardElevation="4dp"
    app:cardUseCompatPadding="true">

    <TextView
        android:id="@+id/textView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:padding="16dp"
        android:textSize="16sp" />

</androidx.cardview.widget.CardView>

RecyclerView.Adapter 和 ViewHolder 类

class MyAdapter(private val dataList: List<String>) : RecyclerView.Adapter<MyAdapter.ViewHolder>() {

    class ViewHolder(view: View) : RecyclerView.ViewHolder(view) {
        val cardView = view.findViewById<CardView>(R.id.cardView)
        val textView = view.findViewById<TextView>(R.id.textView)
    }

    override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): ViewHolder {
        val view = LayoutInflater.from(parent.context).inflate(R.layout.item_view, parent, false)
        return ViewHolder(view)
    }

    override fun onBindViewHolder(holder: ViewHolder, position: Int) {
        holder.textView.text = dataList[position]
    }

    override fun getItemCount(): Int {
        return dataList.size
    }
}

Activity 类

class MainActivity : AppCompatActivity() {

    lateinit var recyclerView: RecyclerView

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        recyclerView = findViewById(R.id.recyclerView)

        val dataList = listOf("Android", "Java", "Kotlin", "Flutter", "React Native")

        val myAdapter = MyAdapter(dataList)
        recyclerView.adapter = myAdapter

        val layoutManager = LinearLayoutManager(this)
        recyclerView.layoutManager = layoutManager
    }
}

总结

以上就是 RecyclerView 和 CardView 在 Android 开发中的使用方法和示例代码。希望这篇文章能对 Android 开发者有所帮助。