使用富文本SpannableString实现标签

     最近接触的项目中需要开发一个带标签的TextView，即在一段文字之后紧接着几个标签，需要效果如例图:

为了实现这个效果，我对TextView进行了继承，代码如下：

TagTextView.java:

public class TagTextViewextends TextView {

    private StringBuffer content_buffer;

    private TextView tv_tag;

    private Viewview;//标签布局的最外层布局

    private Context mContext;

//必须重写所有的构造器，否则可能会出现无法inflate布局的错误！

    public TagTextView(Context context) {

        super(context);

        mContext = context;

    }

    public TagTextView(Context context, AttributeSet attrs) {

        super(context,attrs);

        mContext = context;

    }

    public TagTextView(Context context, AttributeSet attrs, intdefStyleAttr) {

        super(context,attrs, defStyleAttr);

        mContext = context;

    }

    public void setContentAndTag(Stringcontent,List<String> tags){

        content_buffer = new StringBuffer(content);

        for (Stringitem : tags) {//将每个tag的内容添加到content后边，之后将用drawable替代这些tag所占的位置

            content_buffer.append(item);

        }

        SpannableString spannableString = new SpannableString(content_buffer);

        int replaceLength =content.length();

        for (int i = 0;i<tags.size();i++){

            String item = tags.get(i);

            View view = LayoutInflater.from(mContext).inflate(R.layout.tag,null);//R.layout.tag是每个标签的布局

            tv_tag = ((TextView)view.findViewById(R.id.tv_tag));

            tv_tag.setText(item);

            if (item.equals("HOT")){

                tv_tag.setBackgroundResource(R.drawable.red_bg);

            }else if (item.equals("NEW")){

                tv_tag.setBackgroundResource(R.drawable.orange_bg);

            }else if (item.equals("软文版")){

                tv_tag.setBackgroundResource(R.drawable.yellow_bg);

            }

            Bitmap bitmap = convertViewToBitmap(view);

            Drawable d = newBitmapDrawable(bitmap);

            d.setBounds(0,0,tv_tag.getWidth(),tv_tag.getHeight());//缺少这句的话，不会报错，但是图片不回显示

            ImageSpan span = new ImageSpan(d, ImageSpan.ALIGN_BOTTOM);//图片将对齐底部边线

            spannableString.setSpan(span,replaceLength,replaceLength+item.length(), Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);

            replaceLength += item.length();

        }

        setText(spannableString);

        setGravity(Gravity.CENTER_VERTICAL);

    }

    private static Bitmap convertViewToBitmap(Viewview){

        view.measure(View.MeasureSpec.makeMeasureSpec(0, View.MeasureSpec.UNSPECIFIED), View.MeasureSpec.makeMeasureSpec(0, View.MeasureSpec.UNSPECIFIED));

        view.layout(0, 0, view.getMeasuredWidth(), view.getMeasuredHeight());

        view.buildDrawingCache();

        Bitmap bitmap = view.getDrawingCache();

        return bitmap;

    }

}

标签布局如下:

tag.xml:

<?xmlversion="1.0"encoding="utf-8"?>

<LinearLayoutxmlns:android="http://schemas.android.com/apk/res/android"

    android:layout_width="match_parent"

    android:layout_height="match_parent"

    android:orientation="vertical">

    <TextView

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:background="@drawable/red_bg"

        android:id="@+id/tv_tag"

        android:textSize="12sp"

        android:textColor="@android:color/white"

        android:paddingLeft="3dp"

        android:paddingRight="3dp"

        android:paddingBottom="2dp"

        android:gravity="center_vertical"

        android:layout_gravity="center_vertical"

        android:layout_marginRight="5dp"

        android:layout_marginBottom="2dp"

        android:text="标签"/>

</LinearLayout>

调用过程：

Activity中的代码：

ttv_main = (TagTextView) findViewById(R.id.ttv_main);tags = new ArrayList<>();tags.add("NEW");tags.add("HOT");tags.add("软文版");tags.add("我是打酱油的");ttv_main.setContentAndTag("一二三四一二三四一二三四一二三四一二三四一二三四一二三四一二三",tags);