水平再循环视图均匀分割显示

最近遇到一个项目，学习淘宝首页的做法，做一个标签页面，看了下样式 ，其实就是有一个横向的recyclerView，实现方式很多，用recyclerview实现感觉扩展性相对比较好，记录下吧，发现忘的快。
先看下效果图

image.png

1、adapter的布局文件

item_test.xml

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    xmlns:app="http://schemas.android.com/apk/res-auto">

    <ImageView
        android:id="@+id/img"
        android:layout_width="44dp"
        android:layout_height="44dp"
        android:src="@mipmap/ic_launcher"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"/>
    <TextView
        android:id="@+id/test"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/app_name"
        app:layout_constraintTop_toBottomOf="@+id/img"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"/>
</androidx.constraintlayout.widget.ConstraintLayout>

1、首先创建一个普通的adapter，别人框架也一样的，基本都是没毛病会暴露方法给外部使用

myadapter.xml

package com.hh.myrv

import android.app.Activity
import android.content.Context
import android.util.DisplayMetrics
import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import android.widget.ImageView
import android.widget.TextView
import androidx.recyclerview.widget.RecyclerView

class MyAdapter(var data: List<String>) : RecyclerView.Adapter<MyAdapter.MyHolder>() {

    class MyHolder(item: View): RecyclerView.ViewHolder(item) {
        var img: ImageView? = null
        var tx: TextView? = null;
        init {
            img = item.findViewById(R.id.img)
            tx = item.findViewById(R.id.test)
        }
    }

    override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): MyHolder {
        var  view  = LayoutInflater.from(parent.context).inflate(R.layout.item_test, parent, false)
      //在这里动态的设置每个 item的宽度根据屏幕的大小来划分
        view.layoutParams.width = getScreenWidth(parent.context) / 5
        return MyHolder(view)
    }

    override fun getItemCount(): Int {
        return data.size
    }

    override fun onBindViewHolder(holder: MyHolder, position: Int) {
        holder.tx?.setText(data.get(position))
    }
    fun getScreenWidth(context: Context): Int{
        val outMetrics = DisplayMetrics()
        (context as Activity).windowManager.getDefaultDisplay().getMetrics(outMetrics)

        return outMetrics.widthPixels
    }
}

以上代码注释部分就是关键部分。

3、调用rv部分

MainActivity.kt

class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        var list = ArrayList<String>()
        for(i in 0..10){
            list.add("数据"+i)
        }
        var adapter = MyAdapter(list)
        var ma = GridLayoutManager(this, 2)
        ma.orientation = GridLayoutManager.HORIZONTAL
        recyycler.layoutManager = ma
        recyycler.adapter = adapter
    }
}

记录下实现方式吧，其他方式也可以实现，看自己业务部分来实现吧。