RecyclerView's GridLayoutManager dynamic span count
Asked Answered
S

3

14

I am using following code dynamically change span count.

val layoutManager = GridLayoutManager(this, 3)
layoutManager.spanSizeLookup = object : GridLayoutManager.SpanSizeLookup() {
    override fun getSpanSize(position: Int): Int {
        when (position) {
            0, 1, 2 -> return 1
            3, 4 -> return 2
            5 -> return 3
            else -> return 1
        }
    }
}

And I got following output. But I want D and E should horizontally equally aligned. I don't how to do it.

Actually I have 3 types in adapter, HEADER, TYPE_A, TYPE_B. HEADER should have only one row, and TYPE_A is 3 rows, TYPE_B is 2 rows.

So may I get help to make some columns should have one 1 row, and some have only 2 rows(horizontally equally aligned) and some have 3 rows.

enter image description here

Strahan answered 9/7, 2018 at 11:10 Comment(0)
P
28

In that case you should make your grid layout have more than 3 cells. You'd need to pick a number that works for all three types of cells, a 6 is good because to have 3 cells by row you'd return a 2. To have 2 cells by row you'd return a 3 and to have 1 cell by row you'd return a 6:

val layoutManager = GridLayoutManager(this, 6)
layoutManager.spanSizeLookup = object : GridLayoutManager.SpanSizeLookup() {
    override fun getSpanSize(position: Int): Int {
        when (position) {
            0, 1, 2 -> return 2
            3, 4 -> return 3
            5 -> return 6
            else -> return 2
        }
    }
}
Pissed answered 9/7, 2018 at 11:35 Comment(2)
Hey , what if i want to display three items in the first row, but only two in the second one, since we cant give spansize as 1.5 since it only allows INT , what is the best approach to do that, so i want 3 items in top row , and two items in bottom row equally spacedAlford
@Alford did you get any solution, if yes kindly post your solution I am also looking for the same problemAfraid
B
1

Here is my solution for dinamic span in this case the maximun span is 4 and 12 is multiple of 4, 3 and 2. //NUMBER OF THE SPAN THAT YOU WANT is the size of your array

val mutipleSpan = 12  //least common multiple
val maxSpan = 4//max span count 
val mLayoutManager = object : GridLayoutManager(itemView.context, mutipleSpan){}

mLayoutManager.spanSizeLookup = object : GridLayoutManager.SpanSizeLookup() {
            override fun getSpanSize(position: Int): Int {
                val actualSize =  //NUMBER OF THE SPAN THAT YOU WANT
                if(actualSize< maxSpan){
                    return  mutipleSpan/actualSize
                }
                return mutipleSpan/maxSpan
            }
        }

recycler.layoutManager = mLayoutManager 
Betweentimes answered 19/9, 2022 at 21:3 Comment(0)
D
0

Use FlexBoxLayoutManager of library by Google.

Document describes this is a valid solution.

enter image description here

Duumvirate answered 20/9, 2022 at 7:38 Comment(0)

© 2022 - 2025 — McMap. All rights reserved.