autojs之酷炫字体效果

使用场景

一个textview中, 展示不同的字体效果

效果展示

autoj版本

原理

SpannableString.setSpan

字体效果全部使用该方法生成

安卓官方文档

https://developer.android.google.cn/reference/android/text/SpannableString?hl=en#setSpan(java.lang.Object,%20int,%20int,%20int)

效果列表

1. 字符用图片替换
2. 修改字符背景
3. 修改字符颜色
4. 文字添加点击事件
5. 文字超链接
   
   
6. 中划线
7. 下划线
8. 下标
9. 上标
10. 下标用图片代替
    
    
11. 字体相对大小
12. 字体绝对大小
13. 基于X轴缩放
14. 字体样式，粗体 BOLD、斜体 ITALIC等
15. 文本外貌 TextAppearanceSpan family值：monospace serif sans-serif
    
    
16. 文本对齐方式
17. 模糊BlurMaskFilter INNER
18. 模糊BlurMaskFilter NORMAL
19. 模糊BlurMaskFilter OUTER
20. 模糊BlurMaskFilter SOLID

代码讲解

1. 布局

   ui.layout(
     <vertical margin="20">
       <text id="content" textSize="30sp"></text>
     </vertical>
   );
   

2. 文字内容

   let spanStr = new SpannableString("...");
   

3. 修改字体(该步骤不是必须的, 可以忽略)

   tf = Typeface.createFromFile(java.io.File(files.path("./站酷高端黑.ttf")));
   ui.content.setTypeface(tf);
   

4. 处理后设置textview文字内容

   handleSpanStr(ui.content, spanStr);
   ui.content.setTextSize(random(20, 30));
   ui.content.setText(spanStr);
   

处理SpannableString

1. 插入图片

   bitmap = BitmapFactory.decodeResource(context.getResources(), icon);
   spanStr.setSpan(new IconMarginSpan(bitmap, 10), 0, 1, Spannable.SPAN_INCLUSIVE_INCLUSIVE);
   

2. 设置背景颜色

   spanStr.setSpan(new BackgroundColorSpan(Color.YELLOW), 0, 3, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
   

3. 设置字体颜色

   spanStr.setSpan(new ForegroundColorSpan(Color.RED), 3, 8, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
   

4. 设置点击事件

   spanStr.setSpan(
     new ClickableSpan({
       onClick: function (widget) {
         Toast.makeText(context, "你点击了我", Toast.LENGTH_SHORT).show();
       },
     }),
     8,
     12,
     Spannable.SPAN_EXCLUSIVE_EXCLUSIVE
   );
   view.setMovementMethod(LinkMovementMethod.getInstance());
   

5. 中划线

   spanStr.setSpan(new StrikethroughSpan(), 27, 29, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
   

6. 下划线

   spanStr.setSpan(new UnderlineSpan(), 29, 32, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
   

7. 绝对大小

   spanStr.setSpan(new AbsoluteSizeSpan(40), 33, 36, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
   

8. 相对大小

   spanStr.setSpan(new RelativeSizeSpan(2), 40, 43, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
   

9. 基于X轴缩放

   spanStr.setSpan(new ScaleXSpan(2), 43, 45, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
   

微信公众号 AutoJsPro教程

QQ群

747748653

完整源码

点击查看源码