双十一到了，作为一个程序员除了买（bai）买(jia)买(duo)买(shou)之外，也不要忘了学习，今天我们来看Android的流式布局。 所谓流式布局指的是ViewGroup中同一行的宽度不足以容纳下一个子view时，进行换行处理，而不需要考虑子view的大小，每一行的高度以其中最高者为准。Talk is cheap, Show you the code。
自定义ViewGroup的三种方式：
- 通过继承现有的ViewGroup(比如LinearLayout)重写
onMeasure()来修改已有的 ViewGroup的尺寸,比如你需要一个正方形的LinearLayout，你就可以在onMeasure()中先调用super.onMeasure()测量出原始高度，然后通过getMesureHeight(),getMesuseWidth()获得原始宽高，将他们的宽高设为一样就好了，调用setMeasuredDimension()就可以了，这么样是不是很简（ma）单(fan)； - 重写
onMeasure()来全新定制自定义View的尺寸,同样也是onMeasure()中，这时你就可以根据自己需要是否调用super.onMeasure()，然后根据自己的算法，得出宽高，调用setMeasuredDimension()就可以了； - 重写
onMeasure()和onLayout()来全新定制自定义ViewGroup的内部布局，这种方式不单单需要测量本身自己的宽高，还要根据需要计算每个子view的位置，稍微复杂一些，本次的流式布局就是通过这种方式实现的。
实现过程：
下面这张图是扔物线大神视频截图，这里直接拿来用，别顶，要脸！！
简单讲解一下整个过程：
大体上分为测量尺寸过程以及布局过程
测量尺寸过程：ViewGroup 的mesure()方法被父View调用，进而调用到 onMeasure() ，在onMeasuse()中会调用所有子 View 的 measure() 让它们进行自我测量，并根据子 View 计算出的希望的尺寸来计算出它们的实际尺寸和位置（注意是希望的尺寸，不是最终尺寸，比如ViewGroup 的宽为100dp,有一个子View的宽度为200dp,显然子View最多也只能是100dp的宽度）然后保存。同时，它也会根据子 View 的尺寸和位置来计算出自己的尺寸然后保存，到这里我们就确定了ViewGroup自身的希望尺寸，以及它的子View的希望尺寸，那么，具体字View怎么摆放呢？这就到了下一个阶段，布局阶段。
布局过程：VIewGrouplayout() 方法被父 View 调用，在 layout() 中它会取得父 View 传进来的自己的位置和尺寸，并且调用 onLayout() 来进行实际的内部布局ViewGroup 在 onLayout() 中会调用自己的所有子 View 的 layout() 方法，把它们的尺寸和位置传给它们，让子View完成布局。
光说不练假把式，Talk is cheap, Show you the code。
package com.example.administrator.xflowlayout;/*** Created by SharksLee on 2016/07/19*/import android.content.Context;
import android.content.res.TypedArray;
import android.util.AttributeSet;
import android.view.View;
import android.view.ViewGroup;import java.util.HashMap;
import java.util.Map;/*** @SharksLee lishaojie*/
public class XFlowLayout extends ViewGroup {private int childHorizontalSpace;private int childVerticalSpace;private Map<Object, Location> mLocationMap;public XFlowLayout(Context context, AttributeSet attrs) {super(context, attrs);TypedArray attrArray = context.obtainStyledAttributes(attrs, R.styleable.XLFlowLayout);mLocationMap = new HashMap<>();if (attrArray != null) {childHorizontalSpace = attrArray.getDimensionPixelSize(R.styleable.XLFlowLayout_childHorizontalSpace, 0);childVerticalSpace = attrArray.getDimensionPixelSize(R.styleable.XLFlowLayout_childVerticalSpace, 0);attrArray.recycle();}}@Overrideprotected LayoutParams generateLayoutParams(LayoutParams p) {return new MarginLayoutParams(p);}@Overridepublic LayoutParams generateLayoutParams(AttributeSet attrs) {return new MarginLayoutParams(getContext(), attrs);}@Overrideprotected LayoutParams generateDefaultLayoutParams() {return new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);}/*** 负责设置子控件的测量模式和大小 根据所有子控件设置自己的宽和高*/@Overrideprotected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {super.onMeasure(widthMeasureSpec, heightMeasureSpec);if (mLocationMap != null && !mLocationMap.isEmpty()) {mLocationMap.clear();}// 获得它的父容器为它设置的测量模式和大小int sizeWidth = MeasureSpec.getSize(widthMeasureSpec);int sizeHeight = MeasureSpec.getSize(heightMeasureSpec);int modeWidth = MeasureSpec.getMode(widthMeasureSpec);int modeHeight = MeasureSpec.getMode(heightMeasureSpec);// 如果是warp_content情况下，记录宽和高int width = 0;int height = 0;/*** 记录每一行的宽度，width不断取最大宽度*/int lineWidth = 0;/*** 每一行的高度，累加至height*/int lineHeight = 0;int count = getChildCount();int left = getPaddingLeft();int top = getPaddingTop();// 遍历每个子元素for (int i = 0; i < count; i++) {View child = getChildAt(i);if (child.getVisibility() == GONE)continue;// 测量每一个child的宽和高measureChild(child, widthMeasureSpec, heightMeasureSpec);// 得到child的lpLayoutParams lp = child.getLayoutParams();// 当前子空间实际占据的宽度int childWidth = child.getMeasuredWidth() + childHorizontalSpace;// 当前子空间实际占据的高度int childHeight = child.getMeasuredHeight() + childVerticalSpace;if (lp != null && lp instanceof MarginLayoutParams) {MarginLayoutParams params = (MarginLayoutParams) lp;childWidth += params.leftMargin + params.rightMargin;childHeight += params.topMargin + params.bottomMargin;}/*** 如果加入当前child的宽度，超出了最大宽度，则的到目前最大宽度给width，累加height 然后开启新行*/if (lineWidth + childWidth > sizeWidth - getPaddingLeft() - getPaddingRight()) {width = Math.max(lineWidth, childWidth);// 取最大的lineWidth = childWidth; // 重新开启新行，开始记录// 叠加当前高度，height += lineHeight;// 开启记录下一行的高度lineHeight = childHeight;mLocationMap.put(child, new Location(left, top + height, childWidth + left - childHorizontalSpace, height + child.getMeasuredHeight() + top));} else {// 否则累加值lineWidth,lineHeight取最大高度mLocationMap.put(child, new Location(lineWidth + left, top + height, lineWidth + childWidth - childHorizontalSpace + left, height + child.getMeasuredHeight() + top));lineWidth += childWidth;lineHeight = Math.max(lineHeight, childHeight);}}width = Math.max(width, lineWidth) + getPaddingLeft() + getPaddingRight();height += lineHeight;sizeHeight += getPaddingTop() + getPaddingBottom();height += getPaddingTop() + getPaddingBottom();setMeasuredDimension((modeWidth == MeasureSpec.EXACTLY) ? sizeWidth : width, (modeHeight == MeasureSpec.EXACTLY) ? sizeHeight : height);}@Overrideprotected void onLayout(boolean changed, int l, int t, int r, int b) {int count = getChildCount();for (int i = 0; i < count; i++) {View child = getChildAt(i);if (child.getVisibility() == GONE)continue;Location location = mLocationMap.get(child);child.layout(location.left, location.top, location.right, location.bottom);}}/*** 记录子控件的坐标*/public static class Location {public int left;public int top;public int right;public int bottom;Location(int left, int top, int right, int bottom) {this.left = left;this.top = top;this.right = right;this.bottom = bottom;}}
}复制代码简单讲解一下思路：
在onMeasure()方法中，通过遍历测量没一个字View的宽高，如果加入当前child宽度，超出了最大宽度，测得到目前最大宽度给width，width的作用是用来保存各行中最大宽度的，累加height 然后开启新行。最后
setMeasuredDimension((modeWidth == MeasureSpec.EXACTLY) ? sizeWidth : width, (modeHeight == MeasureSpec.EXACTLY) ?
复制代码注意一下modeWidth == MeasureSpec.EXACTLY表示宽度是在ViewGroup测量之前就已经确定了的，比如布局中的layout_width="100dp"或者layout_width="match_parent",这种情况下直接
int sizeWidth = MeasureSpec.getSize(widthMeasureSpec)就可以获取到ViewGroup的宽度，不需要遍历子View计算。注意这里有个小技巧，我用mLocationMap在测量子View尺寸的时候就把它们位置信息保存起来，所以onLayout()方法非常简单。
运行结果如图：
今天双十一，媳妇电商公司通宵才有时间码代码，吹牛逼，有媳妇的人过了一个纯粹的光棍节，/心塞！但至少我是有媳妇的人，/得意脸。
最后祝愿大家节日快乐，码农早日脱单，有钱也有机会清空败家娘们的购物车/坏笑。
传送门：github.com/SharksLee/F…
喜欢的给个星吧！
