【Android】RecyclerView瀑布流布局

绝地灬酷狼 2022-11-17 05:04 287阅读 0赞

### RecyclerView瀑布流布局 ###

> **代码**

*  **Menifest:**

*  **Kotlin:**

`StaggeredActivity:`

class StaggeredActivity : AppCompatActivity() {
        private lateinit var recyclerviewBinding: ActivityRecyclerviewBinding
        private val fruitList = ArrayList<Fruit>()
    
        override fun onCreate(savedInstanceState: Bundle?) {
            super.onCreate(savedInstanceState)
            recyclerviewBinding = ActivityRecyclerviewBinding.inflate(layoutInflater)
            setContentView(recyclerviewBinding.root)
    
            initFruits()
            val layoutManager = StaggeredGridLayoutManager(3, StaggeredGridLayoutManager.VERTICAL)
            recyclerviewBinding.recyclerRecyclerView.layoutManager = layoutManager
            val adapter = StaggeredAdapter(fruitList)
            recyclerviewBinding.recyclerRecyclerView.adapter = adapter
        }
    
        private fun initFruits() {
            repeat(2) {
                fruitList.apply {
                    add(Fruit(getRandomLength("Apple"), R.drawable.fruit))
                    add(Fruit(getRandomLength("Pear"), R.drawable.fruit))
                    add(Fruit(getRandomLength("Banana"), R.drawable.fruit))
                    add(Fruit(getRandomLength("Watermelon"), R.drawable.fruit))
                    add(Fruit(getRandomLength("Orange"), R.drawable.fruit))
                    add(Fruit(getRandomLength("Grape"), R.drawable.fruit))
                    add(Fruit(getRandomLength("Pineapple"), R.drawable.fruit))
                    add(Fruit(getRandomLength("Strawberry"), R.drawable.fruit))
                    add(Fruit(getRandomLength("Cherry"), R.drawable.fruit))
                    add(Fruit(getRandomLength("Mango"), R.drawable.fruit))
                }
            }
        }
    
        private fun getRandomLength(str: String): String {
            val n = (0..10).random()
            return with(StringBuilder())
            {
                repeat(n) {
                    append(str)
                }
                toString()
            }
        }
    }

`StaggeredAdapter:`

class StaggeredAdapter(private val fruitList:List<Fruit>):RecyclerView.Adapter<StaggeredAdapter.ViewHolder>() {
        inner class ViewHolder(view: View) : RecyclerView.ViewHolder(view) {
            val fruitImage: ImageView = view.findViewById(R.id.fruit_staggered_image)
            val fruitName: TextView = view.findViewById(R.id.fruit_staggered_name)
        }
    
        override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): ViewHolder {
            val view = LayoutInflater.from(parent.context)
                .inflate(R.layout.fruit_staggered_item, parent, false)
            return ViewHolder(view)
        }
    
        override fun onBindViewHolder(holder: ViewHolder, position: Int) {
            val fruit = fruitList[position]
            holder.fruitImage.setImageResource(fruit.imageId)
            holder.fruitName.text = fruit.name
        }
    
        override fun getItemCount() = fruitList.size
    }

*  **Layout:**

`fruit_staggered_item:`

<?xml version="1.0" encoding="utf-8"?>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="5dp"
        android:orientation="vertical">
    
        <ImageView
            android:id="@+id/fruit_staggered_image"
            android:layout_width="40dp"
            android:layout_height="40dp"
            android:layout_gravity="center_horizontal"
            android:layout_marginTop="10dp" />
    
        <TextView
            android:id="@+id/fruit_staggered_name"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="left"
            android:layout_marginTop="10dp" />
    
    </LinearLayout>

`activity_recyclerview:`

<?xml version="1.0" encoding="utf-8"?>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
    
        <androidx.recyclerview.widget.RecyclerView
            android:id="@+id/recycler_recyclerView"
            android:layout_width="match_parent"
            android:layout_height="match_parent" />
    </LinearLayout>

--------------------

> **效果:**

![在这里插入图片描述][20210408142542325.png]

[20210408142542325.png]: /images/20221022/75b809c4fa01446493ed67e05088c304.png