GridLayoutManager动态显示多少列

王宁-Android

已于 2024-10-19 14:47:06 修改

阅读量775

点赞数 12

分类专栏： Kotlin例子文章标签： android kotlin

于 2024-10-19 14:38:07 首次发布

本文链接：https://blog.youkuaiyun.com/maoning20080808/article/details/143078025

版权

Kotlin例子专栏收录该内容

53 篇文章

订阅专栏

GridLayoutManager动态显示多少列，点击1、2、3列能动态切换

ShapeRecyclerViewFragment类：

package com.example.androidkotlindemo2.customview3

import android.os.Bundle
import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import androidx.fragment.app.Fragment
import androidx.recyclerview.widget.GridLayoutManager
import com.example.androidkotlindemo2.R
import com.example.androidkotlindemo2.databinding.ShapeRoundCornerMainBinding


/**
 * Author : wn
 * Email : maoning20080809@163.com
 * Date : 2024/10/19 11:24
 * Description : 列表圆角
 */
class ShapeRecyclerViewFragment : Fragment(), View.OnClickListener{

    private lateinit var binding: ShapeRoundCornerMainBinding


    private var drawableIds = arrayListOf<Int>(R.mipmap.demo_classics, R.mipmap.demo_farms, R.mipmap.demo_fishs,
        R.mipmap.demo_fruits, R.mipmap.demo_pets, R.mipmap.demo_kk, R.mipmap.demo_ll, R.mipmap.demo_pets,
        R.mipmap.demo_mm, R.mipmap.demo_nn, R.mipmap.demo_pp, R.mipmap.demo_pp)

    //private var drawableIds = arrayListOf<Int>(R.mipmap.demo_classics, R.mipmap.demo_farms, R.mipmap.demo_fishs, R.mipmap.demo_fruits)


    override fun onCreateView(
        inflater: LayoutInflater,
        container: ViewGroup?,
        savedInstanceState: Bundle?
    ): View? {
        binding = ShapeRoundCornerMainBinding.inflate(inflater, container, false)
        return binding.root
    }

    var gridLayoutManager : GridLayoutManager? =  null

    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
        super.onViewCreated(view, savedInstanceState)

        binding.shapeRoundCornerBtn1.setOnClickListener(this)
        binding.shapeRoundCornerBtn2.setOnClickListener(this)
        binding.shapeRoundCornerBtn3.setOnClickListener(this)

        initView2()
    }
    var adapter: ShapeRoundCornerProviderMultiAdapter? = null

    private fun initView2(){
        adapter = ShapeRoundCornerProviderMultiAdapter()
        adapter?.data = getData()
        gridLayoutManager = GridLayoutManager(requireActivity(), SPAN_COUNT)
        initGpanSizeLookup(COLUMN_THREE)
        binding.rvRecyclerView.let {
            it.layoutManager = gridLayoutManager
            it.adapter = adapter
        }
    }

    /**
     * @param column 显示多少列
     */
    private fun initGpanSizeLookup(column : Int){
        gridLayoutManager?.spanSizeLookup = object : GridLayoutManager.SpanSizeLookup(){
            override fun getSpanSize(position: Int): Int {
                var itemViewType = adapter?.getItemViewType(position)
                //第1行标题， 显示1列
                return if(itemViewType == ShapeRoundCornerBean.TYPE_TITLE){
                    SPAN_COUNT
                } else {
                    //动态显示1、2、3列
                    SPAN_COUNT / column
                }
            }
        }
    }


    override fun onClick(v: View?) {
        v?:return
        if(v.id == R.id.shape_round_corner_btn1) {
            initGpanSizeLookup(COLUMN_ONE)
        } else if(v.id == R.id.shape_round_corner_btn2) {
            initGpanSizeLookup(COLUMN_TWO)
        } else if(v.id == R.id.shape_round_corner_btn3) {
            initGpanSizeLookup(COLUMN_THREE)
        }
        adapter?.notifyDataSetChanged()
    }

    private fun getData() : MutableList<ShapeRoundCornerBean>{
        var list = mutableListOf<ShapeRoundCornerBean>()

        for (i in 0 until drawableIds.size){
            var shapeRoundCornerBean = ShapeRoundCornerBean()
            //可以切换，要不要显示标题
            if(i == 0){
                shapeRoundCornerBean.itemViewType = ShapeRoundCornerBean.TYPE_TITLE
                shapeRoundCornerBean.name = "标题${i}"
            } else {
                shapeRoundCornerBean.itemViewType = ShapeRoundCornerBean.TYPE_CONTENT
                shapeRoundCornerBean.name = "name${i}"
            }
            shapeRoundCornerBean.position = i
            shapeRoundCornerBean.desc = "desc${i}"
            shapeRoundCornerBean.imgId = drawableIds[i]
            list.add(shapeRoundCornerBean)
        }
        return list
    }

    companion object {

        //动态计算1、2、3列
        var SPAN_COUNT = 6

        //1列
        var COLUMN_ONE = 1

        //2列
        var COLUMN_TWO = 2

        //3列
        var COLUMN_THREE = 3
    }



}

ShapeRoundCornerProviderMultiAdapter类：

package com.example.androidkotlindemo2.customview3

import com.chad.library.adapter.base.BaseProviderMultiAdapter

/**
 * Author : wn
 * Email : maoning20080809@163.com
 * Date : 2024/10/19 13:09
 * Description :
 */
class ShapeRoundCornerProviderMultiAdapter : BaseProviderMultiAdapter<ShapeRoundCornerBean>() {

    init {
        addItemProvider(ShapeContentProvider())
        addItemProvider(ShapeTitleProvider())
    }

    override fun getItemViewType(position: Int): Int {
        return super.getItemViewType(position)
    }

    override fun getItemType(data: List<ShapeRoundCornerBean>, position: Int): Int {

        return data[position].itemViewType
    }
}

ShapeContentProvider类：

package com.example.androidkotlindemo2.customview3

import com.chad.library.adapter.base.provider.BaseItemProvider
import com.chad.library.adapter.base.viewholder.BaseViewHolder
import com.example.androidkotlindemo2.R
import com.example.androidkotlindemo2.utils.LogUtils

/**
 * Author : wn
 * Email : maoning20080809@163.com
 * Date : 2024/10/19 13:04
 * Description :
 */
class ShapeContentProvider : BaseItemProvider<ShapeRoundCornerBean>() {

    override val itemViewType: Int
        get() = ShapeRoundCornerBean.TYPE_CONTENT

    override val layoutId: Int
        get() = R.layout.shape_round_corner_item

    override fun convert(helper: BaseViewHolder, item: ShapeRoundCornerBean) {
        LogUtils.i("BBB","ContentProvider 数据：${item.name}, ${item.imgId}")
        helper.setText(R.id.shape_round_corner_item_name, item.name)
        helper.setText(R.id.shape_round_corner_item_desc, item.desc)
        helper.setImageResource(R.id.shape_round_corner_item_img, item.imgId)
    }

}

ShapeTitleProvider类：

package com.example.androidkotlindemo2.customview3

import com.chad.library.adapter.base.provider.BaseItemProvider
import com.chad.library.adapter.base.viewholder.BaseViewHolder
import com.example.androidkotlindemo2.R
import com.example.androidkotlindemo2.utils.LogUtils

/**
 * Author : wn
 * Email : maoning20080809@163.com
 * Date : 2024/10/19 13:17
 * Description :
 */
class ShapeTitleProvider : BaseItemProvider<ShapeRoundCornerBean>() {

    override val itemViewType: Int
        get() = ShapeRoundCornerBean.TYPE_TITLE

    override val layoutId: Int
        get() = R.layout.shape_round_corner_title

    override fun convert(helper: BaseViewHolder, item: ShapeRoundCornerBean) {
        LogUtils.i("BBB","ShapeTitleProvider 标题：${item.name}, ${item.imgId}")

        helper.setText(R.id.shape_round_corner_title, item.name)
    }
}

ShapeRoundCornerBean类：

package com.example.androidkotlindemo2.customview3

/**
 * Author : wangning
 * Email : maoning20080809@163.com
 * Date : 2023/9/24 10:12
 * Description :
 */
class ShapeRoundCornerBean() {

    var itemViewType = 0

    var position = 0
    var name : String = ""
    var desc : String = ""
    var imgId: Int = 0

    companion object {

        //类型
        val TYPE_TITLE = 1

        //内容
        val TYPE_CONTENT = 2


    }

}

shape_round_corner_main.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"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/gray_e5e5e5"
    android:orientation="vertical">


    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:gravity="center"
        android:textColor="@color/red"
        android:textSize="20sp"
        android:layout_marginVertical="20dp"
        android:text="Shape圆角\nGridLayoutManager动态显示多少列"/>


    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginBottom="20dp"
        android:gravity="center"
        android:orientation="horizontal">
        <androidx.appcompat.widget.AppCompatButton
            android:id="@+id/shape_round_corner_btn1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textSize="28sp"
            android:text="1列"/>

        <androidx.appcompat.widget.AppCompatButton
            android:id="@+id/shape_round_corner_btn2"
            android:layout_marginHorizontal="20dp"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textSize="28sp"
            android:text="2列"/>

        <androidx.appcompat.widget.AppCompatButton
            android:id="@+id/shape_round_corner_btn3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textSize="28sp"
            android:text="3列"/>

    </LinearLayout>

    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/rv_recycler_view"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginHorizontal="10dp"
        android:background="@drawable/shape_round_corner"
        android:layout_below="@+id/rv_snap_helper_title" />

</LinearLayout>

shape_round_corner_item.xml布局

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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_marginHorizontal="10dp"
    android:layout_marginVertical="10dp"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">

    <androidx.appcompat.widget.AppCompatImageView
        android:id="@+id/shape_round_corner_item_img"
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:scaleType="centerCrop"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        android:src="@mipmap/demo_farms"/>

    <androidx.appcompat.widget.AppCompatTextView
        android:id="@+id/shape_round_corner_item_name"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="10dp"
        app:layout_constraintStart_toEndOf="@+id/shape_round_corner_item_img"
        app:layout_constraintTop_toTopOf="parent"
        android:textColor="@color/black"
        android:textSize="16sp"
        android:text="item" />

    <androidx.appcompat.widget.AppCompatTextView
        android:id="@+id/shape_round_corner_item_desc"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="10dp"
        app:layout_constraintStart_toEndOf="@+id/shape_round_corner_item_img"
        app:layout_constraintTop_toBottomOf="@+id/shape_round_corner_item_name"
        android:textColor="@color/red"
        android:textSize="16sp"
        android:text="desc" />

</androidx.constraintlayout.widget.ConstraintLayout>

shape_round_corner_title.xml布局

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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_marginHorizontal="10dp"
    android:layout_marginVertical="10dp"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <androidx.appcompat.widget.AppCompatTextView
        android:id="@+id/shape_round_corner_title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="10dp"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        android:textColor="@color/red"
        android:textSize="16sp"
        android:text="标题" />

    <androidx.appcompat.widget.AppCompatTextView
        android:id="@+id/shape_round_corner_more"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginEnd="10dp"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        android:textColor="@color/red"
        android:textSize="16sp"
        android:text="更多" />

</androidx.constraintlayout.widget.ConstraintLayout>

shape_round_corner.xml 圆角，放在drawable目录下

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <!-- rectangle(矩形，默认值)
            oval(椭圆，此时corners 节点会失效)
            line(直线，此时必须设置stroke 节点不然会报错)
            ring(圆环)
    -->
    <!--    指定了形状内部的填充颜色-->
    <solid android:color="@color/white"/>

    <!--指定了形状四个圆角的半径-->
    <corners
        android:radius="12dp"/>
</shape>