SpannableStringUtil实现丰富文字效果

曾经终败给现在 2022-03-09 11:42 320阅读 0赞

> 代码地址如下：  
> [http://www.demodashi.com/demo/15007.html][http_www.demodashi.com_demo_15007.html]

\#\#\#\#前言  
在android开发中，我们不免会用到 TextView 的各种显示效果，如字体样式，颜色，大小，背景等。今天要讲的就是这么一个工具类SpannableStringUtil，方便快捷的实现各种文字效果。

今天涉及的内容有：

1.  SpannableString"截取"基本介绍
2.  SpannableStringUtil的各种特效使用介绍
3.  SpannableStringUtil的综合使用
4.  效果图和项目结构图

注:文字效果的使用封装到SpannableStringUtil类中，具体使用大家可以参考demo，下面做具体介绍。  
\#\#\#\#\#一. SpannableString"截取"基本介绍  
SpannableString设置样式的时候，涉及到下标"截取"样式的问题，其"截取"样式分以下四种：

Spanned.SPAN_EXCLUSIVE_EXCLUSIVE: (start，end) --- 前后下标都不包括
      Spanned.SPAN_EXCLUSIVE_INCLUSIVE: (start，end] --- 前面不包括,后面包括
      Spanned.SPAN_INCLUSIVE_EXCLUSIVE: [start，end) --- 前面包括,后面不包括
      Spanned.SPAN_INCLUSIVE_INCLUSIVE: [start，end] --- 前后都包括

\#\#\#\#\#二. SpannableStringUtil的各种特效使用介绍  
\#\#\#\#\#\#2.01 设置字体大小

//设置字体大小
            String textSizeStr="设置字体大小";
            String textSizeChar="字体";
            SpannableString textSizeSp=SpannableStringUtil.setTextSize(textSizeStr,textSizeChar,1.5f);
            mTvTextSize.setText(textSizeSp);

\#\#\#\#\#\#2.02 设置文字前景色

//设置文字前景色
            String textFrontColorStr="设置文字前景色";
            String textFrontColorChar="前景色";
            SpannableString textFrontColorSp=SpannableStringUtil.setTextFrontColor(textFrontColorStr,textFrontColorChar,R.color.red);
            mTvTextFrontColor.setText(textFrontColorSp);

\#\#\#\#\#\#2.03 设置背景色

//设置背景色
            String textBgColorStr="设置背景色";
            String textBgColorChar="背景色";
            SpannableString textBgColorSp=SpannableStringUtil.setTextBackgroundColor(textBgColorStr,textBgColorChar,R.color.blue);
            mTvTextBgColor.setText(textBgColorSp);

\#\#\#\#\#\#2.04 设置字体样式

String textStyleStr="设置字体样式,普通,粗体,斜体,粗斜体,写完了";
            String textStyleOneChar="普通";
            String textStyleTwoChar="粗体";
            String textStyleThreeChar="斜体";
            String textStyleFourChar="粗斜体";
            SpannableString oneSp=SpannableStringUtil.setTextStyle(textStyleStr,textStyleOneChar, Typeface.NORMAL);
            SpannableString twoSp=SpannableStringUtil.setTextStyle(oneSp,textStyleTwoChar, Typeface.BOLD);
            SpannableString threeSp=SpannableStringUtil.setTextStyle(twoSp,textStyleThreeChar, Typeface.ITALIC);
            SpannableString fourSp=SpannableStringUtil.setTextStyle(threeSp,textStyleFourChar, Typeface.BOLD_ITALIC);
            mTvTextStyle.setText(fourSp);

\#\#\#\#\#\#2.05 设置文字划线

String textLineStr="设置文字划线,下划线和中划线,写完了";
            String textLineOneChar="下划线";
            String textLineTwoChar="中划线";
            SpannableString onefSp=SpannableStringUtil.setTextLine(textLineStr,textLineOneChar,false);
            SpannableString twofSp=SpannableStringUtil.setTextLine(onefSp,textLineTwoChar,true);
            mTvTextLine.setText(twofSp);

\#\#\#\#\#\#2.06 设置内容上角标，下角标  
注意mTvTextMark要设置足够的paddingTop和paddingBottom，不然上下标会显示不全

//设置内容上角标，下角标
            //注意mTvTextMark要设置足够的paddingTop和paddingBottom，不然上下标会显示不全
            String textMarkStr="设置文字上角标和文字下角标";
            String textMarkOneChar="上角标";
            String textMarkTwoChar="下角标";
            SpannableString oneMarkSp=SpannableStringUtil.setTextMark(textMarkStr,textMarkOneChar,true);
            SpannableString twoMarkSp=SpannableStringUtil.setTextMark(oneMarkSp,textMarkTwoChar,false);
            mTvTextMark.setText(twoMarkSp);

\#\#\#\#\#\#2.07 设置内容沿x方向拉伸

String textXStr="设置内容沿x方向拉伸";
            String textXChar="x方向拉伸";
            SpannableString xSp=SpannableStringUtil.setTextScaleX(textXStr,textXChar,2f);
            mTvTextXscale.setText(xSp);

\#\#\#\#\#\#2.08 左侧右侧插入图片

String pictureStr="设置左侧和右侧插入图片";
            String pictureOneChar="左";
            String pictureTwoChar="右";
            SpannableString pictureOneSp=SpannableStringUtil.setTextLeftImage(pictureStr,pictureOneChar,R.mipmap.ic_check);
            SpannableString pictureTwoSp=SpannableStringUtil.setTextRightImage(pictureOneSp,pictureTwoChar,R.mipmap.ic_check);
            mTvPicture.setText(pictureTwoSp);

\#\#\#\#\#\#2.09 将文字替换成图片

String replaceStr="将文字替换成图片";
            String replaceChar="文字";
            SpannableString replaceSp=SpannableStringUtil.replaceTextByImage(replaceStr,replaceChar,R.mipmap.ic_check);
            mTvReplaceByImage.setText(replaceSp);

\#\#\#\#\#\#2.10 设置可点击

//设置可点击
            String clickableStr="我是可以点击的";
            String clickableChar="点击";
            SpannableString clickableSp=SpannableStringUtil.setClickText(clickableStr, clickableChar, R.color.red, false, new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    showShort("我被点击了");
                }
            });
            mTvTextClick.setText(clickableSp);
            //必须设置才能响应点击事件
            mTvTextClick.setMovementMethod(LinkMovementMethod.getInstance());

\#\#\#\#\#\#2.11 打电话

//打电话
            String callStr="电话号码:13721057328";
            String callChar="13721057328";
            SpannableString callSp=SpannableStringUtil.callUp(callStr,callChar,callChar);
            mTvTextCall.setText(callSp);
            //必须设置才能响应点击事件
            mTvTextCall.setMovementMethod(LinkMovementMethod.getInstance());

\#\#\#\#\#\#2.12 发邮件,短信,彩信

//发邮件,短信,彩信
            String functionStr="发邮件,短信,彩信";
            String emailChar="邮件";
            String smsChar="短信";
            String mmsChar="彩信";
            String functionEmail="125489713@qq.com";
            String functionPhone="13721057328";
            SpannableString  functionSp1=SpannableStringUtil.sendEmail(functionStr,functionEmail,emailChar);
            SpannableString  functionSp2=SpannableStringUtil.sendSMS(functionSp1,functionPhone,smsChar);
            SpannableString  functionSp3=SpannableStringUtil.sendMMS(functionSp2,functionPhone,mmsChar);
            mTvTextFunction.setText(functionSp3);
            //必须设置才能响应点击事件
            mTvTextFunction.setMovementMethod(LinkMovementMethod.getInstance());

\#\#\#\#\#\#2.13 打开地图,网页和超链接

String geoStr="打开地图,网页和超链接";
            String longitude="121.4";//经度
            String latitude="121.4";//纬度
            SpannableString geoSp=SpannableStringUtil.sendGEO(geoStr,longitude,latitude,"地图");
            SpannableString webSp=SpannableStringUtil.openWeb(geoSp,"http://www.baidu.com","网页");
            SpannableString urlSp=SpannableStringUtil.setTextURL(webSp,"http://www.baidu.com","超链接");
            mTvTextGEO.setText(urlSp);
            //必须设置才能响应点击事件
            mTvTextGEO.setMovementMethod(LinkMovementMethod.getInstance());

\#\#\#\#\#\#2.14 设置项目符号

//设置项目符号
            String itemStr="设置项目符号";
            SpannableString itemSp=SpannableStringUtil.setTextItem(itemStr,10,R.color.black,itemStr);
            mTvTextItem.setText(itemSp);

\#\#\#\#\#\#2.15 设置字体模糊ABCD和浮雕效果  
注:设置浮雕效果需要在对应的mainfast的activity中添加android:hardwareAccelerated=“false”

String effectStr="设置字体模糊ABCD和浮雕效果";
            SpannableString defultEffectSp=SpannableStringUtil.setTextFuzzy(effectStr,10, BlurMaskFilter.Blur.NORMAL,"A");
            SpannableString innerEffectSp=SpannableStringUtil.setTextFuzzy(defultEffectSp,10, BlurMaskFilter.Blur.INNER,"B");
            SpannableString outerEffectSp=SpannableStringUtil.setTextFuzzy(innerEffectSp,10, BlurMaskFilter.Blur.OUTER,"C");
            SpannableString solidEffectSp=SpannableStringUtil.setTextFuzzy(outerEffectSp,10, BlurMaskFilter.Blur.SOLID,"D");
            //设置浮雕效果需要在对应的mainfast的activity中添加android:hardwareAccelerated="false"
            SpannableString reliefEffectSp=SpannableStringUtil.setTextRelief(solidEffectSp,new float[]{10, 10, 10}, 0.5f, 1f, 1f,"浮雕");
            mTvTextEffect.setText(reliefEffectSp);

在mainfast中加入配置代码如下：

<activity android:name=".MainActivity"
                android:hardwareAccelerated="false">
                //以下代码省略
                //......
            </activity>

\#\#\#\#\#三. SpannableStringUtil的综合使用  
下面以实现有新消息展示有圆点为例：  
实现代码如下：

//综合使用,展示新消息小圆点
            String pointStr="新消息•";
            String pointFrontColorChar="•";
            SpannableString pointSizeSp=SpannableStringUtil.setTextSize(pointStr,pointFrontColorChar,2.2f);
            SpannableString pointFrontColorSp=SpannableStringUtil.setTextFrontColor(pointSizeSp,pointFrontColorChar,R.color.red);
            mTvTextPoint.setText(pointFrontColorSp);

\#\#\#\#\#四.效果图和项目结构图  
实现小圆点的效果图  
![image.png][]

整体效果图  
![1.png][]  
项目结构图  
![image.png][image.png 1]SpannableStringUtil实现丰富文字效果

> 代码地址如下：  
> [http://www.demodashi.com/demo/15007.html][http_www.demodashi.com_demo_15007.html]

> 注：本文著作权归作者，由demo大师发表，拒绝转载，转载需要作者授权

[http_www.demodashi.com_demo_15007.html]: http://www.demodashi.com/demo/15007.html
[image.png]: /images/20220309/168c3ac5d58344b08efdc391c85d934e.png
[1.png]: /images/20220309/eeae4404dba64b6d849919b758f1e25b.png
[image.png 1]: /images/20220309/b11bdf60ad6443ee96ca3a1534a9ad1e.png