androi自定义自动换行的View(类似网页的标签Tag)

看来只有礼拜天才有时间写点博客啊,平时只能埋头苦干了。今天在公司加班,遇到一个需求,就是自动换行的TextView,有点像网页的tag标签,点击一下,就自动加上去了,不过这个是根据后台拿来的数据来显示多少个View,在网上找找,看见了许多,我自己也封装写一个吧,以便以后需要...开工

package com.woyou.ui.component;

import android.content.Context;
import android.util.AttributeSet;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;

import com.citaq.ideliver.R;

/**
 * 自动换行的View
 *
 * @author shenzhou	2015年1月11日
 */
public class WordWrapView extends ViewGroup {
	private static final int PADDING_HOR = 10;// 水平方向padding
	private static final int PADDING_VERTICAL = 15;// 垂直方向padding
	private static final int SIDE_MARGIN = 10;// 左右间距
	private static final int TEXT_MARGIN = 10;

	public WordWrapView(Context context) {
		super(context);
	}

	public WordWrapView(Context context, AttributeSet attrs) {
		super(context, attrs);
	}

	public WordWrapView(Context context, AttributeSet attrs, int defStyle) {
		super(context, attrs, defStyle);
	}

	@Override
	protected void onLayout(boolean changed, int l, int t, int r, int b) {
		int childCount = getChildCount();
		int autualWidth = r - l;
		int x = SIDE_MARGIN;// 横坐标开始
		int y = 0;// 纵坐标开始
		int rows = 1;
		for (int i = 0; i < childCount; i++) {
			View view = getChildAt(i);
			view.setBackgroundResource(R.drawable.shopdetail_keytag_bg);
			int width = view.getMeasuredWidth();
			int height = view.getMeasuredHeight();
			x += width + TEXT_MARGIN;
			if (x > autualWidth) {
				x = width + SIDE_MARGIN;
				rows++;
			}
			y = rows * (height + TEXT_MARGIN);
			if (i == 0) {
				view.layout(x - width - TEXT_MARGIN, y - height, x
						- TEXT_MARGIN, y);
			} else {
				view.layout(x - width, y - height, x, y);
			}
		}

	}

	@Override
	protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
		int x = 0;// 横坐标
		int y = 0;// 纵坐标
		int rows = 1;// 总行数
		int specWidth = MeasureSpec.getSize(widthMeasureSpec);
		int actualWidth = specWidth - SIDE_MARGIN * 2;// 实际宽度
		int childCount = getChildCount();
		for (int index = 0; index < childCount; index++) {
			View child = (TextView) getChildAt(index);
			child.setPadding(PADDING_HOR, PADDING_VERTICAL, PADDING_HOR,
					PADDING_VERTICAL);
			child.measure(MeasureSpec.UNSPECIFIED, MeasureSpec.UNSPECIFIED);
			int width = child.getMeasuredWidth();
			int height = child.getMeasuredHeight();
			x += width + TEXT_MARGIN;
			if (x > actualWidth) {// 换行
				x = width;
				rows++;
			}
			y = rows * (height + TEXT_MARGIN);
		}
		setMeasuredDimension(actualWidth, y);
	}

}

具体使用:

我的项目的布局文件太长了,我就说了

<com.woyou.ui.component.WordWrapView
	               style="@style/shopDetailTextStyle"
	               android:id="@+id/shopdetail_container"
	               android:layout_width="match_parent"
	               android:layout_height="wrap_content"
	               android:orientation="vertical"
	               android:paddingLeft="@dimen/dp20"
	               android:paddingRight="@dimen/dp20"
	               android:paddingTop="@dimen/dp10" />

把这段布局文件加到你要把文字自动换行的地方。java文件中的使用:

if ( !TextUtils.isEmpty(shopDetail.getInfo()) ) {
					infoLin.setVisibility(View.VISIBLE);
					//店铺关键字
					String key = shopDetail.getKey();
					strs = key.split("\\|");
					for (int i = 0; i < strs.length; i++) {
					      TextView textview = new TextView(mActivity);
					      textview.setText(strs[i]);
					      wordWrapView.addView(textview);
					}
					LogUtil.i(TAG, "tags:" + strs.toString());

前面还有找到控件什么的,我相信大家都是知道的。这只是核心代码,效果图如下:

****************************************************************************************************************************

**********************介绍另外一种方法,是某个大神写的,不过没封装,供大家参考***********************************

****************************************************************************************************************************

 /** 标签之间的间距 px */
    private final int itemMargins = (int) getContext().getResources().getDimension(R.dimen.dp15);
    /** 标签的行间距 px */
    private final int lineMargins = (int) getContext().getResources().getDimension(R.dimen.dp10);  
/**
	 * 加载店铺关键字
	 * @param tags
	 */
	private void loadShopKeys (String[] tags) {
		if ( tags == null )
			return;
		final int containerWidth = container.getMeasuredWidth() - container.getPaddingRight()  - container.getPaddingLeft();
        final LayoutInflater inflater = mActivity.getLayoutInflater();  

        /** 用来测量字符的宽度 */
        final Paint paint = new Paint();
        final TextView textView = (TextView) inflater.inflate(R.layout.item_textviewtag_lv, null);
        final int itemPadding = textView.getCompoundPaddingLeft() + textView.getCompoundPaddingRight();
        final LinearLayout.LayoutParams tvParams = new LinearLayout.LayoutParams(LayoutParams.WRAP_CONTENT,  LayoutParams.WRAP_CONTENT);
        tvParams.setMargins(0, 0, itemMargins, 0);  

        paint.setTextSize(textView.getTextSize());
        LinearLayout layout = new LinearLayout(getContext());
        layout.setLayoutParams(new LinearLayout.LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.WRAP_CONTENT));
        layout.setOrientation(LinearLayout.HORIZONTAL);
        container.addView(layout);  

        final LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.WRAP_CONTENT);
        params.setMargins(0, lineMargins, 0, 0);  

        /** 一行剩下的空间 **/
        int remainWidth = containerWidth;  

        for (int i = 0; i < tags.length; ++i) {
            final String text = tags[i];
            final float itemWidth = paint.measureText(text) + itemPadding;
            if (remainWidth > itemWidth) {
                addItemView(inflater, layout, tvParams, text);
            } else {
                resetTextViewMarginsRight(layout);
                layout = new LinearLayout(getContext());
                layout.setLayoutParams(params);
                layout.setOrientation(LinearLayout.HORIZONTAL);  

                /** 将前面那一个textview加入新的一行 */
                addItemView(inflater, layout, tvParams, text);
                container.addView(layout);
                remainWidth = containerWidth;
            }
            remainWidth = (int) (remainWidth - itemWidth + 0.5f) - itemMargins;
        }
        resetTextViewMarginsRight(layout);
    }  

	/***************** 将每行最后一个textview的MarginsRight去掉 *********************************/
    private void resetTextViewMarginsRight(ViewGroup viewGroup) {
        final TextView tempTx = (TextView) viewGroup.getChildAt(viewGroup.getChildCount() - 1);
        tempTx.setLayoutParams(new LinearLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT));
    }  

    private void addItemView(LayoutInflater inflater, ViewGroup viewGroup, android.widget.LinearLayout.LayoutParams tvParams, String text) {
        final TextView itemTx = (TextView) inflater.inflate(R.layout.item_textviewtag_lv, null);
        itemTx.setText(text);
        viewGroup.addView(itemTx, tvParams);
    }

好了,到此结束了,屌丝要继续加班了,话说都好几天没打LoL,有点怀念了,等这段时间过了,本吊要撸到天明...

时间: 2024-12-25 10:33:39

androi自定义自动换行的View(类似网页的标签Tag)的相关文章

C#自定义双向链表,功能类似C++中的CList

参照博客: http://www.cnblogs.com/linzheng/news/2011/07/14/2106530.html. http://blog.csdn.net/dongxinxi/article/details/6303421 C#自定义双向链表,功能类似C++中的CList,布布扣,bubuko.com

贝塞尔曲线:原理、自定义贝塞尔曲线View、使用!!!

一.原理 转自:http://www.2cto.com/kf/201401/275838.html Android动画学习Demo(3) 沿着贝塞尔曲线移动的Property Animation Property Animation中最重要,最基础的一个类就是ValueAnimator了.Property Animation利用ValueAnimator来跟踪记录对象属性已经变化了多长时间及当前这个时间点的值. 而在ValueAnimator中,又封装了两个类: 1)TimeInterpolat

android自定义手势解锁View

有时候为了程序的安全性,我们经常要采取一些安全措施,就像我们常用的支付宝那样,隔一定的时间再回到应用程序时会让用户利用手势去解锁应用程序,最近由于项目需求,也要求做这样一个功能,当用户切出本应用程序15分钟后回来,让用户手势解锁,整个需求的难点就在如何实现这个手势锁,开始一点头绪也没有,没有一点思路去实现这个手势解锁功能,在google了一番后看了一篇非常好的博客后,按照博主的思路的确是可以实现一个十分不错的手势锁View,也参考了下那位大神的代码,下面是我根据他的思路和代码片段实现的一个自定义

[转]Android中自定义样式与View的构造函数中的第三个参数defStyle的意义

转自:http://www.cnblogs.com/angeldevil/p/3479431.html Android中自定义样式与View的构造函数中的第三个参数defStyle的意义 零.序 一.自定义Style 二.在XML中为属性声明属性值 1. 在layout中定义属性 2. 设置Style 3. 通过Theme指定 三.在运行时获取属性值 1. View的第三个构造函数的第三个参数defStyle 2. obtailStyledAttributes 3. Example 四.结论与代

自定义控件(视图)2期笔记14:自定义视图之View事件分发 dispatchTouchEvent,onTouch,onTouchEvent,onClick逻辑顺序过程

1. 这里我们先从案例角度说明dispatchTouchEvent,onTouch,onTouchEvent,onClick逻辑顺序过程: (1)首先我们重写一个MyButton 继承自 Button,代码如下: 1 package com.himi.eventdemo; 2 3 import android.content.Context; 4 import android.util.AttributeSet; 5 import android.util.Log; 6 import andro

浅析网页meta标签中X-UA-Compatible属性的使用

今天有一个做开发的朋友突然问你知道很多网站上面加入的X-UA-Compatible属性的意义么?其实这个在以前还专门花了一点时间来验证我自己的想法,结果也确实如自己所预想的那样,八九不离十,当然有一点点的偏差.我做的项目中也并不是每个项目中都使用该属性.那么我们首先来看看几个知名站点,他们也使用了这个 上面时淘宝的,下面是百度的. 都可以发现在head中又一个meta,里面有一个X-UA-Compatible的属性,而且确实非常多的网站中在使用.当然也有很多网站是在开发的时候不管三七二十一给加上

网页编辑标签及属性

网页是通过编辑不同的标签来完成的.大多数的标签通常由两个组成,开始跟结束,如<html>...</html>.每个标签都能够添加属性,属性通常编辑在开始标签里.<body bgcolor="  ">...</body>,其中bgcolor编辑的是body 的属性,是背景颜色.body编辑属性还有:text 文字颜色,topmargin 上页边距  leftmargin.rightmargin.bottomargin,background

JSP自定义分页标签TAG

首先我们需要在WEB-INF/tld/目录下创建page.tld文件 <?xml version="1.0" encoding="ISO-8859-1"?> <taglib> <tlib-version>1.0</tlib-version> <jsp-version>1.2</jsp-version> <short-name>page</short-name> <u

C#用正则表达式 获取网页源代码标签的属性或值

 原文地址:http://blog.csdn.net/lhfly/article/details/7684319 整理两个 在C#中,用正则表达式 获取网页源代码标签的属性或值的方法 : 1.获取标签中的值: <a href="www.csdn.net" class="main" >CSDN</a> 结果:CSDN /// <summary> /// 获取字符中指定标签的值 /// </summary> /// <