TextView 的世界絢爛多彩

小二陽發表於2018-01-26

1.png
2.png

比如 這樣的文字效果,實現這樣的效果我們先來了解一下SpannableString SpannableString 和 String 一樣,都是一種字串型別,同樣 TextView 也可以直接設定 SpannableString 作為顯示文字,不同的是 SpannableString 可以通過使用其方法setSpan 方法實現字串各種形式風格的顯示,重要的是可以指定設定的區間,也就是為字串指定下標區間內的子字串設定格式。

setSpan(Object what, int start, int end, int flags)方法需要使用者輸入四個引數, “what” :表示設定的格式是什麼,可以是前景色、背景色也可以是可點選的文字等等, “start”:表示需要設定格式的子字串的起始下標 “end”:表示終了下標 “flags”:屬性就有意思了,共有四種屬性:

//從起始下標到終了下標,包括起始下標
Spanned.SPAN_INCLUSIVE_EXCLUSIVE  
// 從起始下標到終了下標,同時包括起始下標和終了下標
Spanned.SPAN_INCLUSIVE_INCLUSIVE 
//從起始下標到終了下標,但都不包括起始下標和終了下標
Spanned.SPAN_EXCLUSIVE_EXCLUSIVE  
//從起始下標到終了下標,包括終了下標
Spanned.SPAN_EXCLUSIVE_INCLUSIVE  
複製程式碼

關鍵方法:setSpan()

支援設定的字型格式(繼承 CharacterSty 均可):

字型顏色-------ForegroundColorSpan 字型大小-------AbsoluteSizeSpan 背景顏色-------BackgroundColorSpan 超連結----------URLSpan 粗體、斜體----StyleSpan 刪除線----------StrikethroughSpan 下劃線----------UnderlineSpan 圖片-------------ImageSpan

SpannableString spannableString06 = new SpannableString("點選淡藍色背景文字跳轉頁面");
ClickableSpan clickableSpan = new MyClickableSpan("123456789");
ForegroundColorSpan colorSpan04 = new ForegroundColorSpan(Color.parseColor("#FFFFFF"));
BackgroundColorSpan backgroundColorSpan = new BackgroundColorSpan(Color.parseColor("#0099EE"));
spannableString06.setSpan(colorSpan04, 2, 9, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
spannableString06.setSpan(clickableSpan, 2, 9, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
spannableString06.setSpan(backgroundColorSpan, 2, 9, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
textView06.setText(spannableString06);
textView06.setMovementMethod(LinkMovementMethod.getInstance());
複製程式碼
 SpannableString spannableString07 = new SpannableString("22 + 32 = 13");
        SuperscriptSpan superscriptSpan01 = new SuperscriptSpan();
        SuperscriptSpan superscriptSpan02 = new SuperscriptSpan();
        spannableString07.setSpan(superscriptSpan01, 1, 2 ,Spanned.SPAN_INCLUSIVE_EXCLUSIVE);
        spannableString07.setSpan(superscriptSpan02, 6, 7 ,Spanned.SPAN_INCLUSIVE_EXCLUSIVE);
        RelativeSizeSpan sizeSpan05 = new RelativeSizeSpan(0.5f);
        RelativeSizeSpan sizeSpan06 = new RelativeSizeSpan(0.5f);
        spannableString07.setSpan(sizeSpan05, 1, 2 ,Spanned.SPAN_INCLUSIVE_EXCLUSIVE);
        spannableString07.setSpan(sizeSpan06, 6, 7 ,Spanned.SPAN_INCLUSIVE_EXCLUSIVE);

        textView07.setText(spannableString07);
複製程式碼
SpannableString spannableString03 = new SpannableString("499");

        ForegroundColorSpan colorSpan03 = new ForegroundColorSpan(Color.parseColor("#EE0000"));
        spannableString03.setSpan(colorSpan03, 0, spannableString03.length(), Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);

        RelativeSizeSpan sizeSpan03 = new RelativeSizeSpan(1.2f);
        spannableString03.setSpan(sizeSpan03, 1, spannableString03.length(), Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);

        StyleSpan styleSpan03 = new StyleSpan(Typeface.BOLD);
        spannableString03.setSpan(styleSpan03, 1, spannableString03.length(), Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);

        textView03.setText(spannableString03);

        SpannableString spannableString04 = new SpannableString("700");
        StrikethroughSpan strikethroughSpan = new StrikethroughSpan();
        spannableString04.setSpan(strikethroughSpan, 0, spannableString04.length(), Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);

        textView04.setText(spannableString04);
複製程式碼
 private int position = 0;
 Handler handler = new Handler() {

        @Override
        public void handleMessage(Message msg) {
            super.handleMessage(msg);
            switch (msg.what) {
                case 0x158:
                    SpannableString spannableString = new SpannableString(string);

                    RelativeSizeSpan sizeSpan = new RelativeSizeSpan(1.2f);
                    spannableString.setSpan(sizeSpan, position, position + 1, Spanned.SPAN_INCLUSIVE_EXCLUSIVE);
                    textView05.setText(spannableString);
                    position++;
                    if(position >= textView05.getText().toString().length()) {
                        position = 0;
                    }
                    handler.sendEmptyMessageDelayed(0x158, 150);
                    break;
            }
        }
    };
複製程式碼
SpannableString spannableString01 = new SpannableString("共累計完成簽到24次");

        ForegroundColorSpan colorSpan01 = new ForegroundColorSpan(Color.parseColor("#0099FF"));
        spannableString01.setSpan(colorSpan01, 7, spannableString01.length() - 1, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);

        RelativeSizeSpan sizeSpan01 = new RelativeSizeSpan(1.3f);
        spannableString01.setSpan(sizeSpan01, 7, spannableString01.length() - 1, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);

        StyleSpan styleSpan01 = new StyleSpan(Typeface.BOLD);
        spannableString01.setSpan(styleSpan01, 7, spannableString01.length() - 1, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);

        textView01.setText(spannableString01);
複製程式碼

1.png

SpannableString spannableString = new SpannableString("萬丈高樓平地起");

RelativeSizeSpan sizeSpan01 = new RelativeSizeSpan(1.2f);
RelativeSizeSpan sizeSpan02 = new RelativeSizeSpan(1.4f);
RelativeSizeSpan sizeSpan03 = new RelativeSizeSpan(1.6f);
RelativeSizeSpan sizeSpan04 = new RelativeSizeSpan(1.8f);
RelativeSizeSpan sizeSpan05 = new RelativeSizeSpan(1.6f);
RelativeSizeSpan sizeSpan06 = new RelativeSizeSpan(1.4f);
RelativeSizeSpan sizeSpan07 = new RelativeSizeSpan(1.2f);

spannableString.setSpan(sizeSpan01, 0, 1, Spanned.SPAN_INCLUSIVE_EXCLUSIVE);
spannableString.setSpan(sizeSpan02, 1, 2, Spanned.SPAN_INCLUSIVE_EXCLUSIVE);
spannableString.setSpan(sizeSpan03, 2, 3, Spanned.SPAN_INCLUSIVE_EXCLUSIVE);
spannableString.setSpan(sizeSpan04, 3, 4, Spanned.SPAN_INCLUSIVE_EXCLUSIVE);
spannableString.setSpan(sizeSpan05, 4, 5, Spanned.SPAN_INCLUSIVE_EXCLUSIVE);
spannableString.setSpan(sizeSpan06, 5, 6, Spanned.SPAN_INCLUSIVE_EXCLUSIVE);
spannableString.setSpan(sizeSpan07, 6, 7, Spanned.SPAN_INCLUSIVE_EXCLUSIVE);
textView.setText(spannableString);
複製程式碼

2.png

SpannableString spannableString = new SpannableString("為文字設定刪除線");
StrikethroughSpan strikethroughSpan = new StrikethroughSpan();
spannableString.setSpan(strikethroughSpan, 5, spannableString.length(), Spanned.SPAN_INCLUSIVE_EXCLUSIVE);
textView.setText(spannableString);
複製程式碼

3.png

SpannableString spannableString = new SpannableString("為文字設定下劃線");
UnderlineSpan underlineSpan = new UnderlineSpan();
spannableString.setSpan(underlineSpan, 5, spannableString.length(), Spanned.SPAN_INCLUSIVE_EXCLUSIVE);
textView.setText(spannableString);
複製程式碼

4.png

SpannableString spannableString = new SpannableString("為文字設定上標");
SuperscriptSpan superscriptSpan = new SuperscriptSpan();
spannableString.setSpan(superscriptSpan, 5, spannableString.length(), Spanned.SPAN_INCLUSIVE_EXCLUSIVE);
textView.setText(spannableString);
複製程式碼

5.png

SpannableString spannableString = new SpannableString("為文字設定下標");
SubscriptSpan subscriptSpan = new SubscriptSpan();
spannableString.setSpan(subscriptSpan, 5, spannableString.length(), Spanned.SPAN_INCLUSIVE_EXCLUSIVE);
textView.setText(spannableString);
複製程式碼

6.png

SpannableString spannableString = new SpannableString("為文字設定粗體、斜體風格");
StyleSpan styleSpan_B  = new StyleSpan(Typeface.BOLD);
StyleSpan styleSpan_I  = new StyleSpan(Typeface.ITALIC);
spannableString.setSpan(styleSpan_B, 5, 7, Spanned.SPAN_INCLUSIVE_EXCLUSIVE);
spannableString.setSpan(styleSpan_I, 8, 10, Spanned.SPAN_INCLUSIVE_EXCLUSIVE);
textView.setHighlightColor(Color.parseColor("#36969696"));
textView.setText(spannableString);
複製程式碼

7.png

SpannableString spannableString = new SpannableString("在文字中新增表情(表情)");
Drawable drawable = getResources().getDrawable(R.mipmap.a9c);
drawable.setBounds(0, 0, 42, 42);
ImageSpan imageSpan = new ImageSpan(drawable);
spannableString.setSpan(imageSpan, 6, 8, Spanned.SPAN_INCLUSIVE_EXCLUSIVE);
textView.setText(spannableString);
複製程式碼

1、BackgroundColorSpan 背景色

2、ClickableSpan 文字可點選,有點選事件

3、ForegroundColorSpan 文字顏色(前景色)

4、MaskFilterSpan 修飾效果,如模糊(BlurMaskFilter)、浮雕(EmbossMaskFilter)

5、MetricAffectingSpan 父類,一般不用

6、RasterizerSpan 光柵效果

7、StrikethroughSpan 刪除線(中劃線)

8、SuggestionSpan 相當於佔位符

9、UnderlineSpan 下劃線

10、AbsoluteSizeSpan 絕對大小(文字字型)

11、DynamicDrawableSpan 設定圖片,基於文字基線或底部對齊。

12、ImageSpan 圖片

13、RelativeSizeSpan 相對大小(文字字型)

14、ReplacementSpan 父類,一般不用

15、ScaleXSpan 基於x軸縮放

16、StyleSpan 字型樣式:粗體、斜體等

17、SubscriptSpan 下標(數學公式會用到)

18、SuperscriptSpan 上標(數學公式會用到)

19、TextAppearanceSpan 文字外貌(包括字型、大小、樣式和顏色)

20、TypefaceSpan 文字字型

21、URLSpan 文字超連結

PS:不是原創,學習別人的,某書作者就不談了,只是為了大學更好的學習!謝謝

相關文章