android流式布局FlowLayout

一、概述：
在日常的app使用中，我们会在android 的app中看见 热门标签等自动换行的流式布局，今天，我们就来看看如何

自定义一个类似热门标签那样的流式布局吧（源码下载在下面最后给出）

类似的自定义布局。下面我们就来详细介绍流式布局的应用特点以及用的的技术点：

1.流式布局的特点以及应用场景
    特点：当上面一行的空间不够容纳新的TextView时候，
    才开辟下一行的空间

　　原理图：

　　

    场景：主要用于关键词搜索或者热门标签等场景
2.自定义ViewGroup,重点重写下面两个方法

    1、onMeasure:测量子view的宽高，设置自己的宽和高

    2、onLayout:设置子view的位置

    onMeasure:根据子view的布局文件中属性，来为子view设置测量模式和测量值
    测量=测量模式+测量值；

    测量模式有3种：
    EXACTLY：表示设置了精确的值，一般当childView设置其宽、高为精确值、match_parent时，ViewGroup会将其设置为EXACTLY；
    AT_MOST：表示子布局被限制在一个最大值内，一般当childView设置其宽、高为wrap_content时，ViewGroup会将其设置为AT_MOST；
    UNSPECIFIED：表示子布局想要多大就多大，一般出现在AadapterView的item的heightMode中、ScrollView的childView的heightMode中；此种模式比较少见。
3.LayoutParams
    ViewGroup LayoutParams :每个 ViewGroup 对应一个 LayoutParams; 即 ViewGroup -> LayoutParams
    getLayoutParams 不知道转为哪个对应的LayoutParams ,其实很简单，就是如下：
    子View.getLayoutParams 得到的LayoutParams对应的就是 子View所在的父控件的LayoutParams;
    例如，LinearLayout 里面的子view.getLayoutParams ->LinearLayout.LayoutParams
    所以 咱们的FlowLayout 也需要一个LayoutParams，由于上面的效果图是子View的 margin，
    所以应该使用MarginLayoutParams。即FlowLayout->MarginLayoutParams

4.最后来看看实现的最终效果图：

二、热门标签的流式布局的实现：

1. 自定义热门标签的ViewGroup实现

　　根据上面的技术分析，自定义类继承于ViewGroup，并重写 onMeasure和onLayout等方法。具体实现代码如下：

[plain]  view plain copy

1. package com.czm.flowlayout;  
2.   
3. import java.util.ArrayList;  
4. import java.util.List;  
5.   
6. import android.content.Context;  
7. import android.util.AttributeSet;  
8. import android.view.View;  
9. import android.view.ViewGroup;  
10. /**  
11.  *   
12.  * @author caizhiming  
13.  * @created on 2015-4-13  
14.  */  
15. public class XCFlowLayout extends ViewGroup{  
16.   
17.     //存储所有子View  
18.     private List<List<View>> mAllChildViews = new ArrayList<>();  
19.     //每一行的高度  
20.     private List<Integer> mLineHeight = new ArrayList<>();  
21.       
22.     public XCFlowLayout(Context context) {  
23.         this(context, null);  
24.         // TODO Auto-generated constructor stub  
25.     }  
26.     public XCFlowLayout(Context context, AttributeSet attrs) {  
27.         this(context, attrs, 0);  
28.         // TODO Auto-generated constructor stub  
29.     }  
30.     public XCFlowLayout(Context context, AttributeSet attrs, int defStyle) {  
31.         super(context, attrs, defStyle);  
32.         // TODO Auto-generated constructor stub  
33.     }  
34.     @Override  
35.     protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {  
36.         // TODO Auto-generated method stub  
37.           
38.         //父控件传进来的宽度和高度以及对应的测量模式  
39.         int sizeWidth = MeasureSpec.getSize(widthMeasureSpec);