FlexboxLayout使用指南

添加
android:flexbox的依赖

dependencies {
    compile 'com.google.android:flexbox:0.3.2'

   //引入RecyclerView
    compile 'com.android.support:appcompat-v7:26.+'
    compile 'com.android.support:design:26.+'
    compile 'com.android.support:support-v4:26.+'
    }

配置里面搭配main_activity.xml

image_item

MainActivity

package yaoyao.flexboxdemo;

import android.app.Activity;
import android.os.Bundle;
import android.support.v7.widget.RecyclerView;

import com.google.android.flexbox.AlignItems;
import com.google.android.flexbox.FlexDirection;
import com.google.android.flexbox.FlexWrap;
import com.google.android.flexbox.FlexboxLayoutManager;

import java.util.List;
import java.util.concurrent.CopyOnWriteArrayList;

public class MainActivity extends Activity {

    private RecyclerView mRecyclerview;
    private FlexboxLayoutManager manager;

    private List list = new CopyOnWriteArrayList<>();
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        initData();
        initView();
    }


    private void initData() {
//        for (int i = 0; i < 255; i++) {
//            list.add("https://unsplash.it/200/200?random&" + i);
//        }
        for (int i = 0; i < 5; i++) {
            list.add(R.mipmap.timg);
            list.add(R.mipmap.cat1);
            list.add(R.mipmap.cat2);

            list.add(R.mipmap.cat2);
            list.add(R.mipmap.cat5);
            list.add(R.mipmap.cat4);
            list.add(R.mipmap.cat6);
            list.add(R.mipmap.cat1);
            list.add(R.mipmap.cat3);
            list.add(R.mipmap.cat4);
            list.add(R.mipmap.cat5);
            list.add(R.mipmap.cat6);
            list.add(R.mipmap.cat7);
            list.add(R.mipmap.cat8);
            list.add(R.mipmap.cat3);
            list.add(R.mipmap.cat11);
            list.add(R.mipmap.cat12);
            list.add(R.mipmap.cat6);
            list.add(R.mipmap.cat7);
            list.add(R.mipmap.cat8);
            list.add(R.mipmap.cat11);
            list.add(R.mipmap.cat4);
            list.add(R.mipmap.cat5);
            list.add(R.mipmap.cat6);
            list.add(R.mipmap.cat7);
            list.add(R.mipmap.cat8);
            list.add(R.mipmap.cat11);
            list.add(R.mipmap.cat4);
            list.add(R.mipmap.cat5);
            list.add(R.mipmap.cat6);
            list.add(R.mipmap.cat7);
            list.add(R.mipmap.cat12);

        }
    }

    private void initView() {
        mRecyclerview = (RecyclerView) findViewById(R.id.recycler);
        manager = new FlexboxLayoutManager(this);
        //设置主轴排列方式
        manager.setFlexDirection(FlexDirection.ROW);
        //是否换行
        manager.setFlexWrap(FlexWrap.WRAP);
        //对齐方式
        manager.setAlignItems(AlignItems.STRETCH);
        mRecyclerview.setLayoutManager(manager);
        mRecyclerview.setAdapter(new HomeAdapter(this, list));
    }
}

HomeAdapter

package yaoyao.flexboxdemo;

import android.content.Context;
import android.support.v7.widget.RecyclerView;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;


import com.google.android.flexbox.FlexboxLayoutManager;

import java.util.List;


public class HomeAdapter extends RecyclerView.Adapter {
    private Context mContext;
    private List mList;

    private OnItemClickListener onItemClickListener;

    public HomeAdapter(Context mContext, List list) {
        this.mContext = mContext;
        this.mList = list;
    }

    public interface OnItemClickListener {
        //点击轮播图
        void OnSliderClick(int postion);


    }

    public void setOnItemClickListener(OnItemClickListener onItemClickListener) {
        this.onItemClickListener = onItemClickListener;
    }


    @Override
    public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        View view = LayoutInflater.from(mContext).inflate(R.layout.image_item, parent, false);
        return new ViewHolder(view);
    }

    @Override
    public void onBindViewHolder(ViewHolder holder, int position) {
        holder.mImage.setImageResource(mList.get(position));
        ViewGroup.LayoutParams lp = holder.mImage.getLayoutParams();
        if (lp instanceof FlexboxLayoutManager.LayoutParams) {
            FlexboxLayoutManager.LayoutParams flexboxLp =
                    (FlexboxLayoutManager.LayoutParams) holder.mImage.getLayoutParams();
            flexboxLp.setFlexGrow(1.0f);
        }

    }

    @Override
    public int getItemCount() {
        return mList.size();
    }

    class ViewHolder extends RecyclerView.ViewHolder {
        View view;
        ImageView mImage;

        ViewHolder(View view) {
            super(view);
            this.view = view;
            this.mImage = (ImageView) view.findViewById(R.id.image);
        }
    }
}

主要注意

  mRecyclerview = (RecyclerView) findViewById(R.id.recycler);
        manager = new FlexboxLayoutManager(this);
        //设置主轴排列方式
        manager.setFlexDirection(FlexDirection.ROW);
        //是否换行
        manager.setFlexWrap(FlexWrap.WRAP);
        //对齐方式
        manager.setAlignItems(AlignItems.STRETCH);
        mRecyclerview.setLayoutManager(manager);
        mRecyclerview.setAdapter(new HomeAdapter(this, list));

 holder.mImage.setImageResource(mList.get(position));
        ViewGroup.LayoutParams lp = holder.mImage.getLayoutParams();
        if (lp instanceof FlexboxLayoutManager.LayoutParams) {
            FlexboxLayoutManager.LayoutParams flexboxLp =
                    (FlexboxLayoutManager.LayoutParams) holder.mImage.getLayoutParams();
            flexboxLp.setFlexGrow(1.0f);
        }

flexboxLp.setFlexGrow(1.0f); 弹性适配页面宽度
这两个地方就ok 可以用的
效果图