Android自定义控件ViewGroup实现标签云（四）

概述前言：前面几篇讲了自定义控件绘制原理Android自定义控件基本原理详解（一），Android自定义控件之自定义属性（二），Android自定义控件之自定义组合控件（三），常言道：“好记性不如烂笔头，光说不练假把式！！！

前言：

前面几篇讲了自定义控件绘制原理Android自定义控件基本原理详解（一） ，Android自定义控件之自定义属性（二） ，Android自定义控件之自定义组合控件（三） ，常言道：“好记性不如烂笔头，光说不练假把式！！！”，作为一名学渣就是因为没有遵循这句名言才沦落于此，所以要谨遵教诲，注重理论与实践相结合，今天通过自定义viewGroup来实现一下项目中用到的标签云。

需求背景：

公司需要实现一个知识点的标签显示，每个标签的长度未知，如下图所示

 

基本绘制流程： 

绘制原理这里不再介绍大致介绍下绘制流程
 •构造函数获取自定义属性
 •onMeasure()方法，测量子控件的大小
 •onLayout()方法，对子控件进行布局

1.）自定义属性

 <declare-styleable name="TagsLayout">  <attr name="tagVerticalSpace" format="dimension" />  <attr name="tagHorizontalSpace" format="dimension" /></declare-styleable> 

2.）构造函数中获取自定义属性值 

private int childHorizontalSpace; private int childVerticalSpace; public TagsLayout(Context context,AttributeSet attrs) {  super(context,attrs);  TypedArray attrArray = context.obtainStyledAttributes(attrs,R.styleable.TagsLayout);  if (attrArray != null) {   childHorizontalSpace = attrArray.getDimensionPixelSize(R.styleable.TagsLayout_tagHorizontalSpace,0);   childVerticalSpace = attrArray.getDimensionPixelSize(R.styleable.TagsLayout_tagVerticalSpace,0);   attrArray.recycle();  } }

3.）onMeasure函数测量子控件大小，然后设置当前控件大小 

 /**  * 负责设置子控件的测量模式和大小 根据所有子控件设置自己的宽和高  */ @OverrIDe protected 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);  // 如果是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的lp   marginLayoutParams lp = (marginLayoutParams) child.getLayoutParams();   // 当前子空间实际占据的宽度   int chilDWIDth = child.getMeasureDWIDth() + lp.leftmargin + lp.rightmargin + childHorizontalSpace;   // 当前子空间实际占据的高度   int childHeight = child.getMeasuredHeight() + lp.topmargin + lp.bottommargin + childVerticalSpace;   /**    * 如果加入当前child，则超出最大宽度，则的到目前最大宽度给wIDth，类加height 然后开启新行    */   if (linewidth + chilDWIDth > sizeWIDth - getpaddingleft() - getpaddingRight()) {    wIDth = Math.max(linewidth,chilDWIDth);// 取最大的    linewidth = chilDWIDth; // 重新开启新行，开始记录    // 叠加当前高度，    height += lineHeight;    // 开启记录下一行的高度    lineHeight = childHeight;    child.setTag(new Location(left,top + height,chilDWIDth + left - childHorizontalSpace,height + child.getMeasuredHeight() + top));   } else {// 否则累加值linewidth,lineHeight取最大高度    child.setTag(new Location(linewidth + left,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); }

通过遍历所有子控件调用measureChild函数获取每个子控件的大小，然后通过宽度叠加判断是否换行，叠加控件的高度，同时记录下当前子控件的坐标，这里记录坐标引用了自己写的一个内部类Location.java 

 /**  * 记录子控件的坐标  */ public class Location {  public Location(int left,int top,int right,int bottom) {   this.left = left;   this.top = top;   this.right = right;   this.bottom = bottom;  }  public int left;  public int top;  public int right;  public int bottom; }

4.)onLayout函数对所有子控件重新布局 

 @OverrIDe protected 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 = (Location) child.getTag();   child.layout(location.left,location.top,location.right,location.bottom);  } }

这里直接遍历所有子控件调用子控件的layout函数进行布局。 

如何使用：
 1）.布局问自己中直接引用 

<?xml version="1.0" enCoding="utf-8"?><linearLayout xmlns:androID="http://schemas.androID.com/apk/res/androID" xmlns:lee="http://schemas.androID.com/apk/res-auto" androID:layout_wIDth="match_parent" androID:layout_height="match_parent" androID:orIEntation="vertical"> <com.whoislcj.vIEws.TagsLayout  androID:ID="@+ID/image_layout"  androID:layout_wIDth="match_parent"  androID:layout_height="wrap_content"  androID:layout_margin="10dp"  lee:tagHorizontalSpace="10dp"  lee:tagVerticalSpace="10dp" /></linearLayout>

2）.代码添加标签 

TagsLayout imageVIEwGroup = (TagsLayout) findVIEwByID(R.ID.image_layout); VIEwGroup.marginLayoutParams lp = new VIEwGroup.marginLayoutParams(VIEwGroup.LayoutParams.WRAP_CONTENT,VIEwGroup.LayoutParams.WRAP_CONTENT);  String[] string={"从我写代码那天起，我就没有打算写代码","从我写代码那天起","我就没有打算写代码","没打算","写代码"};  for (int i = 0; i < 5; i++) {   TextVIEw textVIEw = new TextVIEw(this);   textVIEw.setText(string[i]);   textVIEw.setTextcolor(color.WHITE);   textVIEw.setBackgroundResource(R.drawable.round_square_blue);   imageVIEwGroup.addVIEw(textVIEw,lp);  }

具体效果

 

3.）最后附上TagsLayout全部代码 

public class TagsLayout extends VIEwGroup { private int childHorizontalSpace; private int childVerticalSpace; public TagsLayout(Context context,0);   attrArray.recycle();  } } /**  * 负责设置子控件的测量模式和大小 根据所有子控件设置自己的宽和高  */ @OverrIDe protected voID onMeasure(int wIDthMeasureSpec,(modeHeight == MeasureSpec.EXACTLY) ? sizeHeight : height); } @OverrIDe protected voID onLayout(boolean changed,location.bottom);  } } /**  * 记录子控件的坐标  */ public class Location {  public Location(int left,int bottom) {   this.left = left;   this.top = top;   this.right = right;   this.bottom = bottom;  }  public int left;  public int top;  public int right;  public int bottom; }}

总结：
至此有关简单的自定义控件已经介绍的差不多了，项目中很复杂的控件现在涉及的比较少，以后用到之后再做记录。

总结

以上是内存溢出为你收集整理的Android自定义控件ViewGroup实现标签云（四）全部内容，希望文章能够帮你解决Android自定义控件ViewGroup实现标签云（四）所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。