Android 富文本SpannableString

一、认识SpannableString

  • 为什么要使用富文本
    在Android开发中,有很多UI会画出一些特别炫酷的界面出来,比如一个字符串里有特殊的字会有其他颜色并加粗、变大变小、插入小图片、给某几个文字添加边框,如果我们使用笨办法用几个TextView或者ImageView来链接,这样虽然能实现但是会不会很笨重,如果出现换行就尴尬了,他不能想做到无缝换行造成效果跟预期效果相差太大,如果效果很复杂是不是会给应用增加体验负担?还会给带来适配的问题,SpannableString的出现帮我们解决了这一系列的问题。

  • 他能给我们带来什么
    解决复杂的字符串效果UI效果,

二、 如何实现SpannableString的功能效果

  • 比较常用的Span样式
  1. BackgroundColorSpan : 文本背景色、
  2. ForegroundColorSpan : 文本颜色
  3. MaskFilterSpan : 修饰效果,如模糊(BlurMaskFilter)浮雕
  4. RasterizerSpan : 光栅效果
  5. StrikethroughSpan : 删除线
  6. SuggestionSpan : 相当于占位符
  7. UnderlineSpan : 下划线
  8. AbsoluteSizeSpan : 文本字体(绝对大小)
  9. DynamicDrawableSpan : 设置图片,基于文本基线或底部对齐。
  10. ImageSpan : 图片
  11. RelativeSizeSpan : 相对大小(文本字体)
  12. ScaleXSpan : 基于x轴缩放
  13. StyleSpan : 字体样式:粗体、斜体等
  14. SubscriptSpan : 下标(数学公式会用到)
  15. SuperscriptSpan : 上标(数学公式会用到)
  16. TextAppearanceSpan : 文本外貌(包括字体、大小、样式和颜色)
  17. TypefaceSpan : 文本字体
  18. URLSpan : 文本超链接
  19. ClickableSpan : 点击事件

效果:

在这里插入图片描述

public class CommShowSpanActivity extends AppCompatActivity {@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_comm_show_span);TextView text = findViewById(R.id.text);text.setTextSize(23);String str = "东风路看对方了困难发了多少你疯啦百度一下上岛咖啡了上来看待离开克里斯丁肺宁颗粒道德积分呢小四的减肥我欧艾斯都放开克里斯丁肺宁颗粒道德积分呢小四的减肥我欧艾斯都放开克里斯丁肺宁颗粒道德积分呢小四的减肥我欧艾斯都放假哦吉安市都放假哦so";SpannableString spannableString = new SpannableString(str);/*字体变大变小*/AbsoluteSizeSpan sizeSpan = new AbsoluteSizeSpan(80);spannableString.setSpan(sizeSpan, 0, 3, Spanned.SPAN_INCLUSIVE_EXCLUSIVE);/*某个字符串改变颜色*/ForegroundColorSpan foregroundColorSpan = new ForegroundColorSpan(Color.RED);spannableString.setSpan(foregroundColorSpan, 3, 6, Spanned.SPAN_INCLUSIVE_EXCLUSIVE);/*字符串的背景色*/BackgroundColorSpan backgroundColorSpan = new BackgroundColorSpan(Color.YELLOW);spannableString.setSpan(backgroundColorSpan, 6, 8, Spanned.SPAN_INCLUSIVE_EXCLUSIVE);/*下划线  颜色随字体颜色 */UnderlineSpan underlineSpan = new UnderlineSpan();spannableString.setSpan(underlineSpan, 0, 8, Spanned.SPAN_INCLUSIVE_EXCLUSIVE);/*删除线*/StrikethroughSpan strikethroughSpan = new StrikethroughSpan();spannableString.setSpan(strikethroughSpan, 8, 12, Spanned.SPAN_INCLUSIVE_EXCLUSIVE);/*暂位符*/SuggestionSpan suggestionSpan = new SuggestionSpan(CommShowSpanActivity.this, new String[]{"0000", "1111"}, SuggestionSpan.FLAG_EASY_CORRECT);spannableString.setSpan(suggestionSpan, 8, 12, Spanned.SPAN_INCLUSIVE_EXCLUSIVE);//Typeface  加粗StyleSpan styleSpan = new StyleSpan(Typeface.BOLD);spannableString.setSpan(styleSpan, 12, 16, Spanned.SPAN_INCLUSIVE_EXCLUSIVE);/*斜体文本*/StyleSpan styleSpan1 = new StyleSpan(Typeface.ITALIC);spannableString.setSpan(styleSpan1, 12, 16, Spanned.SPAN_INCLUSIVE_EXCLUSIVE);/*超链接*/URLSpan urlSpan = new URLSpan("http://www.baidu.com");spannableString.setSpan(urlSpan, 16, 20, Spanned.SPAN_INCLUSIVE_EXCLUSIVE);/*文本字体*/if (android.os.Build.VERSION.SDK_INT >= android.os.Build.VERSION_CODES.P) {TypefaceSpan typefaceSpan = new TypefaceSpan("");spannableString.setSpan(typefaceSpan, 16, 20, Spanned.SPAN_INCLUSIVE_EXCLUSIVE);}/*修饰效果,如模糊(BlurMaskFilter)*/MaskFilterSpan maskFilterSpan = new MaskFilterSpan(new BlurMaskFilter(12, BlurMaskFilter.Blur.SOLID));spannableString.setSpan(maskFilterSpan, 20, 25, Spanned.SPAN_INCLUSIVE_EXCLUSIVE);//浮雕MaskFilterSpan maskFilterSpan1 = new MaskFilterSpan(new EmbossMaskFilter(new float[]{10, 20, 30}, 0.5f, 0.5f, 15));spannableString.setSpan(maskFilterSpan1, 25, 30, Spanned.SPAN_INCLUSIVE_EXCLUSIVE);//TextAppearanceSpan 文本外貌(包括字体、大小、样式和颜色)TextAppearanceSpan textAppearanceSpan = new TextAppearanceSpan(this, R.style.text);spannableString.setSpan(textAppearanceSpan, 30, 33, Spanned.SPAN_INCLUSIVE_EXCLUSIVE);TextAppearanceSpan textAppearanceSpan1 = new TextAppearanceSpan(this,android.R.style.TextAppearance_Theme,getResources().getColor(R.color.colorPrimary));spannableString.setSpan(textAppearanceSpan1, 34, 35, Spanned.SPAN_INCLUSIVE_EXCLUSIVE);/*** DynamicDrawableSpan 设置图片,基于文本基线或底部对齐。*/DynamicDrawableSpan drawableSpan =new DynamicDrawableSpan(DynamicDrawableSpan.ALIGN_BASELINE) {@Overridepublic Drawable getDrawable() {Drawable d = getResources().getDrawable(R.mipmap.add_pic);d.setBounds(0, 0, d.getIntrinsicWidth()/2, d.getIntrinsicHeight()/2);return d;}};spannableString.setSpan(drawableSpan, 3, 4, Spannable.SPAN_INCLUSIVE_EXCLUSIVE);DynamicDrawableSpan drawableSpan2 = new DynamicDrawableSpan(DynamicDrawableSpan.ALIGN_BOTTOM) {@Overridepublic Drawable getDrawable() {Drawable d = getResources().getDrawable(R.mipmap.add_pic);d.setBounds(0, 0, 50, 50);return d;}};spannableString.setSpan(drawableSpan2, 7, 8, Spannable.SPAN_INCLUSIVE_EXCLUSIVE);/*** 设置字体相对大小*/RelativeSizeSpan relativeSizeSpan = new RelativeSizeSpan(2);spannableString.setSpan(relativeSizeSpan, 50, 60, Spannable.SPAN_INCLUSIVE_INCLUSIVE);/*** 下标脚注*/SubscriptSpan subscriptSpan = new SubscriptSpan();spannableString.setSpan(subscriptSpan, 69, 70, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);spannableString.setSpan(new ForegroundColorSpan(Color.RED),69, 70, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);/*** 上标*/SuperscriptSpan superscriptSpan = new SuperscriptSpan();spannableString.setSpan(superscriptSpan, 76, 77, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);spannableString.setSpan(new ForegroundColorSpan(Color.RED),76, 77, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);text.setText(spannableString);text.setMovementMethod(LinkMovementMethod.getInstance());}
}
  • ReplacementSpan给一串字符串中的某两个文字添加背景或者边框

效果:
在这里插入图片描述

代码:

public class TagBgSpan extends ReplacementSpan {/*** 当前tag的宽度*/public int currentMeasureTextWidth;/*** 左右間距*/public int paddingLandR = 10;/*** 标签之前的间距*/public int speed = 10;/*** 圆角*/private int radius = 10;/*** 背景色*/private int bgColor = Color.GRAY;/*** 画笔的风格*/private Paint.Style style = Paint.Style.STROKE;/*** 標簽颜色*/private int tagTextColor = Color.RED;public TagBgSpan setTagTextColor(int tagTextColor) {this.tagTextColor = tagTextColor;return this ;}public TagBgSpan setStyle(Paint.Style style) {this.style = style;return this ;}public TagBgSpan setBgColor(int bgColor) {this.bgColor = bgColor;return this;}public TagBgSpan setSpeed(int speed) {this.speed = speed;return this;}public TagBgSpan setRadius(int radius) {this.radius = radius;return this ;}@Overridepublic int getSize(@NonNull Paint paint, CharSequence text, int start, int end, @Nullable Paint.FontMetricsInt fm) {currentMeasureTextWidth = (int) (paint.measureText(text.toString(), start, end) + (paddingLandR * 2) + (speed * 2));return currentMeasureTextWidth;}@Overridepublic void draw(@NonNull Canvas canvas, CharSequence text, int start, int end, float x, int top, int y, int bottom, @NonNull Paint paint) {paint.setColor(bgColor);paint.setStyle(style);RectF rect = new RectF(x + speed, top, x + currentMeasureTextWidth - speed, bottom);canvas.drawRoundRect(rect, radius, radius, paint);paint.setColor(tagTextColor);paint.setStyle(Paint.Style.FILL_AND_STROKE);canvas.drawText(text, start, end, x + speed + paddingLandR, y, paint);}
}
  • ClickableSpan实现一串字符串中某几个文字支持点击功能
    效果:
    效果

代码:

public class MyClickableSpan extends ClickableSpan {private Context context ;public MyClickableSpan(Context context ){this.context=context;}@Overridepublic void updateDrawState(@NonNull TextPaint ds) {super.updateDrawState(ds);ds.setColor(Color.RED);ds.setFakeBoldText(true);}@Overridepublic void onClick(@NonNull View widget) {Toast.makeText(context,"测试onClick",Toast.LENGTH_SHORT).show();}
}
  • ImageSpan实现在字符串中插入图片

效果:
在这里插入图片描述

代码:

public class MyImageSpan extends ImageSpan {public MyImageSpan(@NonNull Context context, @NonNull Bitmap bitmap) {super(context, bitmap);}@Overridepublic int getSize(@NonNull Paint paint, CharSequence text, int start, int end, @Nullable Paint.FontMetricsInt fm) {return getDrawable().getIntrinsicWidth();}@Overridepublic void draw(@NonNull Canvas canvas, CharSequence text, int start, int end, float x, int top, int y, int bottom, @NonNull Paint paint) {super.draw(canvas, text, start, end, x, top, y, bottom, paint);Drawable b = getDrawable();Paint.FontMetricsInt fm = paint.getFontMetricsInt();int transY = (y + fm.descent + y + fm.ascent) / 2 - b.getBounds().bottom / 2;canvas.save();canvas.translate(x, transY);b.draw(canvas);canvas.restore();}
}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/83476.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

单片机第三季-第三课:STM32开发板原理图、配置、浮点运算单元

目录 1,开发板原理图 2,浮点运算单元(FPU) 1,开发板原理图 课程视频比较早,介绍了三款开发板。观看视频时用的开发板说和51单片机共板的STM32核心板,将51单片机从底座拆下来后,安…

avi怎么转换成视频?

avi怎么转换成视频?在我们日常使用的视频格式中,AVI是一种常见且经常被使用的音频视频交叉格式之一。它的优点之一是占用的存储空间相对较小,但也明显存在着画质损失的缺点。虽然AVI格式的视频在某种程度上也很常见,但与最常见的M…

zabbix的原理与安装

一、Zabbix介绍 1、zabbix 是什么? zabbix是一个开源的IT基础监控软件,能实时监控网络服务,服务器和网络设备的状态,如网络使用,CPU负载、磁盘空间等,主要是包括数据的收集、报警和通知的可视化界面zabbi…

VHOST-SCSI代码分析(1)VHOST SCSI设备模拟

VHOST SCSI设备的模拟是由QEMU和HOST共同实现的,QEMU模拟VHOST SCSI设备配置空间等,而对于虚拟机通知HOST和HOST通知虚拟机机制由HOST内核实现。 在QEMU中VHOST SCSI设备继承关系如下: 其它设备以及对应class_init函数和realize具现化实现与V…

LLM微调(一)| 单GPU使用QLoRA微调Llama 2.0实战

最近LLaMA 2在LLaMA1 的基础上做了很多优化,比如上下文从2048扩展到4096,使用了Grouped-Query Attention(GQA)共享多头注意力的key 和value矩阵,具体可以参考: 关于LLaMA 2 的细节,可以参考如下…

zotero通过DOI快速导入文献

之前我经常采用两种方式导入文献: (1)下载PDF,然后拖入zotero 这种方法比较费时间,有些文献无法下载pdf (2)通过google scholar检索文献,然后点击引用——EndNote,chorme…

Kotlin中函数的基本用法以及函数类型

函数的基本用法 1、函数的基本格式 2、函数的缺省值 可以为函数设置指定的初始值&#xff0c;而不必要传入值 private fun fix(name: String,age: Int 2){println(name age) }fun main(args: Array<String>) {fix("张三") }输出结果为&#xff1a;张三2 …

WebGL层次模型——多节点模型

目录 多节点模型 MultiJointModel中的层次结构 控制各部件旋转角度的变量 示例程序——共用顶点数据&#xff0c;通过模型矩阵缩放实现&#xff08;MultiJointModel.js&#xff09; MultiJointModel.js&#xff08;按键响应部分&#xff09; MultiJointModel.js&#x…

刷题日记——将x减到0的最小操作数

将x减到0的最小操作数 题目链接&#xff1a;https://leetcode.cn/problems/minimum-operations-to-reduce-x-to-zero/ 题目解读 题目要求移除元素总和等于参数x&#xff0c;这道题给我的第一感觉就是从数组的两边入手&#xff0c;对数据进行加和删除&#xff0c;但是这里有一…

滚雪球学Java(24):Java反射

&#x1f3c6;本文收录于「滚雪球学Java」专栏&#xff0c;专业攻坚指数级提升&#xff0c;助你一臂之力&#xff0c;带你早日登顶&#x1f680;&#xff0c;欢迎大家关注&&收藏&#xff01;持续更新中&#xff0c;up&#xff01;up&#xff01;up&#xff01;&#xf…

EasySwipeMenuLayout - 独立的侧滑删除

官网 GitHub - anzaizai/EasySwipeMenuLayout: A sliding menu library not just for recyclerview, but all views. 项目介绍 A sliding menu library not just for recyclerview, but all views. Recommended in conjunction with BaseRecyclerViewAdapterHelper Feature…

TS泛型的使用

函数中使用泛型&#xff1a; function identity<T>(arg: T): T {return arg; }let result identity<number>(10); // 传入number类型&#xff0c;返回number类型 console.log(result); // 输出: 10let value identity<string>(Hello); // 传入string类型&a…

ad18学习笔记十二:如何把同属性的元器件全部高亮?

1、先选择需要修改的器件的其中一个。 2、右键find similar objects&#xff0c;然后在弹出的对话框中&#xff0c;将要修改的属性后的any改为same 3、像这样勾选的话&#xff0c;能把同属性的元器件选中&#xff0c;其他器件颜色不变 注意了&#xff0c;如果这个时候&#xff…

初学phar反序列化

以下内容参考大佬博客&#xff1a;PHP Phar反序列化浅学习 - 跳跳糖 首先了解phar是什么东东 Phar是PHP的压缩文档&#xff0c;是PHP中类似于JAR的一种打包文件。它可以把多个文件存放至同一个文件中&#xff0c;无需解压&#xff0c;PHP就可以进行访问并执行内部语句。 默认开…

VuePress网站如何使用axios请求第三方接口

前言 VuePress是一个纯静态网站生成器,也就是它是无后端,纯前端的,那想要在VuePress中,发送ajax请求,请求一些第三方接口,有时想要达到自己一些目的 在VuePress中&#xff0c;使用axios请求第三方接口&#xff0c;需要先安装axios&#xff0c;然后引入&#xff0c;最后使用 本文…

爬虫框架Scrapy学习笔记-2

前言 Scrapy是一个功能强大的Python爬虫框架&#xff0c;它被广泛用于抓取和处理互联网上的数据。本文将介绍Scrapy框架的架构概览、工作流程、安装步骤以及一个示例爬虫的详细说明&#xff0c;旨在帮助初学者了解如何使用Scrapy来构建和运行自己的网络爬虫。 爬虫框架Scrapy学…

【Linux学习笔记】权限

1. 普通用户和root用户权限之间的切换2. 权限的三个w2.1. 什么是权限&#xff08;what&#xff09;2.1.1. 用户角色2.1.2. 文件属性 2.2. 怎么操作权限呢&#xff1f;&#xff08;how&#xff09;2.2.1. ugo-rwx方案2.2.2. 八进制方案2.2.3. 文件权限的初始模样2.2.4. 进入一个…

并发编程——synchronized

文章目录 原子性、有序性、可见性原子性有序性可见性 synchronized使用synchronized锁升级synchronized-ObjectMonitor 原子性、有序性、可见性 原子性 数据库事务的原子性&#xff1a;是一个最小的执行的单位&#xff0c;一次事务的多次操作要么都成功&#xff0c;要么都失败…

蓝桥杯 题库 简单 每日十题 day6

01 删除字符 题目描述 给定一个单词&#xff0c;请问在单词中删除t个字母后&#xff0c;能得到的字典序最小的单词是什么&#xff1f; 输入描述 输入的第一行包含一个单词&#xff0c;由大写英文字母组成。 第二行包含一个正整数t。 其中&#xff0c;单词长度不超过100&#x…

记录selenium和chrome使用socks代理打开网页以及查看selenium的版本

使用前&#xff0c;首先打开socks5全局代理。 之前我还写过一篇关于编程中使用到代理的情况&#xff1a; 记录一下python编程中需要使用代理的解决方法_python 使用全局代理_小小爬虾的博客-CSDN博客 在本文中&#xff0c;首先安装selenium和安装chrome浏览器。 参考我的文章…