Android前台界面之详解TextView内容任意长度的伸缩、显示与隐藏

一：学习内容目标：

TextView用法很多，用到的地方更是普遍，所以学好TextView的使用很重要很重要很重要。下面是这次我们要学习的了：

1、自动控制TextView内容长度的伸缩、显示与隐藏

2、响应对应控制图标的点击完成TextView的收缩、图标的切换

3、封装为工具，一键调用

二：代码详解

1.首先创建出我们需要用到的xml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent" 
    android:background="#ffffff"
    android:padding="10dp"
    >

    <RelativeLayout 
        android:id="@+id/rl_title"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        >
        <TextView 
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@string/title"
            android:textSize="18sp"
            />
        
        <ImageView 
            android:id="@+id/iv_arrow"
            android:layout_width="20dp"
            android:layout_height="20dp"
            android:layout_marginRight="10dp"
            android:src="@drawable/arrow_down"
            android:layout_alignParentRight="true"
            android:layout_centerVertical="true"
            />
    </RelativeLayout>
    
    <TextView 
        android:id="@+id/tv_info"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/rl_title"
        android:layout_marginTop="10dp"
        android:text="@string/info"
        android:textSize="15sp"
        />
</RelativeLayout>

这个界面很简单，主要就是一个TextView和一个控制TextView的ImageView

2.封装的工具类（重要）

/**
  * @FileName: StretchUtil.java
  * @Author CC
  * @Description:
  * @Date 2015年10月23日 下午2:32:15
  * @CopyRight CC Corporation
  */
package com.ccwxf.androiddemo;

import android.text.Editable;
import android.text.TextUtils.TruncateAt;
import android.text.TextWatcher;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.ViewTreeObserver.OnGlobalLayoutListener;
import android.widget.ImageView;
import android.widget.TextView;

public class StretchUtil{
    
    private int arrowUpId;
    private int arrowDownId;
    private TextView textView;
    private int lines;
    private ImageView arrowImage;
    
    private StretchUtil(TextView textView , int lines ,ImageView arrowImage , int arrowUpId ,int arrowDownId){
        this.textView = textView;
        this.lines = lines;
        this.arrowImage = arrowImage;
        this.arrowUpId = arrowUpId;
        this.arrowDownId = arrowDownId;
    }
    
    /**   
     * @Title: getInstance   
     * @Description:得到收缩工具的实例  
     * @param textView 要收缩的文本控件
     * @param lines 指定收缩的行数
     * @param arrowImage 控制收缩的箭头控件
     * @param arrowUpId 箭头向上的图标
     * @param arrowDownId 箭头向下的图标
     * @return StretchUtil 返回本类对象
    */
    public static StretchUtil getInstance(TextView textView , int lines ,ImageView arrowImage , int arrowUpId ,int arrowDownId){
         return new StretchUtil(textView ,lines ,arrowImage ,arrowUpId , arrowDownId);
    }

    /**   
     * @Title: initStretch   
     * @Description:初始化文本收缩 
    */
    public void initStretch(){
        //设置默认状态
        textView.getViewTreeObserver().addOnGlobalLayoutListener(new OnGlobalLayoutListener(){
            boolean flag = false;
            @Override
            public void onGlobalLayout(){
                if(!flag){
                    flag = true;
                    initStretchStatus();
                }
            }
        });
        //当文本内容改变时初始化状态
        textView.addTextChangedListener(new TextWatcher(){
            @Override
            public void onTextChanged(CharSequence s, int start, int before, int count){
                initStretchStatus();
            }
            @Override
            public void beforeTextChanged(CharSequence s, int start, int count, int after){}
            @Override
            public void afterTextChanged(Editable s){}
        });
        //当箭头点击时，改变状态
        arrowImage.setOnClickListener(new OnClickListener(){

            @Override
            public void onClick(View v){
                Object o = v.getTag();
                if(o != null){
                    int status = (Integer)o;
                    if(status == 0){
                        setStretch(1);
                    } else if(status == 1){
                        setStretch(0);
                    }
                }
            }
        });
    }
    
    /**   
     * @Title: initStretchStatus   
     * @Description:初始化文本的状态  
    */
    public void initStretchStatus(){
        if(isMoreLines()){
            //超过了两行
            setStretch(1);
        }else{
            setStretch(-1);
        }
    }
    
    /**   
     * @Title: isMoreLines   
     * @Description:判断文本的内容是否超过指定的行数  
     * @return boolean
    */
    public boolean isMoreLines(){
        float allTextPx = textView.getPaint().measureText(textView.getText().toString());
        float showViewPx = (textView.getWidth() - textView.getPaddingLeft() - textView.getPaddingRight()) * lines;
        return allTextPx > showViewPx;
    }
    
    /**   
     * @Title: setStretch   
     * @Description:设置箭头的显示状态与文本的伸缩状态  
     * @param status -1:不显示，0：向上箭头，1：向下箭头
    */
    public void setStretch(int status){
        if(status == -1){
            arrowImage.setVisibility(View.GONE);
        }else if(status == 0){
            arrowImage.setImageResource(arrowUpId);
            textView.setSingleLine(false);
            textView.setEllipsize(null);
        }else if(status == 1){
            arrowImage.setImageResource(arrowDownId);
            textView.setLines(lines);
            textView.setEllipsize(TruncateAt.END);
        }
        arrowImage.setTag(status);
    }
}

工具类是封装了所有操作的方法， 方便调用，主要代码都在这里

3.主Activity

package com.ccwxf.androiddemo;

import android.app.Activity;
import android.os.Bundle;
import android.widget.ImageView;
import android.widget.TextView;

public class MainActivity extends Activity {

    private TextView tv_info;
    private ImageView iv_arrow;

    @Override
    protected void onCreate(Bundle savedInstanceState){
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        
        initUI();
    }

    /**    
     * @Title: initUI   
     * @Description:TODO   void
    */
    private void initUI(){
        tv_info = (TextView)findViewById(R.id.tv_info);
        iv_arrow = (ImageView)findViewById(R.id.iv_arrow);
        StretchUtil.getInstance(tv_info, 3, iv_arrow, R.drawable.arrow_up, R.drawable.arrow_down).initStretch();
    }
}

调用工具类即可

三:效果图

1.收起状态下

2.点击ImageView，控制TextView收缩