RecyclerView 设置固定数目 Item

一、前言

很多时候会遇到使用 RecyclerView 时,要求超过一定数目的 Item 后,固定 RecyclerView 的高度,没有超过这个数目就自适应高度。这种情况更多会出现在对话框中,数量过多时不能让对话框占据整个屏幕,同时又能控制显示的 Item 个数,下面针对不同的情况可以使用不同的方法。

二、已知 Item 高度的情况下

在已知 Item 布局的高度的情况时,可以通过设置最大高度来控制显示的 Item 数目,因为 Item 高度已知,所以计算好高度就可以达到目的,下面是具体的实现:
看下效果,最大展示 3 个 Item,超过滚动展示:

在这里插入图片描述

    1. 布局界面,比较简单,就一个 RecyclerView,只要设置一个最大高度就可以了(注意:最大高度要使用layout_constraintHeight_max)
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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"
    xmlns:tools="http://schemas.android.com/tools">

<!--item高度固定可知时-->
    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/rv_recycler_fixed_one"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintHeight_max="240dp"
        android:background="@color/yellow_FF9B52"
        />


</androidx.constraintlayout.widget.ConstraintLayout>
    1. Activity 界面,简单的设置和数据设置,任意正常可用的 adapter 就可以
class RecyclerItemFixedActivity: AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_recycler_item_fixed)

        val list = arrayListOf<String>("测试数据一","测试数据二","测试数据三","测试数据四")
        val adapter by lazy { RecyclerItemFixedAdapter() }
        rv_recycler_fixed_one?.let {
            it.layoutManager = LinearLayoutManager(this)
            it.adapter = adapter
            it.addItemDecoration(DividerItemDecoration(this,LinearLayoutManager.VERTICAL))
        }
        adapter.setList(list)
    }
}
    1. 非常普通的 Item 布局,主要是高度固定
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="80dp"
    android:background="@color/green_07C0C2">

    <TextView
        android:id="@+id/tv_item_recycler_fixed_title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/app_name"
        android:textColor="@color/white"
        android:layout_centerInParent="true"/>
</RelativeLayout>

三、Item 高度无法确定时

对于这种情况,我查了很多资料,只有动态设置 RecyclerView 方法比较有效,在设置好 Adapter 后,获取单个 Item 的高度,然后就可以用代码设置 RecyclerView 的高度。如果有更好的方法实现的话,欢迎在评论中提出。效果图和上图基本一样。实现如下:

  • 1.布局文件
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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"
    android:background="@color/red_F7E6ED">


    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/rv_recycler_wrap_list"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:layout_constraintTop_toTopOf="parent"
        />

</androidx.constraintlayout.widget.ConstraintLayout>
    1. 简单的 Item文件,和上面的 Item 不同的地方就是高度不固定
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@color/green_07C0C2">

    <TextView
        android:id="@+id/tv_item_recycler_wrap2_title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/app_name"
        android:textColor="@color/white"
        android:layout_centerInParent="true"
        android:paddingVertical="@dimen/m10"/>
</RelativeLayout>
  • 3.简单的 adapter,仅仅设置一下展示数据
class RecyclerWrapAdapter(resId: Int = R.layout.item_recycelr_wrap2) :
    BaseQuickAdapter<String, BaseViewHolder>(resId) {
    override fun convert(holder: BaseViewHolder, item: String) {
        holder.setText(R.id.tv_item_recycler_wrap2_title, item)
    }
}
    1. activity 设置数据,最重要的是设置 RecyclerView 的高度,代码中有具体的注释
class RecyclerWrapActivity: AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_recyclerview_wrap)

        val list = arrayListOf("测试数据一","测试数据二","测试数据三","测试数据四","测试数据五","测试数据六")
        val adapter by lazy { RecyclerWrapAdapter() }
        rv_recycler_wrap_list?.let {
            it.layoutManager = LinearLayoutManager(this)
            it.adapter = adapter
            it.addItemDecoration(DividerItemDecoration(this, LinearLayoutManager.VERTICAL))
        }
        adapter.setList(list)

        //参考https://www.cnblogs.com/guanxinjing/p/13037156.html
        //动态设置recyclerview高度
        rv_recycler_wrap_list?.post {
            //假如固定4个,超过4个才需要设置
            if (list.size <= 4){
                return@post
            }
            val itemView = rv_recycler_wrap_list.getChildAt(0)
            itemView?.let {
                val height = it.height * 4
                val layoutParems = rv_recycler_wrap_list.layoutParams
                layoutParems.height = height
                rv_recycler_wrap_list.layoutParams = layoutParems
            }
        }
    }
}

四、横向滚动时

横向滚动时,一般是要求展示固定数目的 Item,超过数目则滚动展示,这个时候就要去动态设置 Item 布局的宽度来实现。如下图,展示 4.5个 Item,超过滚动:
![image.png](https://imgconvert.csdnimg.cn/aHR0cHM6Ly9jZG4ubmxhcmsuY29tL3l1cXVlLzAvMjAyMC9wbmcvMTYyNDcyNS8xNTk2MjkxNjY2MjExLTg2ODEyNzM4LTU5OTktNDdkOS05NDc5LWM5OWE4OTVkNTk1OC5wbmc?x-oss-process=image/format,png#align=left&display=inline&height=56&margin=[object Object]&name=image.png&originHeight=112&originWidth=668&size=24587&status=done&style=none&width=334)
![image.png](https://imgconvert.csdnimg.cn/aHR0cHM6Ly9jZG4ubmxhcmsuY29tL3l1cXVlLzAvMjAyMC9wbmcvMTYyNDcyNS8xNTk2MjkxNzAyMzMxLTRlNGM3OGU3LTBlYjktNGU1NS1iNmVlLTgxMjkxODg5MDBjYi5wbmc?x-oss-process=image/format,png#align=left&display=inline&height=51&margin=[object Object]&name=image.png&originHeight=102&originWidth=662&size=22937&status=done&style=none&width=331)

  • 1.布局界面,和上面都一样
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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"
    android:background="@color/red_F7E6ED">


    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/rv_recycler_wrap_list"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:layout_constraintTop_toTopOf="parent"
        />

</androidx.constraintlayout.widget.ConstraintLayout>
    1. activity,把方向改成横向滚动就可以了
class RecyclerViewWrapActivity: AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_recyclerview_wrap)

        val list = arrayListOf("测试数据一","测试数据二","测试数据三","测试数据四","测试数据五","测试数据六")
        val adapter by lazy { RecyclerItemWrapAdapter() }
        rv_recycler_wrap_list?.let {
            it.layoutManager = LinearLayoutManager(this,LinearLayoutManager.HORIZONTAL,false)
            it.adapter = adapter
            it.addItemDecoration(DividerItemDecoration(this, LinearLayoutManager.HORIZONTAL))
        }
        adapter.setList(list)
    }
}
    1. adapter,在里面设置 Item 的宽度
class RecyclerItemWrapAdapter(resId: Int = R.layout.item_recycelr_wrap)
    : BaseQuickAdapter<String,BaseViewHolder>(resId){
    override fun convert(holder: BaseViewHolder, item: String) {
        holder.setText(R.id.tv_item_recycler_wrap_title,item)

        //获取屏幕的宽度,进行分配,4.5代表可以放4.5个item,高度任意,这里是match_parent
        //如果设置了margin,需要减去margin
        // val width = (context.resources.displayMetrics.widthPixels - Utils.dip2px(context,margin)) / 4.5f
        //参考https://blog.csdn.net/qq_32518491/article/details/81033275?utm_medium=distribute.pc_relevant.none-task-blog-BlogCommendFromMachineLearnPai2-1.channel_param&depth_1-utm_source=distribute.pc_relevant.none-task-blog-BlogCommendFromMachineLearnPai2-1.channel_param
        val width = (context.resources.displayMetrics.widthPixels) / 4.5f
        val params = ViewGroup.LayoutParams(
            width.toInt(),
            ViewGroup.LayoutParams.MATCH_PARENT
        )
        holder.itemView.layoutParams = params

    }
    
}
    1. Item 布局,高度可以固定,可以不固定,宽度 wrap_content
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="@color/green_07C0C2">

    <TextView
        android:id="@+id/tv_item_recycler_wrap_title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/app_name"
        android:textColor="@color/white"
        android:layout_centerInParent="true"
        android:paddingVertical="@dimen/m10"
        />
</RelativeLayout>

五、地址和参考:

Github
Android开发 在有指定数量item后固定RecyclerView高度
Android RecyclerView的item宽度保持四个半

  • 5
    点赞
  • 7
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
RecyclerViewAndroid中常用的列表控件,用于展示大量数据。要实现RecyclerViewitem动画展开折叠效果,可以通过自定义动画和布局参数的方式来实现。 首先,需要为RecyclerViewitem布局添加动画效果。可以使用属性动画或者动画资源文件来实现。例如可以使用属性动画将item的宽度从0变为原始宽度,实现展开效果;或者使用动画资源文件定义透明度的变化,实现淡入淡出效果。这样,在item被添加到RecyclerView中时,会播放动画效果,实现展开折叠的效果。 其次,为了在item展开时使其占用更多的空间,需要设置item的布局参数。可以通过修改item的宽度、高度、权重等属性,来实现展开折叠的效果。例如,在展开时,可以将item的宽度设置为match_parent,高度设为固定值或者根据内容自适应的值,从而让item占据更多的空间,显示更多的内容;在折叠时,可以将item的宽度设置为wrap_content,高度设置固定值或者较小的值,从而让item占据较少的空间,显示较少的内容。 最后,需要在RecyclerView的适配器中编写代码来控制item的展开折叠。可以使用标志位或者数据集合的状态来记录item的展开折叠状态,在适配器的ViewHolder中根据状态来设置item的动画和布局参数。例如,在item展开时,可以将展开状态设置为true,并为item添加展开动画和修改布局参数的代码;在item折叠时,将展开状态设置为false,并为item添加折叠动画和恢复原始布局参数的代码。 总之,要实现RecyclerViewitem动画展开折叠效果,需要为item添加动画效果,修改item的布局参数,并在适配器中控制item的展开折叠状态以及动画和布局参数的设置。这样就可以实现一个具有动画效果的可展开折叠的RecyclerView列表。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值