Android根据标签长度自动换行

Android根据标签长度自动换行

Android 实际开发中，我们会经常会用到像标签那种不固定长度，而且能换行展示的效果，这里只能采取自定义控件去解决标签长度和自动换行的问题。

原理介绍：其实每个标签都是一个View，所以这个自定义控件是一个ViewGroup，用来管理这里所有的子View。自定义ViewGroup最重要的就是onMeasure和onLayout方法，前者用来测量自定义控件本身的大小，后者用来确定自定义控件中的每个子控件的位置。

主要介绍两个重头戏的方法，一个onMeasure方法，一个onLayout方法。

1.实现onMeasure方法

@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);

measureChildren(widthMeasureSpec, heightMeasureSpec);

final int count = getChildCount(); // tag的数量
int left = 0; // 当前的左边距离
int top = 0; // 当前的上边距离
int totalHeight = 0; // WRAP_CONTENT时控件总高度
int totalWidth = 0; // WRAP_CONTENT时控件总宽度

for (int i = 0; i < count; i++) {
View child = getChildAt(i);

LinearLayout.LayoutParams params = (LinearLayout.LayoutParams) child.getLayoutParams();

if (i == 0) { // 第一行的高度
totalHeight = params.topMargin + child.getMeasuredHeight() + params.bottomMargin;
}

if (left + params.leftMargin + child.getMeasuredWidth() + params.rightMargin > getMeasuredWidth()) { // 换行
left = 0;
top += params.topMargin + child.getMeasuredHeight() + params.bottomMargin; // 每个TextView的高度都一样，随便取一个都行
totalHeight += params.topMargin + child.getMeasuredHeight() + params.bottomMargin;
}

children.add(new int[]{left + params.leftMargin, top + params.topMargin, left + params.leftMargin + child.getMeasuredWidth(), top + params.topMargin + child.getMeasuredHeight()});

left += params.leftMargin + child.getMeasuredWidth() + params.rightMargin;

if (left > totalWidth) { // 当宽度为WRAP_CONTENT时，取宽度最大的一行
totalWidth = left;
}
}

int height = 0;
if (MeasureSpec.getMode(heightMeasureSpec) == MeasureSpec.EXACTLY) {
height = MeasureSpec.getSize(heightMeasureSpec);
} else {
height = totalHeight;
}

int width = 0;
if (MeasureSpec.getMode(widthMeasureSpec) == MeasureSpec.EXACTLY) {
width = MeasureSpec.getSize(widthMeasureSpec);
} else {
width = totalWidth;
}

setMeasuredDimension(width, height);
}

上面重写onMeasure方法，调用measureChildren(widthMeasureSpec, heightMeasureSpec);方法，这个方法的作用在于测量每个子控件的大小和模式，因为下面我们需要获取每个子控件的宽高和margin等参数的值。

2.实现OnLayout方法

@Override
protected void onLayout(boolean changed, int l, int t, int r, int b) {
final int count = getChildCount();

for (int i = 0; i < count; i++) {
View child = getChildAt(i);

int[] position = children.get(i);
child.layout(position[0], position[1], position[2], position[3]);
}
}

在onMeasure方法中，我们已经得到了每个子控件的left, top, right,bottom，所以这里就很简单了，直接调用layout方法确定每个子控件的位置即可。

完整代码如下：

/**
* Created by Administrator on 2016/7/19.
* Android根据标签长度自动换行
* @auther madreain
*/

public class LabelLayout extends ViewGroup {
private List<int[]> children;

public LabelLayout(Context context, AttributeSet attrs) {
super(context, attrs);

children = new ArrayList<int[]>();
}

@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);

measureChildren(widthMeasureSpec, heightMeasureSpec);

final int count = getChildCount(); // tag的数量
int left = 0; // 当前的左边距离
int top = 0; // 当前的上边距离
int totalHeight = 0; // WRAP_CONTENT时控件总高度
int totalWidth = 0; // WRAP_CONTENT时控件总宽度

for (int i = 0; i < count; i++) {
View child = getChildAt(i);

LinearLayout.LayoutParams params = (LinearLayout.LayoutParams) child.getLayoutParams();

if (i == 0) { // 第一行的高度
totalHeight = params.topMargin + child.getMeasuredHeight() + params.bottomMargin;
}

if (left + params.leftMargin + child.getMeasuredWidth() + params.rightMargin > getMeasuredWidth()) { // 换行
left = 0;
top += params.topMargin + child.getMeasuredHeight() + params.bottomMargin; // 每个TextView的高度都一样，随便取一个都行
totalHeight += params.topMargin + child.getMeasuredHeight() + params.bottomMargin;
}

children.add(new int[]{left + params.leftMargin, top + params.topMargin, left + params.leftMargin + child.getMeasuredWidth(), top + params.topMargin + child.getMeasuredHeight()});

left += params.leftMargin + child.getMeasuredWidth() + params.rightMargin;

if (left > totalWidth) { // 当宽度为WRAP_CONTENT时，取宽度最大的一行
totalWidth = left;
}
}

int height = 0;
if (MeasureSpec.getMode(heightMeasureSpec) == MeasureSpec.EXACTLY) {
height = MeasureSpec.getSize(heightMeasureSpec);
} else {
height = totalHeight;
}

int width = 0;
if (MeasureSpec.getMode(widthMeasureSpec) == MeasureSpec.EXACTLY) {
width = MeasureSpec.getSize(widthMeasureSpec);
} else {
width = totalWidth;
}

setMeasuredDimension(width, height);
}

@Override
protected void onLayout(boolean changed, int l, int t, int r, int b) {
final int count = getChildCount();

for (int i = 0; i < count; i++) {
View child = getChildAt(i);

int[] position = children.get(i);
child.layout(position[0], position[1], position[2], position[3]);
}
}
}

具体使用：

xml:

<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
>

<com.motoband.ui.view.LabelLayout
android:id="@+id/taglayout_show_label"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="@dimen/dp12"
android:layout_marginBottom="@dimen/dp12"
/>

</LinearLayout>

代码中的使用：

for(int i=0;i<6;i++){
TextView textView=new TextView(this);
if(i/2==0){
textView.setText("这是加油加油加油加油第"+i+"个");
}else {
textView.setText("这是第"+i+"个");
}

textView.setTextColor(getResources().getColor(R.color.M4A4D4F));
textView.setGravity(Gravity.CENTER);
textView.setTextSize(10);
textView.setBackgroundResource(R.drawable.add_success_label);

LinearLayout.LayoutParams layoutParams=new LinearLayout.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT);
layoutParams.width=ViewGroup.LayoutParams.WRAP_CONTENT;
layoutParams.height=PixelOrdpManager.dip2px(getBaseContext(),25);
layoutParams.setMargins(PixelOrdpManager.dip2px(getBaseContext(),13),PixelOrdpManager.dip2px(getBaseContext(),12),0,PixelOrdpManager.dip2px(getBaseContext(),12));
textView.setLayoutParams(layoutParams);

taglayout_show_label.addView(textView);

}