关于TextView上标问题

五一假期结束了。新的一周开始了，继续奋斗！
吐槽一下前几天被人忽视了，心里小小的不爽了一下。算了，就不跟那些人一般见识了，阿Q精神还是要的。

开始今天的记录

已经上线运行的项目，突然加介绍人英文资料的时候，想要文字出现上角标，但是没有效果。想一想，简单吗？可以用富文本吗！说干就干，何止是上标，下标也一样可以加上。

span.setSpan(new SuperscriptSpan(), 31, 33, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);   //上标     
span.setSpan(new SubscriptSpan(), 33, 35, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);     //下标     
text.append(span);

so easy!
但是！！！
但是！！！
加入一段文字不知道在什么地方会需要上标呢？比如1^st。
参考：https://blog.csdn.net/zhangxiangliang2/article/details/73658011

首先是获取到需要上标的位置

当然是用到用到一个正则表达式：(?<=\b\d{1,10})(st|nd|rd|th)(?=\b)
这个正则表达式分为三个部分：
(?<=\b\d{1,10})
(st|nd|rd|th)
(?=\b)
第一部分是后行断言(lookbehind),用来匹配我们希望展示内容之前的指定模式。后行断言用?<=表示，后面跟着我们希望匹配的模式。

此处\b\d{1,10}要么匹配一个空格或者是一个字符串的开始(\b代表)；然后后面跟1到10的数字(\d{1,10}代表)。

在java中不可能用通配符匹配后行断言，因为假如编译器无法确定后行断言的最大长度正则编辑会失败，这就是我为什么在这里指定了一个范围，而不是使用\d+。

第二部分是我们真正要展示的内容。正如我们想要展示的序数后缀，我们使用(st|nd|rd|th)。

第三部分是先行断言(lookahead),用来匹配我们希望展示内容之后的指定模式。后行断言用?=表示，后面跟着我们希望匹配的模式。

此处\b要么匹配一个空格要么匹配一个字符串的结尾(\b代表)。

认真的你可能会想到一个问题，为什么我们不只用第二个部分就可以了呢?

因为这样我们会在“first”上匹配"st"成first,很明显这不是我们想要的。

正确使用先行断言与后行断言才能达到我们的目的，最后我们要匹配如下的模式：

st|nd|rd|th

其次是用富文本设置成上标

SuperscriptSpan superscript = new SuperscriptSpan();
RelativeSizeSpan size = new RelativeSizeSpan(PROPORTION);
stringBuilder.setSpan(superscript, start, end, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
stringBuilder.setSpan(size, start, end, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);

其中使用SuperscriptSpan来升高文字基准线，RelativeSizeSpan来改变TextView文字大小。

封装好的工具类

public class OrdinalSuperscriptFormatter {
    private static final String SUPERSCRIPT_REGEX = "(?<=\\b\\d{0,10})(st|nd|rd|th)(?=\\b)";
    private static final Pattern PATTERN = Pattern.compile(SUPERSCRIPT_REGEX);
    private static final float PROPORTION = 0.5f;
 
    private final SpannableStringBuilder stringBuilder;
 
    public OrdinalSuperscriptFormatter(@NonNull SpannableStringBuilder stringBuilder) {
        this.stringBuilder = stringBuilder;
    }
 //执行正则表达式的逻辑
    public void format(TextView textView) {
        CharSequence text = textView.getText();
        Matcher matcher = PATTERN.matcher(text);
        stringBuilder.clear();
        stringBuilder.append(text);
        while (matcher.find()) {
            int start = matcher.start();
            int end = matcher.end();
            createSuperscriptSpan(start, end);
        }
        textView.setText(stringBuilder);
    }
 
    private void createSuperscriptSpan(int start, int end) {
        SuperscriptSpan superscript = new SuperscriptSpan();
        RelativeSizeSpan size = new RelativeSizeSpan(PROPORTION);
        stringBuilder.setSpan(superscript, start, end, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
        stringBuilder.setSpan(size, start, end, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
    }
}

使用

 TextView textView = (TextView) findViewById(R.id.text_view);
 OrdinalSuperscriptFormatter formatter = new OrdinalSuperscriptFormatter(new SpannableStringBuilder());
 formatter.format(textView);

效果如下

上标图片效果图.png

附上TextView高级用法使用TextView实现更多效果

以上使用还是会出现一些问题，比如我就想显示1 th，不想弄成1 ^th，由于上边的断言种\b包含了空格，所以需要处理空格的问题。
所以最后修改为 \S(?<=\b\d{0,10})(st|nd|rd|th)(?=\b) 不过一般情况下不会出现这种情况，用上边的就ok了。