Flowlayout流式布局使用（轻量级）

Flowlayout属于自定义流式布局，意思就是说从左上角开始添加原件，依次往后排，第一行挤满了就换一行接着排。

本文所使用的FlowLayout来自于鸿洋大神的框架。
只取了一个自定义控件，没有鸿洋的github：https://github.com/hongyangAndroid/FlowLayout功能强大，本文属于轻量级别。

备注：Flowlayout只是个容器

先看下效果图

自定义Flowlayout控件使用方法

<你的包名.customview.FlowLayout
android:id=”@+id/fl_layout”
android:layout_width=”wrap_content”
android:layout_height=”wrap_content” />

使用方法一（XML添加）：

<你的包名.customview.FlowLayout
android:layout_width=”match_parent”
android:layout_height=”wrap_content”>

    <Button        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:onClick="getHtml"        android:text="Get Html" />    <Button        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:onClick="postFile"        android:text="Post File" />    <Button        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:onClick="postString"        android:text="Post String" />    <Button        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:onClick="getHttpsHtml"        android:text="Get Https Html" />

<你的包名.customview.FlowLayout>

然后对每个控件监听做操作

使用方法二(动态添加)：

先看下我的item效果图

item代码如下：

< RelativeLayout
android:layout_width=”match_parent”
android:layout_height=”wrap_content”>

    <TextView    android:id="@+id/tv_label"    android:layout_width="wrap_content"    android:layout_height="wrap_content"    android:layout_marginLeft="15dp"    android:layout_marginTop="10dp"    android:background="@drawable/edit_bac_type"    android:gravity="center"    android:padding="10dp"    android:text="你好啊你好啊"    android:textColor="#9E9E9E" /><ImageView    android:id="@+id/iv_delete"    android:layout_width="wrap_content"    android:layout_height="wrap_content"    android:paddingBottom="5dp"    android:paddingLeft="5dp"    android:paddingRight="5dp"    android:src="@mipmap/dianjishanchu" />RelativeLayout>

动态添加布局

@Bind(R.id.fl_layout)
FlowLayout flLayout;（控件ID）

private List mData;（数据源集合）

private void initLabelContent() {
flLayout.removeAllViews();
for (int i = 0; i < mData.size(); i++) {
LayoutInflater inflater = LayoutInflater.from(this);
View view = inflater.inflate(R.layout.item_label, null);
TextView tvLabel = (TextView) view.findViewById(R.id.tv_label);
tvLabel.setText(mData.get(i));
ImageView ivDelete = (ImageView) view.findViewById(R.id.iv_delete);
ivDelete.setTag(i);
ivDelete.setOnClickListener(new OnDeleteClickListener(ivDelete));
flLayout.addView(view);
}
}
//监听事件
private class OnDeleteClickListener implements View.OnClickListener {
private ImageView ivDelete;
public OnDeleteClickListener(ImageView ivDelete) {
super();
this.ivDelete = ivDelete;
}
@Override
public void onClick(View v) {
int position = (int) ivDelete.getTag();
mData.remove(position);
initLabelContent();
}
}

数据源每改变一次调用一次initLabelContent()方法。

自定义Flowlayout控件（复制粘贴即可）

import java.util.ArrayList;
import java.util.List;

import android.content.Context;
import android.util.AttributeSet;
import android.util.Log;
import android.view.View;
import android.view.ViewGroup;

/**
* Created by LiuPeng on 2017/8/2.
*/

public class FlowLayout extends ViewGroup {
private static final String TAG = “FlowLayout”;

public FlowLayout(Context context, AttributeSet attrs) {    super(context, attrs);}@Overrideprotected ViewGroup.LayoutParams generateLayoutParams(        ViewGroup.LayoutParams p) {    return new MarginLayoutParams(p);}@Overridepublic ViewGroup.LayoutParams generateLayoutParams(AttributeSet attrs) {    return new MarginLayoutParams(getContext(), attrs);}@Overrideprotected ViewGroup.LayoutParams generateDefaultLayoutParams() {    return new MarginLayoutParams(LayoutParams.MATCH_PARENT,            LayoutParams.MATCH_PARENT);}/** * 负责设置子控件的测量模式和大小 根据所有子控件设置自己的宽和高 */@Overrideprotected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {    super.onMeasure(widthMeasureSpec, heightMeasureSpec);    // 获得它的父容器为它设置的测量模式和大小    int sizeWidth = MeasureSpec.getSize(widthMeasureSpec);    int sizeHeight = MeasureSpec.getSize(heightMeasureSpec);    int modeWidth = MeasureSpec.getMode(widthMeasureSpec);    int modeHeight = MeasureSpec.getMode(heightMeasureSpec);    Log.e(TAG, sizeWidth + "," + sizeHeight);    // 如果是warp_content情况下，记录宽和高    int width = 0;    int height = 0;    /**     * 记录每一行的宽度，width不断取最大宽度     */    int lineWidth = 0;    /**     * 每一行的高度，累加至height     */    int lineHeight = 0;    int cCount = getChildCount();    // 遍历每个子元素    for (int i = 0; i < cCount; i++) {        View child = getChildAt(i);        // 测量每一个child的宽和高        measureChild(child, widthMeasureSpec, heightMeasureSpec);        // 得到child的lp        MarginLayoutParams lp = (MarginLayoutParams) child                .getLayoutParams();        // 当前子空间实际占据的宽度        int childWidth = child.getMeasuredWidth() + lp.leftMargin                + lp.rightMargin;        // 当前子空间实际占据的高度        int childHeight = child.getMeasuredHeight() + lp.topMargin                + lp.bottomMargin;        /**         * 如果加入当前child，则超出最大宽度，则的到目前最大宽度给width，类加height 然后开启新行         */        if (lineWidth + childWidth > sizeWidth) {            width = Math.max(lineWidth, childWidth);// 取最大的            lineWidth = childWidth; // 重新开启新行，开始记录            // 叠加当前高度，            height += lineHeight;            // 开启记录下一行的高度            lineHeight = childHeight;        } else        // 否则累加值lineWidth,lineHeight取最大高度        {            lineWidth += childWidth;            lineHeight = Math.max(lineHeight, childHeight);        }        // 如果是最后一个，则将当前记录的最大宽度和当前lineWidth做比较        if (i == cCount - 1) {            width = Math.max(width, lineWidth);            height += lineHeight;        }    }    setMeasuredDimension((modeWidth == MeasureSpec.EXACTLY) ? sizeWidth            : width, (modeHeight == MeasureSpec.EXACTLY) ? sizeHeight            : height);}/** * 存储所有的View，按行记录 */private List<List<View>> mAllViews = new ArrayList<List<View>>();/** * 记录每一行的最大高度 */private List<Integer> mLineHeight = new ArrayList<Integer>();@Overrideprotected void onLayout(boolean changed, int l, int t, int r, int b) {    mAllViews.clear();    mLineHeight.clear();    int width = getWidth();    int lineWidth = 0;    int lineHeight = 0;    // 存储每一行所有的childView    List<View> lineViews = new ArrayList<View>();    int cCount = getChildCount();    // 遍历所有的孩子    for (int i = 0; i < cCount; i++) {        View child = getChildAt(i);        MarginLayoutParams lp = (MarginLayoutParams) child                .getLayoutParams();        int childWidth = child.getMeasuredWidth();        int childHeight = child.getMeasuredHeight();        // 如果已经需要换行        if (childWidth + lp.leftMargin + lp.rightMargin + lineWidth > width) {            // 记录这一行所有的View以及最大高度            mLineHeight.add(lineHeight);            // 将当前行的childView保存，然后开启新的ArrayList保存下一行的childView            mAllViews.add(lineViews);            lineWidth = 0;// 重置行宽            lineViews = new ArrayList<View>();        }        /**         * 如果不需要换行，则累加         */        lineWidth += childWidth + lp.leftMargin + lp.rightMargin;        lineHeight = Math.max(lineHeight, childHeight + lp.topMargin                + lp.bottomMargin);        lineViews.add(child);    }    // 记录最后一行    mLineHeight.add(lineHeight);    mAllViews.add(lineViews);    int left = 0;    int top = 0;    // 得到总行数    int lineNums = mAllViews.size();    for (int i = 0; i < lineNums; i++) {        // 每一行的所有的views        lineViews = mAllViews.get(i);        // 当前行的最大高度        lineHeight = mLineHeight.get(i);        Log.e(TAG, "第" + i + "行 ：" + lineViews.size() + " , " + lineViews);        Log.e(TAG, "第" + i + "行， ：" + lineHeight);        // 遍历当前行所有的View        for (int j = 0; j < lineViews.size(); j++) {            View child = lineViews.get(j);            if (child.getVisibility() == View.GONE) {                continue;            }            MarginLayoutParams lp = (MarginLayoutParams) child                    .getLayoutParams();            //计算childView的left,top,right,bottom            int lc = left + lp.leftMargin;            int tc = top + lp.topMargin;            int rc = lc + child.getMeasuredWidth();            int bc = tc + child.getMeasuredHeight();            Log.e(TAG, child + " , l = " + lc + " , t = " + t + " , r ="                    + rc + " , b = " + bc);            child.layout(lc, tc, rc, bc);            left += child.getMeasuredWidth() + lp.rightMargin                    + lp.leftMargin;        }        left = 0;        top += lineHeight;    }}

}