前言
就像朋友圈里面那样的点击查看全文效果,很有可能是在项目中也会遇到。这里给出不实用自定义控件的方法,原理很简单,代码量也不大,可以直接复制粘贴到自己的项目......
上代码 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篇:日夜间模式切换
对了,效果图里面的后文:
简书地址:简书主页,专注技术类
转载请注明出处,蟹蟹!
-------我的梦想真的是做一条咸鱼!