支持定义前后缀文字和文字颜色的TextView

支持定义前后缀文字和文字颜色的TextView

MultipleTextView介绍

MultipleTextView是一个支持定义前后缀文字和文字颜色的TextView,效果图如下：

其中，数字200的左边文字是MultipleTextView的前缀,右边文字是MultipleTextView的后缀,一般前缀后缀都是写死的,你可以在xml里面定义前缀和后缀,也可以在代码中修改前缀后缀

使用

在布局文件中，使用MultipleTextView，代码如下：

 <com.jaychan.view.MultipleTextView
    android:id="@+id/multiple_text_view"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerInParent="true"
    app:prefixText="您消费了 : "
    app:prefixTextColor="#424242"
    app:contentText="200"
    app:contentTextColor="#ff0000"
    app:suffixText=" 元"
    app:suffixTextColor="#424242"/>

其中

prefixText:    前缀文字
prefixTextColor: 前缀文字颜色(若没有设置,默认和内容的颜色一样)
contentText： 内容文字
contentTextColor: 内容文字颜色
suffixText： 后缀文字
suffixTextColor： 后缀文字颜色(若没有设置,默认和内容的颜色一样)

在代码中

MultipleTextView multipleTextView = (MultipleTextView) findViewById(R.id.multiple_text_view);

multipleTextView.setPrefixText("您消费了: "); //设置前缀文字multipleTextView.setPrefixTextColor(Color.parseColor("#424242")); //设置前缀文字颜色multipleTextView.setContentText("200");   //设置内容文字multipleTextView.setContentTextColor(Color.parseColor("#ff0000"));   //设置内容文字颜色multipleTextView.setSuffixText(" 元");  //设置后缀文字multipleTextView.setSuffixTextColor(Color.parseColor("#424242")); //设置后缀文字颜色

源码解析

MultipleTextView继承TextView,自定义了一些属性,主要有这些属性:

 <declare-styleable name="MultipleTextView">

    <!--前缀文字-->
    <attr name="prefixText" format="string"/>
    <!--前缀文字颜色-->
    <attr name="prefixTextColor" format="color"/>

    <!--内容文字-->
    <attr name="contentText" format="string"/>
    <!--内容文字颜色-->
    <attr name="contentTextColor" format="color"/>

    <!--后缀文字-->
    <attr name="suffixText" format="string"/>
    <!--后缀文字颜色-->
    <attr name="suffixTextColor" format="color"/></declare-styleable>

在构造方法中接收这些属性

public MultipleTextView(Context context, AttributeSet attrs, int defStyleAttr) {    super(context, attrs, defStyleAttr);

    TypedArray ta = context.obtainStyledAttributes(attrs, R.styleable.MultipleTextView);

    prefixText = ta.getString(R.styleable.MultipleTextView_prefixText);  //前缀文字
    contentText = ta.getString(R.styleable.MultipleTextView_contentText);    //内容文字
    suffixText = ta.getString(R.styleable.MultipleTextView_suffixText);  //后缀

    prefixTextColor = ta.getColor(R.styleable.MultipleTextView_prefixTextColor, getCurrentTextColor());  //前缀文字颜色,默认值为内容文字的颜色
    contentTextColor = ta.getColor(R.styleable.MultipleTextView_contentTextColor, getCurrentTextColor());  //内容文字颜色默认值为TextView默认的颜色
    suffixTextColor = ta.getColor(R.styleable.MultipleTextView_suffixTextColor, getCurrentTextColor()); //默认值为内容文字的颜色,默认值为内容文字的颜色

    ta.recycle();

    updateUI();
}

最主要的文字处理在updateUI这个方法里面

  private void updateUI() {        if (builder == null) {
            builder = new SpannableStringBuilder();
        }        if (!TextUtils.isEmpty(prefixText)) {  //前缀不为空
            SpannableString prefixSpannableString = new SpannableString(prefixText);            
            //设置前缀文字颜色
            colorSpan = new ForegroundColorSpan(prefixTextColor);
            prefixSpannableString.setSpan(colorSpan, 0, prefixText.length(), Spannable.SPAN_INCLUSIVE_INCLUSIVE);            
            //添加到builder
            builder.append(prefixSpannableString);
        }        if (!TextUtils.isEmpty(contentText)) {   //内容文字不为空
            SpannableString contentSpannableString = new SpannableString(contentText);            
            //设置内容文字颜色
            colorSpan = new ForegroundColorSpan(contentTextColor);
            contentSpannableString.setSpan(colorSpan, 0, contentText.length(), Spannable.SPAN_INCLUSIVE_INCLUSIVE);            
            //添加到builder
            builder.append(contentSpannableString);
        }        if (!TextUtils.isEmpty(suffixText)) {  //后缀不为空
            SpannableString suffixSpannableString = new SpannableString(suffixText);            
            //设置后缀文字颜色
            colorSpan = new ForegroundColorSpan(suffixTextColor);
            suffixSpannableString.setSpan(colorSpan, 0, suffixText.length(), Spannable.SPAN_INCLUSIVE_INCLUSIVE);            
            //添加到builder
            builder.append(suffixSpannableString);
        }

        setText(builder);
        builder.clear();
}

SpannableString ： Android系统通过这个类来对指定文本进行相关处理
在这里我们用它来定义前缀和后缀的颜色,

SpannableString的setSpan方法参数说明：

object what ：对应的Spanint start：开始应用指定Span的位置，索引从0开始int end：结束应用指定Span的位置，特效并不包括这个位置int flags：取值有如下四个
Spannable.SPAN_EXCLUSIVE_EXCLUSIVE：前后都不包括，即在指定范围的前面和后面插入新字符都不会应用新样式
Spannable.SPAN_EXCLUSIVE_INCLUSIVE ：前面不包括，后面包括。即仅在范围字符的后面插入新字符时会应用新样式
Spannable.SPAN_INCLUSIVE_EXCLUSIVE ：前面包括，后面不包括。
Spannable.SPAN_INCLUSIVE_INCLUSIVE ：前后都包括。

思路：把三部分文字用SpannableString来设置各自的颜色,然后通过SpannableStringBuilder来拼接，最后在setText方法中传入SpannableStringBuilder

导入

在项目根目录下的build.gradle中的allprojects{}中，添加jitpack仓库地址，如下：

allprojects {
    repositories {
        jcenter()
        maven { url 'https://jitpack.io' }//添加jitpack仓库地址
    }
}

打开app的module中的build.gradle，在dependencies{}中，添加依赖，如下：

dependencies {
    ......
     compile 'com.github.JayChan95318:MultipleTextView:1.0'}

github地址：https://github.com/JayChan95318/MultipleTextView.git

原文链接：http://www.apkbus.com/blog-917772-68441.html