RecyclerView 設置固定數(shù)目 Item

一炸庞、前言

很多時候會遇到使用 RecyclerView 時沛婴,要求超過一定數(shù)目的 Item 后,固定 RecyclerView 的高度姑丑,沒有超過這個數(shù)目就自適應高度。這種情況更多會出現(xiàn)在對話框中栅哀,數(shù)量過多時不能讓對話框占據(jù)整個屏幕称龙,同時又能控制顯示的 Item 個數(shù),下面針對不同的情況可以使用不同的方法鲫尊。

二痴柔、已知 Item 高度的情況下

在已知 Item 布局的高度的情況時疫向,可以通過設置最大高度來控制顯示的 Item 數(shù)目,因為 Item 高度已知搔驼,所以計算好高度就可以達到目的谈火,下面是具體的實現(xiàn):<br />看下效果堆巧,最大展示 3 個 Item泼菌,超過滾動展示:<br />
iShot2020-08-0121.56.41.gif
iShot2020-08-0121.56.41.gif
    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 界面嘉蕾,簡單的設置和數(shù)據(jù)設置,任意正忱苈剩可用的 adapter 就可以
class RecyclerItemFixedActivity: AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_recycler_item_fixed)

        val list = arrayListOf<String>("測試數(shù)據(jù)一","測試數(shù)據(jù)二","測試數(shù)據(jù)三","測試數(shù)據(jù)四")
        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>

<a name="jQDp4"></a>

三、Item 高度無法確定時

對于這種情況个绍,我查了很多資料浪汪,只有動態(tài)設置 RecyclerView 方法比較有效吟宦,在設置好 Adapter 后,獲取單個 Item 的高度殃姓,然后就可以用代碼設置 RecyclerView 的高度袁波。如果有更好的方法實現(xiàn)的話,歡迎在評論中提出蜗侈。效果圖和上圖基本一樣篷牌。實現(xiàn)如下:

  • 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该面,僅僅設置一下展示數(shù)據(jù)
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 設置數(shù)據(jù)隔缀,最重要的是設置 RecyclerView 的高度,代碼中有具體的注釋
class RecyclerWrapActivity: AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_recyclerview_wrap)

        val list = arrayListOf("測試數(shù)據(jù)一","測試數(shù)據(jù)二","測試數(shù)據(jù)三","測試數(shù)據(jù)四","測試數(shù)據(jù)五","測試數(shù)據(jù)六")
        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
        //動態(tài)設置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
            }
        }
    }
}

<a name="MBual"></a>

四、橫向滾動時

橫向滾動時淮悼,一般是要求展示固定數(shù)目的 Item揽思,超過數(shù)目則滾動展示钉汗,這個時候就要去動態(tài)設置 Item 布局的寬度來實現(xiàn)锡宋。如下圖执俩,展示 4.5個 Item癌刽,超過滾動:<br />
image.png
image.png

<br />
image.png
image.png
  • 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("測試數(shù)據(jù)一","測試數(shù)據(jù)二","測試數(shù)據(jù)三","測試數(shù)據(jù)四","測試數(shù)據(jù)五","測試數(shù)據(jù)六")
        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>

<a name="R77jF"></a>

五阅懦、地址和參考:

Github
Android開發(fā) 在有指定數(shù)量item后固定RecyclerView高度
Android RecyclerView的item寬度保持四個半

?著作權歸作者所有,轉載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市庭砍,隨后出現(xiàn)的幾起案子讨跟,更是在濱河造成了極大的恐慌揣炕,老刑警劉巖扳炬,帶你破解...
    沈念sama閱讀 222,464評論 6 517
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件恨樟,死亡現(xiàn)場離奇詭異,居然都是意外死亡缩多,警方通過查閱死者的電腦和手機养晋,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 95,033評論 3 399
  • 文/潘曉璐 我一進店門绳泉,熙熙樓的掌柜王于貴愁眉苦臉地迎上來零酪,“玉大人,你說我怎么就攤上這事灯谣√バ恚” “怎么了罗售?”我有些...
    開封第一講書人閱讀 169,078評論 0 362
  • 文/不壞的土叔 我叫張陵寨躁,是天一觀的道長。 經(jīng)常有香客問我所禀,道長放钦,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 59,979評論 1 299
  • 正文 為了忘掉前任,我火速辦了婚禮斤寂,結果婚禮上,老公的妹妹穿的比我還像新娘遍搞。我一直安慰自己尾抑,他們只是感情好,可當我...
    茶點故事閱讀 69,001評論 6 398
  • 文/花漫 我一把揭開白布榜苫。 她就那樣靜靜地躺著垂睬,像睡著了一般抗悍。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上赏壹,一...
    開封第一講書人閱讀 52,584評論 1 312
  • 那天蝌借,我揣著相機與錄音指蚁,去河邊找鬼。 笑死稍坯,一個胖子當著我的面吹牛搓劫,可吹牛的內(nèi)容都是我干的枪向。 我是一名探鬼主播,決...
    沈念sama閱讀 41,085評論 3 422
  • 文/蒼蘭香墨 我猛地睜開眼雄可,長吁一口氣:“原來是場噩夢啊……” “哼数苫!你這毒婦竟也來了辨液?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 40,023評論 0 277
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎敬惦,沒想到半個月后谈山,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 46,555評論 1 319
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 38,626評論 3 342
  • 正文 我和宋清朗相戀三年斜脂,在試婚紗的時候發(fā)現(xiàn)自己被綠了帚戳。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片威兜。...
    茶點故事閱讀 40,769評論 1 353
  • 序言:一個原本活蹦亂跳的男人離奇死亡椒舵,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出犁钟,到底是詐尸還是另有隱情泼橘,我是刑警寧澤炬灭,帶...
    沈念sama閱讀 36,439評論 5 351
  • 正文 年R本政府宣布,位于F島的核電站厦凤,受9級特大地震影響育苟,放射性物質發(fā)生泄漏。R本人自食惡果不足惜博烂,卻給世界環(huán)境...
    茶點故事閱讀 42,115評論 3 335
  • 文/蒙蒙 一禽篱、第九天 我趴在偏房一處隱蔽的房頂上張望馍惹。 院中可真熱鬧,春花似錦肥照、人聲如沸勤众。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,601評論 0 25
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽努溃。三九已至阻问,卻和暖如春称近,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背凳谦。 一陣腳步聲響...
    開封第一講書人閱讀 33,702評論 1 274
  • 我被黑心中介騙來泰國打工衡未, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人肆饶。 一個月前我還...
    沈念sama閱讀 49,191評論 3 378
  • 正文 我出身青樓,卻偏偏與公主長得像竭鞍,于是被迫代替她去往敵國和親橄镜。 傳聞我的和親對象是個殘疾皇子洽胶,可洞房花燭夜當晚...
    茶點故事閱讀 45,781評論 2 361