欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

Flexbox+ReclyclerView实现流式布局

程序员文章站 2022-06-18 13:51:39
本文实例为大家分享了flexbox+reclyclerview实现流式布局的具体代码,供大家参考,具体内容如下效果:module build.gradle引入implementation 'com.g...

本文实例为大家分享了flexbox+reclyclerview实现流式布局的具体代码,供大家参考,具体内容如下

效果:

Flexbox+ReclyclerView实现流式布局

module build.gradle引入

implementation 'com.google.android.flexbox:flexbox:3.0.0'

布局

activity_main.xml

<?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/rv_flexbox"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>


</linearlayout>

mainactivity

package com.example.myapplication;

import androidx.appcompat.app.appcompatactivity;
import androidx.recyclerview.widget.recyclerview;

import android.os.bundle;
import android.util.log;
import android.view.view;

import com.google.android.flexbox.flexdirection;
import com.google.android.flexbox.flexwrap;
import com.google.android.flexbox.flexboxlayoutmanager;
import com.google.android.flexbox.justifycontent;

import java.util.arraylist;
import java.util.list;

public class mainactivity extends appcompatactivity {

    private recyclerview rv_flexbox;
    private list<string> list_data;
    private flexboxadapter fadapter;

    @override
    protected void oncreate(bundle savedinstancestate) {
        super.oncreate(savedinstancestate);
        setcontentview(r.layout.activity_main);

        rv_flexbox = (recyclerview)findviewbyid(r.id.rv_flexbox);
        flexboxlayoutmanager flexboxlayoutmanager = new flexboxlayoutmanager(this);
        //flexdirection 属性决定主轴的方向(即项目的排列方向)。类似 linearlayout 的 vertical 和 horizontal。
        flexboxlayoutmanager.setflexdirection(flexdirection.row);//主轴为水平方向,起点在左端。
        //flexwrap 默认情况下 flex 跟 linearlayout 一样,都是不带换行排列的,但是flexwrap属性可以支持换行排列。
//        flexboxlayoutmanager.setflexwrap(flexwrap.wrap);//按正常方向换行
        //justifycontent 属性定义了项目在主轴上的对齐方式。
//        flexboxlayoutmanager.setjustifycontent(justifycontent.flex_start);//交叉轴的起点对齐。
        rv_flexbox.setlayoutmanager(flexboxlayoutmanager);

        list_data = new arraylist<>();
        list_data.add("小米手机");
        list_data.add("平衡車");
        list_data.add("无人机");
        list_data.add("神舟笔记本电脑");
        list_data.add("小鹏汽车");
        list_data.add("特斯拉");
        fadapter = new flexboxadapter(this,list_data);
//        fadapter.notifydatasetchanged();
        rv_flexbox.setadapter(fadapter);

        fadapter.setonitemclicklitener(new flexboxadapter.onitemclicklitener() {
            @override
            public void onitemclick(view view, int positon) {
                log.e("wy", "position: "+positon+"  data:" + list_data.get(positon));
            }
        });
    }
}

flexboxadapter

package com.example.myapplication;

import android.content.context;
import android.view.layoutinflater;
import android.view.view;
import android.view.viewgroup;
import android.widget.textview;

import androidx.annotation.nonnull;
import androidx.recyclerview.widget.recyclerview;

import java.util.list;

public class flexboxadapter extends recyclerview.adapter<flexboxadapter.myholder> {

    private context mcontext;
    private list<string> list_data;
    private layoutinflater inflater;

    public flexboxadapter(context mcontext, list<string> list_data) {
        this.mcontext = mcontext;
        this.list_data = list_data;
        this.inflater = layoutinflater.from(mcontext);
    }

    @nonnull
    @override
    public myholder oncreateviewholder(@nonnull viewgroup viewgroup, int i) {

        view view = inflater.inflate(r.layout.fragment_rv_item,viewgroup,false);

        return new myholder(view);
    }


    @override
    public void onbindviewholder(@nonnull final myholder myholder, int i) {
        myholder.tv_title.settext(list_data.get(i));

        // 如果设置了回调,则设置点击事件
        if (monitemclicklitener != null)
        {
            myholder.itemview.setonclicklistener(new view.onclicklistener()
            {
                @override
                public void onclick(view v)
                {
                    int pos = myholder.getlayoutposition();
                    monitemclicklitener.onitemclick(myholder.itemview, pos);
                }
            });


        }
    }

    @override
    public int getitemcount() {
        return list_data.size();
    }

    class myholder extends recyclerview.viewholder
    {

        textview tv_title;

        public myholder(@nonnull view itemview) {
            super(itemview);

            tv_title = (textview)itemview.findviewbyid(r.id.tv_title);
        }
    }

    /**
     * 定义点击每项的接口
     */
    public interface onitemclicklitener
    {
        void onitemclick(view view, int positon);
    }

    private onitemclicklitener monitemclicklitener;

    public void setonitemclicklitener(onitemclicklitener monitemclicklitener)
    {
        this.monitemclicklitener = monitemclicklitener;
    }
}

drawable下

flex_item_bg.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
    <!-- 填充-->
    <solid android:color="#00000000"/>
    <!-- 描边 -->
    <stroke
        android:width="1dp"
        android:color="#7f7f7f" />
    <!-- 圆角 -->
    <corners
        android:radius="2dp" />
</shape>

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。