android-自定义伸缩Textview

自定义伸缩TextView效果图如下：

test2.gif

伸缩效果的思路

1.设置初始的高度 2.设置展开的高度 3.伸缩的动画效果

创建R.layout.cookdetail_item_desc布局

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/framelayout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical">

    <TextView
        android:id="@+id/tv_content"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:lineSpacingMultiplier="1.1"
        android:text="内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容"
        android:textSize="@dimen/res_textsize_15sp"
        android:layout_marginBottom="18dp"
        />


    <ImageView
        android:id="@+id/detail_desc_folding_imageview"
        android:layout_width="18dp"
        android:layout_height="18dp"
        android:layout_gravity="bottom|center|right"
        android:background="@drawable/ic_public_arrow_down" />

</FrameLayout>

image.png

创建一个FoldingTextView 继承 LinearLayout 做一次初始化

public class FoldingTextView extends LinearLayout implements View.OnClickListener {

    private TextView tv_content;
    private ImageView folding_imageview;
 

    public FoldingTextView(Context context) {
        this(context, null);
    }

    public FoldingTextView(Context context, @Nullable AttributeSet attrs) {
        this(context, attrs, 0);
    }

    public FoldingTextView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        initView(context);
    }

    private void initView(Context context) {
        setOrientation(VERTICAL);
        View view = View.inflate(context, R.layout.cookdetail_item_desc, null);
        tv_content = view.findViewById(R.id.tv_content);
        folding_imageview = view.findViewById(R.id.detail_desc_folding_imageview);
        folding_imageview.setOnClickListener(this);
        addView(view);
    }

按照刚刚的思路第一步先设置开始的高度

 public int initHeight() {
        int measuredWidth = tv_content.getMeasuredWidth();
        TextView textView = new TextView(getContext());
        textView.setTextSize(TypedValue.COMPLEX_UNIT_DIP, 15);
        int width = MeasureSpec.makeMeasureSpec(measuredWidth, MeasureSpec.EXACTLY);
        textView.setMaxLines(3);
        textView.setLines(3);
        int height = MeasureSpec.makeMeasureSpec(2000, MeasureSpec.AT_MOST);
        textView.measure(width, height);
        return textView.getMeasuredHeight();
    }

通过new TextView，得到textView,设置setMaxLines(3)，setLines(3),
设置初始的高度,获取textview的高度要先通过测量textView.measure(width, height);才能获取textView.getMeasuredHeight()的值，不然为空

第二步设置伸开的高度

   public int maxHeight() {
        int measuredWidth = tv_content.getMeasuredWidth();
        int width = MeasureSpec.makeMeasureSpec(measuredWidth, MeasureSpec.EXACTLY);
        int height = MeasureSpec.makeMeasureSpec(2000, MeasureSpec.AT_MOST);
        tv_content.measure(width, height);
        return tv_content.getMeasuredHeight();
    }

为什么不使用tv_content，而要创建一个TextView来设置开始的高度？

如果使用tv_content设置开始的高度，设置的最大行数。到展开的时候也要再次设置一次setMaxline，还有一个可能伸缩的效果产生影响

第三步通过动画ValueAnimator来完成伸缩效果

 public void expand() {
        int startHeight = 0;
        int endHeight = 0;
        if (!isExpand) {
            startHeight = initHeight();
            endHeight = maxHeight();
            isExpand = true;
        } else {
            startHeight = maxHeight();
            endHeight = initHeight();
            isExpand = false;
        }

        final ViewGroup.LayoutParams params = tv_content.getLayoutParams();

        ValueAnimator animator = ValueAnimator.ofInt(startHeight, endHeight);
        animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
            @Override
            public void onAnimationUpdate(ValueAnimator animation) {
                int value = (int) animation.getAnimatedValue();
                params.height = value;
                tv_content.setLayoutParams(params);
            }
        });

        animator.addListener(new Animator.AnimatorListener() {
            @Override
            public void onAnimationStart(Animator animation) {

            }

            @Override
            public void onAnimationEnd(Animator animation) {
                if (isExpand) {
                    folding_imageview.setBackgroundResource(R.drawable.ic_public_arrow_up);
                } else {
                    folding_imageview.setBackgroundResource(R.drawable.ic_public_arrow_down);
                }
            }

            @Override
            public void onAnimationCancel(Animator animation) {

            }

            @Override
            public void onAnimationRepeat(Animator animation) {

            }
        });

        animator.setDuration(300);
        animator.start();

    }

完成，收工！！！

android-自定义伸缩Textview

自定义伸缩TextView效果图 如下：

自定义伸缩TextView效果图如下：