a.jpg
简介
RecyclerView 是 Android 中极其重要的一个高级 UI 控件，使用频率非常非常高，App 中 90% 以上的页面都会使用的到。由于其出色的性能和插拔式的架构设计，被全世界广大开发者一致称赞。
25.png
准备
添加 Kotlin 的扩展插件，可以直接使用布局中的控件 id 来操作 view 控件，不再 findViewById()。大大提高工作效率，减少模板代码量。
- 在根目录 build.gradle 添加:
dependencies {
...
classpath "org.jetbrains.kotlin:kotlin-android-extensions:$kotlin_version"
}
- 在 app/build.gradle 添加：
plugins {
...
id 'kotlin-android-extensions'
}
LinearLayoutManager (线性布局)
1. 效果图
26.png
2. 布局文件
item_fruit.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="60dp"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:layout_gravity="center_vertical"
android:orientation="horizontal">
<ImageView
android:id="@+id/iv_fruit"
android:layout_width="45dp"
android:layout_height="45dp"
android:layout_gravity="center_vertical"
android:layout_marginLeft="12dp"
android:layout_marginRight="12dp"
android:src="@mipmap/ic_apple"/>
<TextView
android:id="@+id/tv_fruit_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:textColor="@color/black"
android:textSize="18sp"
android:textStyle="bold"
android:text="Apple"
android:layout_marginLeft="10dp"/>
</LinearLayout>
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#F3F3F3"/>
</LinearLayout>
fragment_home.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context=".ui.home.HomeFragment">
<TextView
android:id="@+id/text_home"
android:layout_width="match_parent"
android:layout_height="60dp"
android:background="@color/teal_200"
android:gravity="center"
android:textColor="@color/white"
android:textStyle="bold"
android:text="LinearLayoutManager 列表布局"
android:textSize="20sp" />
<androidx.recyclerview.widget.RecyclerView
android:id="@+id/rv_fruit"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</LinearLayout>
- kotlin 代码
class HomeFragment : Fragment(R.layout.fragment_home) {
override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
super.onViewCreated(view, savedInstanceState)
rv_fruit.layoutManager = LinearLayoutManager(context,LinearLayoutManager.VERTICAL,false)
rv_fruit.adapter = MyAdapter()
}
inner class MyAdapter : RecyclerView.Adapter<MyViewHolder>(){
override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): MyViewHolder {
val itemView = LayoutInflater.from(context)
.inflate(R.layout.item_fruit,parent,false)
return MyViewHolder(itemView)
}
override fun onBindViewHolder(holder: MyViewHolder, position: Int) {
// kotlin 三种方式加载图片资源
holder.itemView.iv_fruit.setImageResource(R.mipmap.ic_apple)
// context!! 表示context 不为null
/*holder.itemView.iv_fruit.setImageDrawable(
ContextCompat.getDrawable(
context!!,
R.mipmap.ic_apple
)
)
holder.itemView.iv_fruit.setImageBitmap(
BitmapFactory.decodeResource(
context!!.resources,
R.mipmap.ic_apple
)
)*/
holder.itemView.tv_fruit_name.text = "【${position}】Apple"
}
override fun getItemCount(): Int {
return 20
}
}
class MyViewHolder(view: View) : RecyclerView.ViewHolder(view) {}
}
GridLayoutManager (网格布局)
1. 效果图
27.png
2. 布局文件
item_fruit_grid.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/teal_200"
android:layout_margin="12dp"
android:orientation="vertical">
<ImageView
android:id="@+id/iv_fruit"
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_gravity="center_horizontal"
android:src="@mipmap/ic_apple"/>
<TextView
android:id="@+id/tv_fruit_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:textColor="@color/white"
android:textSize="16sp"
android:layout_gravity="center_horizontal"/>
</LinearLayout>
fragment_dashboard.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context=".ui.dashboard.DashboardFragment">
<TextView
android:id="@+id/text_home"
android:layout_width="match_parent"
android:layout_height="60dp"
android:background="@color/teal_200"
android:gravity="center"
android:textColor="@color/white"
android:textStyle="bold"
android:text="GirdLayoutManager 网格布局"
android:textSize="20sp" />
<androidx.recyclerview.widget.RecyclerView
android:id="@+id/rv_fruit"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</LinearLayout>
- kotlin 代码
class DashboardFragment : Fragment(R.layout.fragment_dashboard) {
override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
super.onViewCreated(view, savedInstanceState)
rv_fruit.layoutManager = GridLayoutManager(context, 3)
rv_fruit.adapter = MyAdapter()
}
inner class MyAdapter : RecyclerView.Adapter<MyViewHolder>(){
override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): MyViewHolder {
val itemView = LayoutInflater.from(context)
.inflate(R.layout.item_fruit_grid,parent,false)
return MyViewHolder(itemView)
}
override fun onBindViewHolder(holder: MyViewHolder, position: Int) {
holder.itemView.iv_fruit.setImageResource(R.mipmap.ic_apple)
holder.itemView.tv_fruit_name.text = "【${position}】Apple"
}
override fun getItemCount(): Int {
return 20
}
}
class MyViewHolder(view: View) : RecyclerView.ViewHolder(view) {}
网友评论