Android中流式布局和热门标签

1、流式布局特点、应用场景。
2、自定义ViewGroup
(1)onMeasure:测量子View的宽和高，设置自己的宽和高。
(2)onLayout:设置子View的位置。

onMeasure:根据子View的布局文件，为子View设置测量模式和测量值。

测量 = 测量模式 + 测量值；
测量模式:3种。
(1)EXACTLY:100dp , match_parent。
(2)AT_MOST: wrap_content。
(3)UNSPCIFIED:子控件想要多大就多大，很少见。

ViewGroup - LayoutParams

FlowLayout - MarginLayoutParams

子View.getLayoutParams(); -> LinearLayout.LayoutParams

  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;
 
   // Source --- Generate Constructors from Superdass... ，生成三个构造方法。
 public class FlowLayout extends ViewGroup {

     // 存储所有的View 一行一行的存储
     // 比如：一共三行 List就是3。一行有10个那么List<View> 就是10
     private List<List<View>> mAllViews = new ArrayList<List<View>>();
     // 每一行的高度
     private List<Integer> mLineHeight = new ArrayList<Integer>();

     // 使用控件，及其实行，而且用了自定义的属性
     public FlowLayout(Context context, AttributeSet attrs, int defStyle) {
         super(context, attrs, defStyle);
         // 这样所有的逻辑就全部可以卸载这个里面去
     }

     // 用到控件的属性（非自定义）
     public FlowLayout(Context context, AttributeSet attrs) {
         this(context, attrs, 0); // 调用三个构造参数方法
     }

     // new一个控件的时候，我们传入一个上下文。
     public FlowLayout(Context context) {
         this(context, null); // 调用两个构造参数方法
     }

     @Override
     protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
         // 宽度（测量值） 容器的宽度
         int sizeWidth = MeasureSpec.getSize(widthMeasureSpec);
         // 宽度（测量模式）
         // modeWidth == MeasureSpec.AT_MOST 用于判断
         int modeWidth = MeasureSpec.getMode(widthMeasureSpec);

         int sizeHeight = MeasureSpec.getSize(heightMeasureSpec);
         int modeHeight = MeasureSpec.getMode(heightMeasureSpec);

         // wrap_content （自己去计算）
         int width = 0;
         int height = 0;

         // 记录每一行的宽度与高度
         int lineWidth = 0;
         int lineHeight = 0;

         // 得到内部元素的个数
         int cCount = getChildCount();

         for (int i = 0; i < cCount; i++) {
             View child = getChildAt(i);
             // 测量子View的宽和高
             measureChild(child, widthMeasureSpec, heightMeasureSpec);
             // 得到LayoutParams
             MarginLayoutParams lp = (MarginLayoutParams) child
                     .getLayoutParams();

             // 子View占据的宽度
             int childWidth = child.getMeasuredWidth() + lp.leftMargin
                     + lp.rightMargin;
             // 子View占据的高度
             int childHeight = child.getMeasuredHeight() + lp.topMargin
                     + lp.bottomMargin;

             // 换行
             // lineWidth:上一行的宽度 + childWidth:当前控件的宽度。
             // sizeWidth:当前容器的宽度。
             // "  - getPaddingLeft()- getPaddingRight() "
             // 是针对 android:padding="20dp"进行的。
             if (lineWidth + childWidth > sizeWidth - getPaddingLeft()
                     - getPaddingRight()) {
                 // 对比得到最大的宽度
                 width = Math.max(width, lineWidth);
                 // 重置lineWidth
                 lineWidth = childWidth;
                 // 记录行高
                 height += lineHeight;
                 lineHeight = childHeight;
             } else { // 未换行
                 // 叠加行宽
                 lineWidth += childWidth;
                 // 得到当前行最大的高度
                 lineHeight = Math.max(lineHeight, childHeight);
             }
             // 最后一个控件
             if (i == cCount - 1) {
                 width = Math.max(lineWidth, width);
                 height += lineHeight;
             }
         }

         Log.e("TAG", "sizeWidth = " + sizeWidth);
         Log.e("TAG", "sizeHeight = " + sizeHeight);

         // 判断测量模式
         // " + getPaddingLeft() + getPaddingRight() "
         // 是针对 android:padding="20dp"进行的。
         setMeasuredDimension(
                 //
                 modeWidth == MeasureSpec.EXACTLY ? sizeWidth : width
                         + getPaddingLeft() + getPaddingRight(),
                 modeHeight == MeasureSpec.EXACTLY ? sizeHeight : height
                         + getPaddingTop() + getPaddingBottom()//
         );

     }

     @Override
     protected void onLayout(boolean changed, int l, int t, int r, int b) {
         mAllViews.clear();
         mLineHeight.clear();

         // 当前ViewGroup的宽度
         int width = getWidth();

         int lineWidth = 0;
         int lineHeight = 0;

         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();

             // 如果需要换行
             // 当前行的宽度 + 当前列的宽度 + lp.leftMargin + lp.rightMargin
             // " - getPaddingLeft() - getPaddingRight() "
             // 是针对 android:padding="20dp"进行的。
             if (childWidth + lineWidth + lp.leftMargin + lp.rightMargin > width
                     - getPaddingLeft() - getPaddingRight()) {
                 // 记录LineHeight
                 mLineHeight.add(lineHeight);
                 // 记录当前行的Views
                 mAllViews.add(lineViews);

                 // 重置我们的行宽和行高
                 lineWidth = 0;
                 lineHeight = childHeight + lp.topMargin + lp.bottomMargin;
                 // 重置我们的View集合
                 lineViews = new ArrayList<View>();
             }
             lineWidth += childWidth + lp.leftMargin + lp.rightMargin;
             lineHeight = Math.max(lineHeight, childHeight + lp.topMargin
                     + lp.bottomMargin);
             lineViews.add(child);

         }// for end
             // 处理最后一行
         mLineHeight.add(lineHeight);
         mAllViews.add(lineViews);

         // 设置子View的位置
         // 是针对 android:padding进行的。
         // 所以不能给left和top设置0。
         int left = getPaddingLeft();
         int top = getPaddingTop();

         // 行数
         int lineNum = mAllViews.size();

         for (int i = 0; i < lineNum; i++) {
             // 当前行的所有的View
             lineViews = mAllViews.get(i);
             lineHeight = mLineHeight.get(i);

             for (int j = 0; j < lineViews.size(); j++) {
                 View child = lineViews.get(j);
                 // 判断child的状态
                 if (child.getVisibility() == View.GONE) {
                     continue;
                 }

                 MarginLayoutParams lp = (MarginLayoutParams) child
                         .getLayoutParams();

                 int lc = left + lp.leftMargin;
                 int tc = top + lp.topMargin;
                 int rc = lc + child.getMeasuredWidth();
                 int bc = tc + child.getMeasuredHeight();

                 // 为子View进行布局
                 child.layout(lc, tc, rc, bc);

                 left += child.getMeasuredWidth() + lp.leftMargin
                         + lp.rightMargin;
             }
             // 每次循环完一行后
             // 是针对 android:padding进行的。
             // 所以不能给left设置0。
             left = getPaddingLeft();
             top += lineHeight; // 累加
         }

     }

     /**
      * 与当前ViewGroup对应的LayoutParams
      */
     @Override
     public LayoutParams generateLayoutParams(AttributeSet attrs) {
         return new MarginLayoutParams(getContext(), attrs);
     }

 }

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <com.imooc.view.FlowLayout
        android:id="@+id/id_flowlayout"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:background="#E5E5F5"
        android:padding="20dp" >
    </com.imooc.view.FlowLayout>

</RelativeLayout>

 import android.app.Activity;
 import android.os.Bundle;
 import android.view.LayoutInflater;
 import android.widget.TextView;
 import com.imooc.view.FlowLayout;

 public class MainActivity extends Activity {

     private String[] mVals = new String[] { "Hello", "Android", "Weclome Hi ",
             "Button", "TextView", "Hello", "Android", "Weclome",
             "Button ImageView", "TextView", "Helloworld", "Android",
             "Weclome Hello", "Button Text", "TextView" };

     private FlowLayout mFlowLayout;

     @Override
     protected void onCreate(Bundle savedInstanceState) {
         super.onCreate(savedInstanceState);

         setContentView(R.layout.activity_main);

         mFlowLayout = (FlowLayout) findViewById(R.id.id_flowlayout);

         initData();
     }

     public void initData() {
         // for (int i = 0; i < mVals.length; i++)
         // {
         // Button btn = new Button(this);
         //
         // MarginLayoutParams lp = new MarginLayoutParams(
         // MarginLayoutParams.WRAP_CONTENT,
         // MarginLayoutParams.WRAP_CONTENT);
         //
         // btn.setText(mVals[i]);
         // mFlowLayout.addView(btn, lp);
         // }
         LayoutInflater mInflater = LayoutInflater.from(this);
         for (int i = 0; i < mVals.length; i++) {
             TextView tv = (TextView) mInflater.inflate(R.layout.tv,
                     mFlowLayout, false);
             tv.setText(mVals[i]);
             mFlowLayout.addView(tv);
         }
     }
 }

 <?xml version="1.0" encoding="utf-8"?>
 <TextView xmlns:android="http://schemas.android.com/apk/res/android"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:layout_margin="5dp"
     android:background="@drawable/tv_bg"
     android:textColor="#5BC4ED"
     android:text="Helloworld" >
 </TextView>

@drawable/tv_bg

 <?xml version="1.0" encoding="utf-8"?>
 <shape xmlns:android="http://schemas.android.com/apk/res/android" >
     <solid android:color="#ffffff" />
     <corners android:radius="30dp" />
     <padding
         android:bottom="2dp"
         android:left="10dp"
         android:right="10dp"
         android:top="2dp" />
 </shape>

DEMO下载地址：http://download.csdn.net/detail/androidsj/9446937