如何在 Android 中使用 RecyclerView 在滚动上创建折叠工具栏和 FAB？

在本文中，我们将使用 RecyclerView 在滚动时创建一个折叠工具栏和浮动操作按钮 (FAB)。许多流行的应用程序都有这种效果，例如。领英。下面是示例视频，用于展示我们将要构建的内容。请注意，我们将使用Kotlin语言来实现这个项目。

分步实施

第 1 步：创建一个新项目

要在 Android Studio 中创建新项目，请参阅如何在 Android Studio 中创建/启动新项目。请注意，选择Kotlin作为编程语言。

第二步：添加视图绑定依赖

转到 build.gradle(app) 和 android 标签内的以下依赖项，然后单击立即同步。

buildFeatures {

     viewBinding true

 }

步骤 3：使用 activity_main.xml 文件

转到activity_main.xml文件并参考以下代码。下面是activity_main.xml文件的代码。代码中添加了注释以更详细地理解代码。

第 4 步：创建一个新的布局文件并将其命名为 single_item.xml 文件

转到single_item.xml文件并参考以下代码。下面是single_item.xml文件的代码。这是我们将在 RecyclerView 中使用的单项布局。

第 5 步：创建一个新的模型类

创建一个新类Language.kt，我们将使用自定义通用“Language”的数据传入将在回收器视图中显示的列表。

科特林

// this is the Language model class
class Language(
    val name : String ="",
    val exp : String = ""
)

第 6 步：使用适配器类

创建一个新类RvAdapter.kt，它将作为回收器视图的适配器类。为了更好的理解，在代码之前添加了注释。

科特林

import android.view.LayoutInflater
import android.view.ViewGroup
import androidx.recyclerview.widget.RecyclerView
import com.introidx.collapsingtoolbargfg.databinding.SingleItemBinding
  
class RvAdapter(
    private var languageList: List) : RecyclerView.Adapter() {
  
    // create an inner class with name ViewHolder
    // It takes a view argument, in which pass the 
    // generated class of single_item.xml
    // ie SingleItemBinding and in the 
    // RecyclerView.ViewHolder(binding.root) pass it like this
    inner class ViewHolder(val binding: SingleItemBinding) : RecyclerView.ViewHolder(binding.root)
  
    override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): ViewHolder {
        val binding = SingleItemBinding.inflate(LayoutInflater.from(parent.context), parent, false)
        return ViewHolder(binding)
    }
  
    // bind the items with each item of 
    // the list languageList which than will be
    // shown in recycler view
    // to keep it simple we are not 
    // setting any image data to view
    override fun onBindViewHolder(holder: ViewHolder, position: Int) {
        with(holder) {
            with(languageList[position]) {
                // set text to language name
                binding.tvLangName.text = this.name
                // set exp
                binding.tvExp.text = this.exp
            }
        }
    }
  
    // return the size of languageList
    override fun getItemCount(): Int {
        return languageList.size
    }
}

第 7 步：使用 MainActivity.kt

转到MainActivity.kt文件并参考以下代码。下面是MainActivity.kt文件的代码。代码中添加了注释以更详细地理解代码。

科特林

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import androidx.recyclerview.widget.LinearLayoutManager
import com.introidx.collapsingtoolbargfg.databinding.ActivityMainBinding
  
class MainActivity : AppCompatActivity() {
  
    // view binding for the activity
    private var _binding: ActivityMainBinding? = null
    private val binding get() = _binding!!
  
    // get reference to the adapter class
    private var languageList = ArrayList()
    private lateinit var rvAdapter: RvAdapter
  
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        _binding = ActivityMainBinding.inflate(layoutInflater)
        setContentView(binding.root)
  
        // define layout manager for the Recycler view
        binding.recyclerView.layoutManager = LinearLayoutManager(this)
          
        // attach adapter to the recycler view and also handle item click
  
        // attach adapter to the recycler view
        rvAdapter = RvAdapter(languageList)
  
        // add adapter to the recycler view
        binding.recyclerView.adapter = rvAdapter
  
        // create objects of Language
        // create some row data
        val language1 = Language("Java", "3 Year exp")
        val language2 = Language("Kotlin", "2 Year exp")
        val language3 = Language("Python", "1 Year exp")
        val language4 = Language("CPP", "5 Year exp")
        val language5 = Language("PHP", "No exp")
  
        // pass raw data t rhe list
        languageList.add(language1)
        languageList.add(language2)
        languageList.add(language3)
        languageList.add(language4)
        languageList.add(language5)
        languageList.add(language3)
        languageList.add(language4)
        languageList.add(language5)
        languageList.add(language3)
        languageList.add(language4)
        languageList.add(language5)
  
        rvAdapter.notifyDataSetChanged()
  
    }
  
    // on destroy of view make the 
      // binding reference to null
    override fun onDestroy() {
        super.onDestroy()
        _binding = null
    }
}

输出：

想要一个更快节奏和更具竞争力的环境来学习 Android 的基础知识吗？

单击此处前往由我们的专家精心策划的指南，旨在让您立即做好行业准备！