需求
我们需要实现一个自定义的Layout，该Layout可以容纳若干个宽高不等的子元素，元素按照从左到右的顺序排列，当元素超出屏幕显示范围时，换一行继续显示，like this
View和ViewGroup
Android的界面都是由View、ViewGroup及其派生类组合而成，其中，View是ViewGroup及其他UI组件的基类。ViewGroup是放置View的容器，在编写xml布局文件的时候，View所有以layout开头的属性都是提供给ViewGroup的，ViewGroup根据这些属性来给childView计算出测量模式和建议的宽高，并将childView绘制在屏幕上的适当位置
UI是怎样被绘制出来的
UI组件渲染过程可分为三个阶段：测量、布局、绘制.
Measure过程
Measure过程的任务是根据ViewGroup给的参数计算出视图自身的大小，在View中与Measure过程相关的方法有measure()、onMeasure()和setMeasureDimension()，其中onMeasure()是我们需要在自定义视图的时候重写的方法，在measure()方法中，onMeasure()被调用，在onMeasure()计算完毕后，调用setMeasureDimension()设置自身大小。
自身大小的计算结果取决于视图本身所占区域的大小及ViewGroup传递过来的MeasureMode值，其中MeasureMode可能取值为UNSPECIFIED、EXACTLY和AT_MOST。
UNSPECIFIED
表示childView可将自身大小设置为自身想要的任意大值，一般出现于AdapterView的item的高度属性中
EXACTLY
表示childView应该将自身大小设置为ViewGroup指定的大小，当View指定了自身宽或高为精确的值或match_parent时，ViewGroup会传入该Mode
AT_MOST
表示childView可以在一个限定的最大值范围内设置自己的大小，当View指定自身宽或高为wrap_content时，ViewGroup会传入该Mode
Measure过程结束后，视图大小即被确定。
Layout过程
Layout过程的任务是决定视图的位置，framework调用View的layout()方法来计算位置，在layout()方法中，onLayout()方法会被调用，这个方法是需要View的派生类重写的，在此实现布局逻辑。
Layout是一个自顶向下递归的过程，先布局容器，再布局子视图，因此，ViewGroup的位置一定程度上决定了它的childView的位置。
Layout过程结束后，视图在屏幕上的位置即被确定。
Draw过程
Draw过程的任务是根据视图的尺寸和位置，在相应的区域内绘制自身样式。同样的，framework会调用onDraw()方法，我们需要重写onDraw()方法实现绘制逻辑，在View中，可以通过调用invalidate()方法触发视图重绘。
让View支持Padding和Margin
如上文所说，所有以layout开头的属性都是交由容器处理的，layout_margin就是这样一个属性，在自定义View中可通过getLayoutParams()返回的LayoutParams对象来获取到视图各个方向的margin值，容器只需在layout过程中将margin值作为偏移量加入即可实现将视图放置在正确位置。
Padding是视图的自有属性，描述其各个方向边界到内部内容的距离，在代码中可通过getPaddingTop(/Left/Right/Bottom)()来获取各个方向的padding值，在Measure过程中，需要注意View尺寸包含内容区域加上padding区域，padding区域内的内容将不会被绘制。
Step by Step实现需求
onMeasure
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
int contentWidth = MeasureSpec.getSize(widthMeasureSpec);
int contentHeight = MeasureSpec.getSize(heightMeasureSpec);
int widthMode = MeasureSpec.getMode(widthMeasureSpec);
int heightMode = MeasureSpec.getMode(heightMeasureSpec);
//Padding支持
int topOffset = getPaddingTop();
int leftOffset = getPaddingLeft();
int selfWidth = 0, selfHeight = 0;
int currentLineWidth = 0, currentLineHeight = 0;
int childCount = getChildCount();
for (int i = 0; i < childCount; i++) {
View child = getChildAt(i);
if (child.getVisibility() == GONE)
continue;
measureChild(child, widthMeasureSpec, heightMeasureSpec);
MarginLayoutParams layoutParams = (MarginLayoutParams) child.getLayoutParams();
int childWidth = Math.max(child.getMeasuredWidth(), getSuggestedMinimumWidth()) + layoutParams.leftMargin + layoutParams.rightMargin;
int childHeight = Math.max(child.getMeasuredHeight(), getSuggestedMinimumHeight()) + layoutParams.topMargin + layoutParams.bottomMargin;
if (currentLineWidth + childWidth > contentWidth - getPaddingLeft() - getPaddingRight()) {
//需要另起一行
currentLineWidth = Math.max(currentLineWidth,childWidth);
selfWidth = Math.max(selfWidth, currentLineWidth);
currentLineWidth = childWidth;
selfHeight += currentLineHeight;
currentLineHeight = childHeight;
//Measure的时候顺便把位置计算出来
child.setTag(new Location(child, leftOffset, selfHeight + topOffset, childWidth + leftOffset, selfHeight + child.getMeasuredHeight() + topOffset));
} else {
//不需要换行
child.setTag(new Location(child, currentLineWidth + leftOffset, selfHeight + topOffset, currentLineWidth + child.getMeasuredWidth() + topOffset, selfHeight + child.getMeasuredHeight() + topOffset));
currentLineWidth += childWidth;
currentLineHeight = Math.max(currentLineHeight, childHeight);
}
if (i == childCount - 1) {
//到最后一个child的时候更新高度
sselfWidth = Math.max(currentLineWidth, selfWidth) + getPaddingRight() + getPaddingLeft();
selfHeight += currentLineHeight + getPaddingTop() + getPaddingBottom();
}
}
setMeasuredDimension(widthMode == MeasureSpec.EXACTLY ? contentWidth : selfWidth,
heightMode == MeasureSpec.EXACTLY ? contentHeight : selfHeight);
}
经过如上处理，ViewGroup的尺寸和childView的位置便被计算出来，并且ViewGroup可根据childView排列情况自动调整自身宽高。
onLayout
@Override
protected void onLayout(boolean changed, int l, int t, int r, int b) {
for (int i = 0; i < getChildCount(); i++) {
View child = getChildAt(i);
if (child.getVisibility() != GONE) {
Location location = (Location) child.getTag();
child.layout(location.left, location.top, location.right, location.bottom);
}
}
}
在onMeasure()中我们已经顺手计算出了各个childView的位置信息，所以在Layout步骤中只需将其按照位置摆放到相应区域即可。
draw
draw方法是由framework调用，在ViewGroup的onDraw()方法中绘制的内容最后会被作为ViewGroup的背景，所以如果需要更改背景内容可重写该方法。draw()中会递归调用childView的onDraw()方法，调用完毕后ViewGroup本身和childView都绘制完毕，一次渲染过程到此结束。
附加特性
可通过对ViewGroup设置LayoutAnimation来为childView显示的过程附加动画，一个简单的例子：
public FlowLayout(Context context) {
super(context);
setLayoutAnimation(
new LayoutAnimationController(AnimationUtils.loadAnimation(
getContext(), R.anim.list_animation), 0.3f));
}
可以重写addView()方法为动态添加的View附加动画，重写removeView()方法实现移除View时的附加动画。
