Android TextView 富文本實戰：SpannableString 實現多顏色、多字體大小混排

痛點：Html.fromHtml 失效

嘗試用 Html.fromHtml("<b>Bold</b><font color='red'>Red</font>") 發現：加粗生效，但顏色不變。原因：Android Html 類支持的標籤有限，<font>、color 屬性在部分版本不支持。

正解：SpannableString / SpannableStringBuilder

Spannable 是 Android 富文本的核心，通過 Span 對象對文本區間施加樣式（顏色、字體、大小、圖片、點擊事件等）。

基礎用法：分段設置顏色與字體大小

public static SpannableString buildStyledText(String label, String content, int labelColor, float labelSizeRatio) {
    String fullText = label + " " + content;
    SpannableString spannable = new SpannableString(fullText);
    
    // 設置 label 部分顏色
    spannable.setSpan(new ForegroundColorSpan(labelColor), 
                      0, label.length(), 
                      Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
    
    // 設置 label 部分字體縮放
    spannable.setSpan(new RelativeSizeSpan(labelSizeRatio), 
                      0, label.length(), 
                      Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
    
    // 可繼續添加：背景色、下劃線、點擊事件、圖片等
    // spannable.setSpan(new BackgroundColorSpan(Color.YELLOW), ...);
    // spannable.setSpan(new UnderlineSpan(), ...);
    // spannable.setSpan(new ClickableSpan() {...}, ...);
    // spannable.setSpan(new ImageSpan(drawable), ...);
    
    return spannable;
}

調用示例

TextView textView = findViewById(R.id.tv_chat);
SpannableString styled = buildStyledText("系統通知：", "您有新訊息", Color.RED, 1.2f);
textView.setText(styled);

// 追加模式（聊天列表常用）
SpannableStringBuilder builder = new SpannableStringBuilder();
builder.append(styled).append("\n");
textView.setText(builder);
textView.setMovementMethod(LinkMovementMethod.getInstance()); // 若含 ClickableSpan 必須設置

常用 Span 類型速查

進階：構建器模式封裝

public class SpannableBuilder {
    private final SpannableStringBuilder ssb = new SpannableStringBuilder();
    
    public SpannableBuilder append(String text) {
        ssb.append(text);
        return this;
    }
    
    public SpannableBuilder color(int color) {
        ssb.setSpan(new ForegroundColorSpan(color), 
                    ssb.length() - lastTextLength, ssb.length(), 
                    Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
        return this;
    }
    // ... 其他樣式鏈式調用
    
    public CharSequence build() { return ssb; }
}

// 使用
textView.setText(new SpannableBuilder()
    .append("錯誤：").color(Color.RED).bold()
    .append("網絡連接失敗").color(Color.GRAY)
    .build());

性能提示

• 頻繁更新（如聊天列表滾動）時，複用 SpannableStringBuilder，避免重複創建對象。
• 大量 Span 時，考慮 TextLayoutHelper 或改用 RecyclerView + 多類型 Item 佈局。
• 設置 textView.setText(spannable, TextView.BufferType.SPANNABLE) 確保可編輯/可點擊。

總結

放棄 Html.fromHtml，擁抱 SpannableString：功能更強、性能更好、API 更靈活，是 Android 富文本開發的標準方式。