前言
就像朋友圈里面那樣的點擊查看全文效果,很有可能是在項目中也會遇到。這里給出不實用自定義控件的方法,原理很簡單,代碼量也不大,可以直接復制粘貼到自己的項目......
上代碼 ExpandText
上效果圖
看起來十分美好,但是往下看說明。
上說明
布局部分省略,就是一個線性布局里面兩個textview,一個顯示內容,一個顯示那個作文按鈕的提示。
思路是這樣:提前計算要顯示的文字內容,模擬一個相同的textview放到布局中,讓它只顯示一定的行數,這里為兩行,然后計算出這個兩行的高度,這就是真正TextView的一開始出現時需要被展開的高度。然后計算出完全顯示時需要多少高度,記錄這個值,最后展開的時候就能把內容完全展示出來了。
以下為獲取只顯示兩行時的高度代碼:
private int getShortHeight() {//虛擬一個tv來獲得理論高度值,短文高度
int width = mTextView.getMeasuredWidth();//寬度
TextView textView = new TextView(this);
textView.setText(R.string.str);
textView.setTextSize(TypedValue.COMPLEX_UNIT_SP, 16);
textView.setMaxLines(mMaxlines);
int measureSpecWidth = View.MeasureSpec.makeMeasureSpec(width, View.MeasureSpec.EXACTLY);//寬度match
int measureSpecHeight = View.MeasureSpec.makeMeasureSpec(1920, View.MeasureSpec.AT_MOST);//高度wrap,1920為最大高度
textView.measure(measureSpecWidth, measureSpecHeight);
return textView.getMeasuredHeight();
}
本來以為可以仿照出獲取完整文本的高度,理論上是去掉:textView.setMaxLines(mMaxlines);
就可以,但是,獲取到的一直是1920的具體值,這個地方我查了很多地方都說應該是自適應內容的高度,這里我表示需要大神?_?
但是問題還是得解決哇,換思路,能拿到最小的那個高度,自己設置了行數,所以每一行的高度我是知道的,所以我只需要知道文本完全顯示時需要占多少行就行了。
興高采烈的去getLineCount();
,表示得到餓結果為0,好吧,異步來一次:
mTextView.post(new Runnable() {
@Override
public void run() {
maxLine = mTextView.getLineCount();//獲取完全顯示餓行數
mLongHeight = getLongHeight();//獲取完全顯示需要的高度
Log.d("MainActivity", "長的" + mLongHeight + ",短的=" + mShortHeight);
if (mLongHeight <= mShortHeight) {
mTextViewToggle.setVisibility(View.GONE);//完全顯示需要的高度小于低的高度的時候,不需要展開
}
}
});
完整文本的高度總算是拿到了,其余細節不多說,然后就設置動畫了,代碼可以直接拷貝了:
private void toggle() {
ValueAnimator animator;
if (isOpen) {
animator = ValueAnimator.ofInt(mLongHeight, mShortHeight);
isOpen = false;
} else {
animator = ValueAnimator.ofInt(mShortHeight, mLongHeight);
isOpen = true;
}
animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
@Override
public void onAnimationUpdate(ValueAnimator valueAnimator) {
Integer value = (Integer) valueAnimator.getAnimatedValue();
mLayoutParams.height = value;
mTextView.setLayoutParams(mLayoutParams);
}
});
animator.addListener(new Animator.AnimatorListener() {
@Override
public void onAnimationStart(Animator animator) {
}
@Override
public void onAnimationEnd(Animator animator) {
if (isOpen) {
mTextViewToggle.setText("收起全文");
} else {
mTextViewToggle.setText("展開全文");
}
}
@Override
public void onAnimationCancel(Animator animator) {
}
@Override
public void onAnimationRepeat(Animator animator) {
}
});
animator.setDuration(500);
animator.start();
}
上代碼 ExpandText
最后
測量高度的時候直接填充了需要的內容,實際項目中這個內容應該也是能拿到然后替換的吧,這里問題不大。
沒有使用自定義控件的原因是覺得好像沒必要,所以就直接寫了,完整的代碼查看Demo,不過github上面還是有幾個不錯的類似自定義控件的,github關鍵詞ExpandTextView
,各位小伙伴酌情使用哇~
《UI篇》拓展閱讀:
《Android APP可能有的東西》之UI篇:加入購物車動畫
《Android APP可能有的東西》之UI篇:流式標簽&搜索歷史
《Android APP可能有的東西》之UI篇:日夜間模式切換
對了,效果圖里面的后文:
簡書地址:簡書主頁,專注技術類
轉載請注明出處,蟹蟹!
-------我的夢想真的是做一條咸魚!