关于android:实战-认识-RecyclerView

31次阅读

共计 7305 个字符，预计需要花费 19 分钟才能阅读完成。

RecyclerView 是一款十分弱小的 widget，它能够帮忙您灵便地显示列表数据。当我开始学习 RecyclerView 的时候，我发现对于简单的列表界面有很多资源能够参考，然而对于简略的列表展示就鲜有可参考的资源了。尽管 RecyclerView 的组成构造乍一看有些简单，然而深刻了解当前您会发现它其实十分简单明了。

本文会通过创立一个简略的 RecyclerView 实现一个列表来显示不同品种的花的名字。在实现的过程中，我也会将 RecyclerView 的每个局部揉碎了展示给大家，这样大家就能够在本人的利用中实现了。

RecyclerView 是 “ 何方神圣 ”？为什么抉择它呢？

RecyclerView 是一个容器，它用于显示列表模式 (list) 或者网格模式 (grid) 的数据，比方文本或者照片。

当列表滑动的时候，实际上只有大量邻近的视图会显示在屏幕上。当视图滑出屏幕时，RecyclerView 会复用它并且填充新的数据。因为它是通过回收已有的构造而不是继续创立新的列表项，所以它能够无效进步利用的工夫效率和空间效率。

粉红色的方格示意屏幕上正在显示的表项，黄色的方格示意屏幕可视范畴之外的表项是如何被回收并转为新的视图

为什么您须要应用 RecyclerView 呢？

  • RecyclerView 应用 ViewHolder 模式，这样做能够进步性能，因为它无需频繁调用 findViewById() 办法即可拜访表项的视图；
  • RecyclerView 应用 LayoutManager，它反对纵向滑动的列表和横向滑动的列表，以及交织布局的列表和网格布局的列表。您还能够创立自定义的 LayoutManager；
  • RecyclerView 提供默认的表项动画以及自定义动画的入口。

总之，RecyclerView 兼顾了灵活性和个性化，所以它是功能强大的工具。

实现 RecyclerView

本文会为大家展现如何实现一个简略的 RecyclerView，用它来显示不同品种花的名称。上面的代码会应用 Kotlin 语言，然而 RecyclerView 也能够在 Java 语言中应用。

首先在 Android Studio 里创立一个工程，并且应用 Empty Activity 模板。设置项目名称，并且抉择 Kotlin 作为我的项目所用的语言。

接下来在 app 级的 build.gradle 文件里引入 最新版本 的 RecyclerView 依赖。

 2019 Google LLC. 
   SPDX-License-Identifier: Apache-2.0 -->

// 在 https://developer.android.google.cn/jetpack/androidx/releases/recyclerview 取得最新版本号
def recyclerview_version = "1.1.0"

implementation 'androidx.recyclerview:recyclerview:$recyclerview_version

RecyclerView 数据

RecyclerView 最重要的组成部分之一就是须要显示的数据。对于比较复杂的利用来说，数据可能是来自数据库或者来自于网络，不过这里咱们简略应用字符串资源文件作为利用的数据源。

在 strings.xml 文件中，创立一个字符串数组来寄存花的名称。

 <!-- Copyright 2019 Google LLC. 
   SPDX-License-Identifier: Apache-2.0 -->

<resources>
    <string name="app_name">RecyclerSample</string>
    <string-array name="flower_array">
        <item>Lily</item>
        <item>Poppy</item>
        <item>Sunflower</item>
        <item>Freesia</item>
        <item>Daisy</item>
        <item>Rose</item>
        <item>Daffodil</item>
        <item>Lavender</item>
        <item>Peony</item>
        <item>Lilac</item>
        <item>Dahlia</item>
        <item>Tulip</item>
        <item>Dandelion</item>
        <item>Geranium</item>
        <item>Gardenia</item>
        <item>Rhododendron</item>
        <item>Azalea</item>
    </string-array>

</resources>

而后，创立一个类，名字为 Datasource，并且能够接管一个 Context 类型的参数。创立一个叫做 getFlowerList() 的函数，它负责返回花的名称列表。

<!-- Copyright 2019 Google LLC. 
   SPDX-License-Identifier: Apache-2.0 -->

class Datasource(val context: Context) {fun getFlowerList(): Array<String> {return context.resources.getStringArray(R.array.flower_array)
    }
}

在 MainActivity.onCreate() 中，创立一个变量叫做 flowerList，而后将 getFlowerList() 的返回后果赋给它。

<!-- Copyright 2019 Google LLC. 
   SPDX-License-Identifier: Apache-2.0 -->

override fun onCreate(savedInstanceState: Bundle?) {super.onCreate(savedInstanceState)
  setContentView(R.layout.activity_main)
  val flowerList = Datasource(this).getFlowerList()}

RecyclerView 布局

接下来，在 activity_main 布局文件中将 TextView 替换为 RecyclerView，并且将其 layoutManager 设置为 LinearLayoutManager。应用 LinearLayoutManager 意味着将来数据将以纵向列表或者横向列表的模式显示 (默认是纵向列表)。

 <!-- Copyright 2019 Google LLC. 
   SPDX-License-Identifier: Apache-2.0 -->

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
   android:layout_width="match_parent"
   android:layout_height="match_parent"
   xmlns:app="http://schemas.android.com/apk/res-auto">

   <androidx.recyclerview.widget.RecyclerView
       android:id="@+id/recycler_view"
       android:layout_width="match_parent"
       android:layout_height="match_parent"
       app:layoutManager="LinearLayoutManager"/>
</FrameLayout>

表项布局

下面的示意图示意一个蕴含数据表项的 RecyclerView。在这里，组成 RecyclerView 的表项 (Item) 里会蕴含花的名称。

创立一个新的布局文件，将它命名为 flower_item，它用来决定每一个表项的显示布局。本例中布局仅须要显示一个鲜花的名称，所以这里只须要 TextView。

<!-- Copyright 2019 Google LLC. 
   SPDX-License-Identifier: Apache-2.0 -->

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <TextView
        android:id="@+id/flower_text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="32sp" />
</FrameLayout>

拆分 Adapter 类

接下来是 RecyclerView 的重头戏了，也就是 ViewHolder 和 Adapter 类。ViewHolder 负责存储 RecyclerView 中每一个独自的表项所须要显示的信息。RecyclerView 仅须要创立以后所显示的表项数量的 ViewHolder 外加缓存中的几个 ViewHolder 即可。随着用户滑动屏幕，ViewHolder 会被回收 (应用新数据进行填充)，已有的表项会在一端隐没，并且在另一端显示一个新的表项。Adapter 类从数据源取得数据，并且将数据传递给正在更新其所持视图的 ViewHolder。下图显示了 RecyclerView、Adapter、ViewHolder 和数据之间的协作关系。

创立 Adapter

创立一个叫做 FlowerAdapter 的类，所需显示的列表数据作为该类的参数。

<!-- Copyright 2019 Google LLC. 
   SPDX-License-Identifier: Apache-2.0 -->

class FlowerAdapter(val flowerList: Array<String>) {}

创立 ViewHolder

创立一个叫做 FlowerViewHolder 的外部类，并且它能够接管一个 itemView 作为参数。在 ViewHolder 中，创立一个变量来援用 TextView，而后将它指向表项布局里对应的视图。而后创立 bind() 函数，它用来将花的名字 ( 字符串) 和携带数据的 UI (flowerTextView) 关联起来。bind() 函数接管传入的字符串，并且将字符串作为 flowerTextView 的文本内容。

<!-- Copyright 2019 Google LLC. 
   SPDX-License-Identifier: Apache-2.0 -->

class FlowerViewHolder(itemView: View) : RecyclerView.ViewHolder(itemView){private val flowerTextView:TextView = itemView.findViewById(R.id.flower_text)
  fun bind(word: String){flowerTextView.text = word}
}

继承 RecyclerView.Adapter

更新 FlowerAdapter 的类定义，使其继承 RecyclerView.Adapter 类，并且将 FlowerViewHolder 作为参数传入。

<!-- Copyright 2019 Google LLC. 
   SPDX-License-Identifier: Apache-2.0 -->

class FlowerAdapter(val flowerList: Array<String>) :
    RecyclerView.Adapter<FlowerAdapter.FlowerViewHolder>() {}

重写 RecyclerView.Adapter 的类须要重写三个办法 onCreateViewHolder()、onBindViewHolder() 和 getItemCount()。

重写 onCreateViewHolder()

当 ViewHolder 创立的时候会调用该办法。在该办法里进行初始化和填充 RecyclerView 中的表项视图。该视图应用后面咱们创立的用于显示文本的布局。

<!-- Copyright 2019 Google LLC. 
   SPDX-License-Identifier: Apache-2.0 -->

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

重写 onBindViewHolder()

onBindViewHolder() 被调用的时候，会传入参数 ViewHolder 和一个地位 (position)，它示意在 flowerList 中所绑定的表项的地位。该地位能够用于提取表项所需的数据，并且将数据传递给 ViewHolder 来使数据绑定到对应的 UI。

<!-- Copyright 2019 Google LLC. 
   SPDX-License-Identifier: Apache-2.0 -->

override fun onBindViewHolder(holder: FlowerViewHolder, position: Int) {holder.bind(flowerList[position])
}

重写 getItemCount()

RecyclerView 显示一个列表，所以它须要晓得列表里共有多少项。因为 flowerList 就是数据源，所以间接返回它的长度即可。

<!-- Copyright 2019 Google LLC. 
   SPDX-License-Identifier: Apache-2.0 -->

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

实现 Adapter 代码 

<!-- Copyright 2019 Google LLC. 
   SPDX-License-Identifier: Apache-2.0 -->

class FlowerAdapter(val flowerList: Array<String>) :
    RecyclerView.Adapter<FlowerAdapter.FlowerViewHolder>() {

    // 形容表项视图并且将它放在 RecyclerView 中
    class FlowerViewHolder(itemView: View) : RecyclerView.ViewHolder(itemView) {private val flowerTextView: TextView = itemView.findViewById(R.id.flower_text)

        fun bind(word: String) {flowerTextView.text = word}
    }

    // 返回一个新的 ViewHolder
    override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): FlowerViewHolder {val view = LayoutInflater.from(parent.context)
            .inflate(R.layout.flower_item, parent, false)

        return FlowerViewHolder(view)
    }

    // 返回数据列表的长度
    override fun getItemCount(): Int {return flowerList.size}

    // 显示一个指定地位的数据
    override fun onBindViewHolder(holder: FlowerViewHolder, position: Int) {holder.bind(flowerList[position])
    }
}

连贯到 MainActivity

咱们曾经创立了布局、数据列表和 adapter。当初咱们能够将 RecyclerView 增加到 MainActivity，并且将 Adapter 赋值给它。

定义一个变量叫做 recyclerView，而后将 activity_main 中的 RecyclerView 赋值给 recyclerView。将 FlowerAdapter 作为您 recyclerView 的 adapter。

<!-- Copyright 2019 Google LLC. 
   SPDX-License-Identifier: Apache-2.0 -->

class MainActivity : AppCompatActivity() {override fun onCreate(savedInstanceState: Bundle?) {super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        val flowerList = Datasource(this).getFlowerList()
        val recyclerView: RecyclerView = findViewById(R.id.recycler_view)
        recyclerView.adapter = FlowerAdapter(flowerList)
    }
}

当初咱们运行一下，而后看看它操作起来如何:

下一步

残缺代码请点击 这里。

下面的例子为大家展现了如何实现 RecyclerView 的几个组成部分来显示简略的文本元素。当然 RecyclerView 能够蕴含更多乏味和简单的元素，咱们将在将来的文章和示例中为大家展现。

更多资源，请参阅:

  • RecyclerView Sample — Kotlin
  • RecyclerView Sample — Java
  • RecyclerView Documentation
  • Create a List with RecyclerView

正文完
android
发表至： android
2021-04-08
 0
关于android:Android-FlexboxLayout流式布局
关于an-d-ro-id:烤面经了2022Android最新大厂面试真题总结先收藏了-可带劲了
关于android:View的事件分发及滑动冲突的解决
关于android:备战金三银四阿里内部这份2022年Android中高级面试题汇总我先冲了