前言：
前面几篇讲了自定义控件绘制原理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, 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);
}
通过遍历所有子控件调用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, 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();
}
}
/**
* 负责设置子控件的测量模式和大小 根据所有子控件设置自己的宽和高
*/
@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, 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);
}
@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);
}
}
/**
* 记录子控件的坐标
*/
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;
}
}
总结：
至此有关简单的自定义控件已经介绍的差不多了，项目中很复杂的控件现在涉及的比较少，以后用到之后再做记录。
如对本文有疑问， 点击进行留言回复！！
Error running app: Default Activity Not Found
如何用HMS Nearby Service给自己的App添加近距离数据传输功能
BlockChain：2020年7月10日世界人工智能大会WAIC《链智未来 赋能产业区块链主题论坛》(四)
网友评论