UI之可摺疊的TextView

先上效果

1、思路

1. 計算text的行數

實現可摺疊的TextView最重要的一點是在setText()前計算出text所需的行數
計算行數須要分爲兩種狀況

1.1 沒有換行符的text

行數等於text的寬度除於TextView的寬度
    再判斷text的寬度對TextView的寬度取餘是否爲0，若是不等於0則加1
    lines = textWidth / TextViewWidth + textWidth % TextViewWidth == 0 ? 0 : 1複製代碼

1.2 含有換行符的text

1. 先用換行符拆分 
    2. 對於拆分後的文本
        若是不爲空，則而後再按照沒有換行符的方式計算   
        若是爲空，則行數爲1
    3. 累加全部的拆分文本行數複製代碼

2. 截取text

計算出text的行數以後，須要對text進行截取，截取到text能在指定的行數內顯示完的位置，

1. 首先用換行符對text進行拆分，將text分爲若干段落
2. 對拆分後的文本段落循環計算行數累加，並累加字符數
3. 累加的行數小於指定行數，繼續循環，直到累加的行數大於指定行數或循環完成；若是在循環完成以前累加的行數大於指定行數，則截取該次循環的段落

4. 調用TextUtils的ellipsize()方法對指定的段落進行截取，ellipsize()方法中的avail參數，傳入剩餘的可顯示寬度

   由於在文本的最後要拼接上「...提示文本」，因此可顯寬度的計算方式以下：

   TextViewWidth * (指定行數 - 累加行數) - (... + 提示文本)Width複製代碼

   1. 把截取後的文本設置給TextView

2、實現

實現可摺疊的TextView須要繼承TextView並重寫setText(CharSequence text, BufferType type)方法

由於setText(CharSequence text)方法是final的，而且setText(CharSequence text)最終調用的也是setText(CharSequence text, BufferType type)方法，因此重寫後者便可。

核心代碼

/** * 末尾省略號 */
private static final String ELLIPSE = "...";
/** * 默認的摺疊行數 */
public static final int COLLAPSED_LINES = 4;
/** * 摺疊時的默認文本 */
private static final String EXPANDED_TEXT = "展開全文";
/** * 展開時的默認文本 */
private static final String COLLAPSED_TEXT = "收起全文";
/** * 在文本末尾 */
public static final int END = 0;
/** * 在文本下方 */
public static final int BOTTOM = 1;
/** * 提示文字展現的位置 */
@IntDef({END, BOTTOM})
@Retention(RetentionPolicy.SOURCE)
public @interface TipsGravityMode {}
/** * 摺疊的行數 */
private int mCollapsedLines;
/** * 摺疊時的文本 */
private String mExpandedText;
/** * 展開時的文本 */
private String mCollapsedText;
/** * 摺疊時的圖片資源 */
private Drawable mExpandedDrawabl
/** * 展開時的圖片資源 */
private Drawable mCollapsedDrawab
/** * 原始的文本 */
private CharSequence mOriginalTex
/** * TextView中文字可顯示的寬度 */
private int mShowWidth;
/** * 是不是展開的 */
private boolean mIsExpanded;
/** * 提示文字位置 */
private int mTipsGravity;
/** * 提示文字顏色 */
private int mTipsColor;
/** * 提示文字是否顯示下劃線 */
private boolean mTipsUnderline;
/** * 提示是否可點擊 */
private boolean mTipsClickable;

... 

@Override
public void setText(CharSequence text, final BufferType type) {
    // 若是text爲空或mCollapsedLines爲0則直接顯示
    if (TextUtils.isEmpty(text) || mCollapsedLines == 0) {
        super.setText(text, type);
    } else if (mIsExpanded) {
        // 保存原始文本，去掉文本末尾的空字符
        this.mOriginalText = CharUtil.trimFrom(text);
        formatExpandedText(type);
    } else {
        // 保存原始文本，去掉文本末尾的空字符
        this.mOriginalText = CharUtil.trimFrom(text);
        // 獲取TextView中文字顯示的寬度，須要在layout以後才能獲取到，避免在列表中重複獲取
        if (mCollapsedLines > 0 && mShowWidth == 0) {
            getViewTreeObserver().addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
                @Override
                public void onGlobalLayout() {
                    getViewTreeObserver().removeOnGlobalLayoutListener(this);
                    mShowWidth = getWidth() - getPaddingLeft() - getPaddingRight();
                    formatCollapsedText(type);
                }
            });
        } else {
            formatCollapsedText(type);
        }
    }
}

/** * 格式化摺疊時的文本 * * @param type ref android.R.styleable#TextView_bufferType */
private void formatCollapsedText(BufferType type) {
    // 將原始文本按換行符拆分紅段落
    String[] paragraphs = mOriginalText.toString().split("\\n");
    // 獲取paint，用於計算文字寬度
    TextPaint paint = getPaint();
    // 文字寬度
    float textWidth;
    // 字符數，用於最後截取字符串
    int charCount = 0;
    // 剩餘行數
    int lastLines = mCollapsedLines;
    for (int i = 0; i < paragraphs.length; i++) {
        // 每一個段落
        String paragraph = paragraphs[i];
        // 每一個段落文本的寬度
        textWidth = paint.measureText(paragraph);
        // 計算每段的行數
        int paragraphLines = (int) (textWidth / mShowWidth);
        // 若是該段爲空（表示空行）或還有餘，多加一行
        if (TextUtils.isEmpty(paragraph) || textWidth % mShowWidth != 0) {
            paragraphLines++;
        }
        if (paragraphLines < lastLines) {
            // 若是該段落行數小於等於剩餘的行數，則減小lastLines，並增長字符數
            // 這裏只計算字符數，並不拼接字符
            charCount += paragraph.length() + 1;
            lastLines -= paragraphLines;
            if (i == paragraphs.length - 1) {
                super.setText(mOriginalText, type);
                break;
            }
        } else if (paragraphLines == lastLines && i == paragraphs.length - 1) {
            // 若是該段落行數等於剩餘行數，而且是最後一個段落，表示恰好可以顯示徹底
            super.setText(mOriginalText, type);
            break;
        } else {
            // 若是該段落的行數大於等於剩餘的行數，則格式化文本
            // 因設置的文本多是帶有樣式的文本，如SpannableStringBuilder，因此根據計算的字符數從原始文本中截取
            SpannableStringBuilder spannable = new SpannableStringBuilder(mOriginalText, 0, charCount);
            // 計算後綴的寬度，因樣式的問題對後綴的寬度乘2
            int expandedTextWidth = 2 * (int) (paint.measureText(ELLIPSE + mExpandedText));
            // 獲取最後一段的文本，仍是由於原始文本的樣式緣由不能直接使用paragraphs中的文本
            CharSequence lastParagraph = mOriginalText.subSequence(charCount, charCount + paragraph.length());
            // 對最後一段文本進行截取
            CharSequence ellipsizeText = TextUtils.ellipsize(lastParagraph, paint,
                    mShowWidth * lastLines - expandedTextWidth, TextUtils.TruncateAt.END);
            spannable.append(ellipsizeText);
            // 若是lastParagraph == ellipsizeText表示最後一段文本在可顯示範圍內，此時須要手動加上"..."
            // 若是lastParagraph != ellipsizeText表示進行了截取TextUtils.ellipsize()方法會自動加上"..."
            if (lastParagraph == ellipsizeText) {
                spannable.append(ELLIPSE);
            }
            // 設置樣式
            setSpan(spannable);
            // 使點擊有效
            setMovementMethod(LinkMovementMethod.getInstance());
            super.setText(spannable, type);
            break;
        }
    }
}

/** * 格式化展開式的文本，直接在後面拼接便可 * * @param type */
private void formatExpandedText(BufferType type) {
    SpannableStringBuilder spannable = new SpannableStringBuilder(mOriginalText);
    setSpan(spannable);
    super.setText(spannable, type);
}

/** * 設置提示的樣式 * * @param spannable 需修改樣式的文本 */
private void setSpan(SpannableStringBuilder spannable) {
    Drawable drawable;
    // 根據提示文本須要展現的文字拼接不一樣的字符
    if (mTipsGravity == END) {
        spannable.append(" ");
    } else {
        spannable.append("\n");
    }
    int tipsLen;
    // 判斷是展開仍是收起
    if (mIsExpanded) {
        spannable.append(mCollapsedText);
        drawable = mCollapsedDrawable;
        tipsLen = mCollapsedText.length();
    } else {
        spannable.append(mExpandedText);
        drawable = mExpandedDrawable;
        tipsLen = mExpandedText.length();
    }
    // 設置點擊事件
    spannable.setSpan(new ExpandedClickableSpan(), spannable.length() - tipsLen,
            spannable.length(), Spanned.SPAN_INCLUSIVE_EXCLUSIVE);
    // 若是提示的圖片資源不爲空，則使用圖片代替提示文本
    if (drawable != null) {
        spannable.setSpan(new ImageSpan(drawable, ImageSpan.ALIGN_BASELINE),
                spannable.length() - tipsLen, spannable.length(), Spanned.SPAN_INCLUSIVE_EXCLUSIVE);
    }
}

/** * 提示的點擊事件 */
private class ExpandedClickableSpan extends ClickableSpan {
    @Override
    public void onClick(View widget) {
        // 是否可點擊
        if (mTipsClickable) {
            mIsExpanded = !mIsExpanded;
            setText(mOriginalText);
        }
    }
    @Override
    public void updateDrawState(TextPaint ds) {
        // 設置提示文本的顏色和是否須要下劃線
        ds.setColor(mTipsColor == 0 ? ds.linkColor : mTipsColor);
        ds.setUnderlineText(mTipsUnderline);
    }
}複製代碼

由於用戶設置給TextView的文本多是含有樣式的文本，即實現了Spannable接口的文本，因此在拆分並拼接文本的時候不能直接使用拆分後的字符串，會丟失原有樣式，須要從新在原始文本中截取

能夠從這裏獲取代碼