在一些应用中,比如腾讯的应用市场APP应用宝,关于某款应用的介绍文字,如果介绍文字过长,那么不是全部展现出来,而是显示三四行的开始部分(摘要),预知全部的内容,用户点击展开按钮即可查阅全部内容。
这样的设计有一定的优越性,毕竟用户的时间有限,注意力和关注力也有限,在使用APP时候,用户需要在最短时间内尽可能快速浏览和查阅到更主要内容,而不是一大堆泛泛而谈的文字内容。
在Android原生的TextView的基础上,可收缩/扩展的TextView:PhilExpandableTextView。
实现原理:核心是控制TextView的max lines。在TextView的初始化阶段但尚未绘制出View的时候,使用ViewTreeObserver,监听onPreDraw事件,获取TextView正常显示需要显示的总行数,但只给TextView设置最大运行的行数(小于总行数),从而造成TextView的收缩摘要效果,当用户通过按钮或其他方式扩展时候,把TextView的最大行数设置为正常显示完全的行数+1(+1是保持余量,避免不足)。
1 package com.lixu.ExpandableTextView; 2 3 import android.app.Activity; 4 import android.os.Bundle; 5 import android.view.View; 6 import android.view.View.OnClickListener; 7 import android.widget.Button; 8 9 public class MainActivity extends Activity {10 private String str = "";11 12 @Override13 protected void onCreate(Bundle savedInstanceState) {14 super.onCreate(savedInstanceState);15 setContentView(R.layout.activity_main);16 17 for (int i = 0; i < 200; i++) {18 str = str + i + " ";19 }20 final ExpandableTextView etv = (ExpandableTextView) findViewById(R.id.etv);21 etv.setText(str);22 23 Button btn = (Button) findViewById(R.id.btn);24 25 btn.setOnClickListener(new OnClickListener() {26 27 @Override28 public void onClick(View v) {29 boolean b = etv.getExpandablestatus();30 31 b = !b;32 etv.setExpandable(b);33 34 }35 });36 37 }38 39 }
PhilExpandableTextView.java:
1 package com.lixu.ExpandableTextView; 2 3 import android.content.Context; 4 import android.util.AttributeSet; 5 import android.view.ViewTreeObserver; 6 import android.view.ViewTreeObserver.OnPreDrawListener; 7 import android.widget.TextView; 8 import android.widget.Toast; 9 10 public class ExpandableTextView extends TextView {11 12 // 最大行,默认显示3行13 private final int MAX = 3;14 // 完全展开需要的行数15 private int lines;16 17 private ExpandableTextView mExpandableTextView;18 19 private boolean expandablestatus = false;20 21 // 构造方法用两个参数的22 public ExpandableTextView(Context context, AttributeSet attrs) {23 super(context, attrs);24 mExpandableTextView = this;25 init();26 27 }28 29 private void init() {30 // 在view绘制之前的时候执行,在onDraw之前31 ViewTreeObserver mViewTreeObserver = this.getViewTreeObserver();32 mViewTreeObserver.addOnPreDrawListener(new OnPreDrawListener() {33 34 @Override35 public boolean onPreDraw() {36 // 避免重复监听37 mExpandableTextView.getViewTreeObserver().removeOnPreDrawListener(this);38 // 获得内容行数39 lines = getLineCount();40 41 return true;42 }43 });44 setExpandable(false);45 46 }47 // 是否展开或者收缩,48 // true,展开;49 // false,不展开50 51 public void setExpandable(boolean isExpand) {52 if (isExpand) {53 setMaxLines(lines + 1);54 } else55 setMaxLines(MAX);56 57 expandablestatus = isExpand;58 }59 60 public boolean getExpandablestatus() {61 return expandablestatus;62 }63 64 }
1 <RelativeLayout ="http://schemas.android.com/apk/res/android" 2 ="http://schemas.android.com/tools" 3 android:layout_width="match_parent" 4 android:layout_height="match_parent" > 5 6 <com.lixu.ExpandableTextView.ExpandableTextView 7 android:id="@+id/etv" 8 android:layout_width="match_parent" 9 android:layout_height="wrap_content"10 android:layout_alignParentTop="true" />11 12 <Button13 android:id="@+id/btn"14 android:layout_width="wrap_content"15 android:layout_height="wrap_content"16 android:layout_alignParentBottom="true"17 android:layout_centerHorizontal="true"18 android:text="点击" />19 20 </RelativeLayout>
运行效果图:
images/loading.gif' data-original="http://images2015.cnblogs.com/blog/823611/201511/823611-20151130141112218-1765993894.gif" />
原标题:可伸缩的textview。
关键词:ie