Android TextView多文本折叠展开效果

这篇文章主要为大家详细介绍了Android TextView多文本折叠展开效果的相关资料,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

最近做项目,效果图要用到TextView的折叠,超过一定行数的时候,就会折叠起来,点击可以展开。网上找了一些效果,自己也稍作了修改。便拿来与网友分享分享。
参考文献:Android UI实现多行文本折叠展开效果

第一种:通过多个布局组合实现
大概步骤:
- 定义布局,垂直的线性LinearLayout布局、TextView和ImageView。 在layout中定义基本组件。
- 设置TextView的高度为指定行数*行高。 不使用maxLine的原因是maxLine会控制显示文本的行数,不方便后边使用动画展开全部内容。因此这里TextView的高度也因该为wrap_content。
- 给整个布局添加点击事件,绑定动画。 点击时,若TextView未展开则展开至其实际高度,imageView 旋转;否则回缩至 指定行数*行高 , imageView 旋转缩回。
布局文件:

     

核心代码:

 package com.example.my.textviewdemotest; import android.support.v7.app.AppCompatActivity; import android.os.Bundle; import android.view.View; import android.view.animation.Animation; import android.view.animation.RotateAnimation; import android.view.animation.Transformation; import android.widget.ImageView; import android.widget.TextView; public class MainActivity extends AppCompatActivity implements View.OnClickListener { TextView text1; ImageView mImageView1; TextView expandText; //TextMoreTextView text2; boolean isExpand;//是否已展开的状态 private int maxDescripLine = 3; //TextView默认最大展示行数 private int deltaValue;//默认高度,即前边由maxLine确定的高度 private int startValue;//起始高度 private int durationMillis = 350;//动画持续时间 @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); text1 = (TextView) findViewById(R.id.textView1); // text2= (TextMoreTextView) findViewById(R.id.text_textView); expandText = (TextView) findViewById(R.id.expand_text); mImageView1 = (ImageView) findViewById(R.id.expand_view1); mImageView1.setOnClickListener(this); text1.setText(getText(R.string.text)); //第二种可以在这里直接设置文字 // text2.setText(getText(R.string.text)); //这里大家可以根据实际情况来设置文字的高度,做个判断(可能会文字只有一行,也会占据maxDescripLine行) text1.setHeight(text1.getLineHeight() * maxDescripLine); text1.post(new Runnable() { @Override public void run() { mImageView1.setVisibility(text1.getLineCount() > maxDescripLine ? View.VISIBLE : View.GONE); expandText.setVisibility(text1.getLineCount() > maxDescripLine ? View.VISIBLE : View.GONE); } }); } @Override public void onClick(View v) { switch (v.getId()) { case R.id.expand_view1: zheDie(text1, mImageView1); break; } } private void zheDie(final TextView text, ImageView imageView) { isExpand = !isExpand; text.clearAnimation(); startValue = text.getHeight(); if (isExpand) { /** * 折叠动画 * 从实际高度缩回起始高度 */ deltaValue = text.getLineHeight() * text.getLineCount() - startValue; RotateAnimation animation = new RotateAnimation(0, 180, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f); animation.setDuration(durationMillis); animation.setFillAfter(true); imageView.startAnimation(animation); expandText.setText("收起"); } else { /** * 展开动画 * 从起始高度增长至实际高度 */ deltaValue = text.getLineHeight() * maxDescripLine - startValue; RotateAnimation animation = new RotateAnimation(180, 0, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f); animation.setDuration(durationMillis); animation.setFillAfter(true); imageView.startAnimation(animation); expandText.setText("更多"); } Animation animation = new Animation() { protected void applyTransformation(float interpolatedTime, Transformation t) { //根据ImageView旋转动画的百分比来显示textview高度,达到动画效果 text.setHeight((int) (startValue + deltaValue * interpolatedTime)); } }; animation.setDuration(durationMillis); text.startAnimation(animation); } } 

第二种方法,如果用的地方多可以省去很多冗余代码:具体步骤就不直接分析。
核心代码:

    
 package com.example.my.textviewdemotest; import android.content.Context; import android.content.res.TypedArray; import android.graphics.Color; import android.util.AttributeSet; import android.util.Log; import android.util.TypedValue; import android.view.Gravity; import android.view.View; import android.view.ViewTreeObserver; import android.view.animation.Animation; import android.view.animation.RotateAnimation; import android.view.animation.Transformation; import android.widget.ImageView; import android.widget.LinearLayout; import android.widget.TextView; public class TextMoreTextView extends LinearLayout { protected TextView contentView; protected ImageView expandView; protected int textColor; protected float textSize; protected int maxLine; protected String text; public int defaultTextColor = Color.BLACK;//默认文字颜色 public int defaultTextSize = 12; //默认文字大小 public int defaultLine = 3; //默认行数 public TextMoreTextView(Context context, AttributeSet attrs) { super(context, attrs); initalize(); initWithAttrs(context, attrs); // bindListener(); } protected void initWithAttrs(Context context, AttributeSet attrs) { TypedArray a = context.obtainStyledAttributes(attrs, R.styleable.MoreTextStyle); int textColor = a.getColor(R.styleable.MoreTextStyle_textColor, defaultTextColor); textSize = a.getDimensionPixelSize(R.styleable.MoreTextStyle_textSize, defaultTextSize); maxLine = a.getInt(R.styleable.MoreTextStyle_maxLine, defaultLine); text = a.getString(R.styleable.MoreTextStyle_text); bindTextView(textColor, textSize, maxLine, text); a.recycle(); } protected void initalize() { setOrientation(VERTICAL); setGravity(Gravity.RIGHT); contentView = new TextView(getContext()); addView(contentView, LayoutParams.MATCH_PARENT, LayoutParams.WRAP_CONTENT); expandView = new ImageView(getContext()); int padding = dip2px(getContext(), 5); expandView.setPadding(padding, padding, padding, padding); expandView.setImageResource(R.drawable.ic_expand_more_red_700_24dp); LayoutParams llp = new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT); addView(expandView, llp); } protected void bindTextView(int color, float size, final int line, String text) { contentView.setTextColor(color); contentView.setTextSize(TypedValue.COMPLEX_UNIT_PX, size); contentView.setText(text); ViewTreeObserver observer = contentView.getViewTreeObserver(); observer.addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() { //判断写在这个方法里面能拿到contentView.getLineCount(),否则返回时0; @Override public void onGlobalLayout() { ViewTreeObserver obs = contentView.getViewTreeObserver(); obs.removeGlobalOnLayoutListener(this); if (contentView.getLineCount()  line ? View.VISIBLE : View.GONE); //Log.e("aaa", "run: "+contentView.getLineCount() ); } }); } protected void bindListener() { setOnClickListener(new OnClickListener() { boolean isExpand; @Override public void onClick(View v) { isExpand = !isExpand; contentView.clearAnimation(); final int deltaValue; final int startValue = contentView.getHeight(); int durationMillis = 350; if (isExpand) { deltaValue = contentView.getLineHeight() * contentView.getLineCount() - startValue; RotateAnimation animation = new RotateAnimation(0, 180, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f); animation.setDuration(durationMillis); animation.setFillAfter(true); expandView.startAnimation(animation); } else { deltaValue = contentView.getLineHeight() * maxLine - startValue; RotateAnimation animation = new RotateAnimation(180, 0, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f); animation.setDuration(durationMillis); animation.setFillAfter(true); expandView.startAnimation(animation); } Animation animation = new Animation() { protected void applyTransformation(float interpolatedTime, Transformation t) { contentView.setHeight((int) (startValue + deltaValue * interpolatedTime)); } }; animation.setDuration(durationMillis); contentView.startAnimation(animation); } }); } public TextView getTextView() { return contentView; } public void setText(CharSequence charSequence) { contentView.setText(charSequence); } public static int dip2px(Context context, float dipValue) { final float scale = context.getResources().getDisplayMetrics().density; return (int) (dipValue * scale + 0.5f); } } 

这个类这样就写好了。调用直接在布局文件中引用就行了。

源码下载:http://xiazai.0133.cn/201610/yuanma/Androidtextview(0133.cn).rar

以上就是Android TextView多文本折叠展开效果的详细内容,更多请关注0133技术站其它相关文章!

赞(0) 打赏
未经允许不得转载:0133技术站首页 » 移动