点击listview的item，带动画效果的展开详情（二）

最新推荐文章于 2022-04-15 14:39:08 发布

夜尽天明89

最新推荐文章于 2022-04-15 14:39:08 发布

阅读量1.9k

点赞数 2

分类专栏： Android笔记

本文链接：https://blog.csdn.net/u014620028/article/details/53158777

版权

Android笔记专栏收录该内容

133 篇文章 1 订阅

订阅专栏

在上一篇的基础上进了修改
优点：点击item，出现其他内容的动画流畅，没有卡顿
缺点：需要知道，最多有多少条。（例如：一个人，有名字和技能属性。他最多有3个技能。这种情况）
效果图：
这里写图片描述

—————————分割线—————————————–
这里写图片描述

代码：
1、ListItem

public class ListItem {

    //名字
    String name;
    //技能1
    String skill_1;
    //技能2
    String skill_2;
    //技能3
    String skill_3;

    public ListItem(String name, String skill_1, String skill_2, String skill_3) {
        this.name = name;
        this.skill_1 = skill_1;
        this.skill_2 = skill_2;
        this.skill_3 = skill_3;
    }

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    public String getSkill_1() {
        return skill_1;
    }

    public void setSkill_1(String skill_1) {
        this.skill_1 = skill_1;
    }

    public String getSkill_2() {
        return skill_2;
    }

    public void setSkill_2(String skill_2) {
        this.skill_2 = skill_2;
    }

    public String getSkill_3() {
        return skill_3;
    }

    public void setSkill_3(String skill_3) {
        this.skill_3 = skill_3;
    }
}

2、ViewExpandAnimation

import android.view.View;
import android.view.animation.Animation;
import android.view.animation.Transformation;
import android.widget.LinearLayout.LayoutParams;

public class ViewExpandAnimation extends Animation {

    private View mAnimationView = null;
    private LayoutParams mViewLayoutParams = null;
    private int mStart = 0;
    private int mEnd = 0;

    public ViewExpandAnimation(View view) {
        animationSettings(view, 200);
    }

    public ViewExpandAnimation(View view, int duration) {
        animationSettings(view, duration);
    }

    private void animationSettings(View view, int duration) {
        setDuration(duration);
        mAnimationView = view;
        mViewLayoutParams = (LayoutParams) view.getLayoutParams();
        mStart = mViewLayoutParams.bottomMargin;
        mEnd = (mStart == 0 ? (0 - view.getHeight()) : 0);
        view.setVisibility(View.VISIBLE);
    }

    @Override
    protected void applyTransformation(float interpolatedTime, Transformation t) {
        super.applyTransformation(interpolatedTime, t);

        if (interpolatedTime < 1.0f) {
            mViewLayoutParams.bottomMargin = mStart + (int) ((mEnd - mStart) * interpolatedTime);
            // invalidate
            mAnimationView.requestLayout();
        } else {
            mViewLayoutParams.bottomMargin = mEnd;
            mAnimationView.requestLayout();
            if (mEnd != 0) {
                mAnimationView.setVisibility(View.GONE);
            }
        }
    }

}

3、布局
3.1、activity_list_view

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:paddingBottom="@dimen/activity_vertical_margin"
                android:paddingLeft="@dimen/activity_horizontal_margin"
                android:paddingRight="@dimen/activity_horizontal_margin"
                android:paddingTop="@dimen/activity_vertical_margin"
    >

    <TextView
        android:id="@+id/tip_tv"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:padding="5dp"
        android:text="10-13有2个技能，15及以后没有技能，其他事3个技能"
        android:textSize="15sp"
        />

    <View
        android:id="@+id/line"
        android:layout_width="match_parent"
        android:layout_height="2dp"
        android:layout_below="@id/tip_tv"
        android:background="#00dddd"/>

    <ListView
        android:id="@+id/list_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/line"
        />

</RelativeLayout>

3.2、group_item

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical">

    <TextView
        android:id="@+id/name"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:padding="10dp"
        android:textSize="30sp"
        />

    <LinearLayout
        android:id="@+id/children_ll"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="#ffffff"
        android:orientation="vertical"
        >

        <TextView
            android:id="@+id/skill_1_tv"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:padding="5dp"
            android:text="123"
            android:textSize="25sp"/>

        <TextView
            android:id="@+id/skill_2_tv"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:padding="5dp"
            android:text="234"
            android:textSize="25sp"/>

        <TextView
            android:id="@+id/skill_3_tv"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:padding="5dp"
            android:text="345"
            android:textSize="25sp"/>

    </LinearLayout>

    <View
        android:layout_width="match_parent"
        android:layout_height="2dp"
        android:background="#ff0000"/>

</LinearLayout>

4、ListItemAdapter

import android.content.Context;
import android.text.TextUtils;
import android.util.DisplayMetrics;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.LinearLayout;
import android.widget.TextView;

import java.util.List;

public class ListItemAdapter extends BaseAdapter {

    private List<ListItem> mList;
    private Context mContext;

    private int mPosition = -1;
    private DisplayMetrics mDisplayMetrics;
    private LayoutInflater mInflater;

    public ListItemAdapter(Context context, List<ListItem> mList) {
        this.mList = mList;
        this.mContext = context;
        this.mDisplayMetrics = mContext.getResources().getDisplayMetrics();
        this.mInflater = LayoutInflater.from(context);
    }

    @Override
    public int getCount() {
        return mList.size();
    }

    @Override
    public Object getItem(int position) {
        return mList.get(position);
    }

    @Override
    public long getItemId(int position) {
        return position;
    }

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        ViewHolder holder;

        if (convertView == null) {
            holder = new ViewHolder();
            convertView = mInflater.inflate(R.layout.group_item, null);
            holder.childrenLayout = (LinearLayout) convertView.findViewById(R.id.children_ll);
            holder.name = (TextView) convertView.findViewById(R.id.name);
            holder.skill_1_tv = (TextView) convertView.findViewById(R.id.skill_1_tv);
            holder.skill_2_tv = (TextView) convertView.findViewById(R.id.skill_2_tv);
            holder.skill_3_tv = (TextView) convertView.findViewById(R.id.skill_3_tv);
            convertView.setTag(holder);
        } else {
            holder = (ViewHolder) convertView.getTag();
        }

        ListItem item = mList.get(position);

        String name=item.getName();
        String skill_1=item.getSkill_1();
        String skill_2=item.getSkill_2();
        String skill_3=item.getSkill_3();

        holder.name.setText(name);

        if(!TextUtils.isEmpty(skill_1)){
            holder.skill_1_tv.setText(skill_1);
        }else{
            holder.skill_1_tv.setVisibility(View.GONE);
        }
        if(!TextUtils.isEmpty(skill_2)){
            holder.skill_2_tv.setText(skill_2);
        }else{
            holder.skill_2_tv.setVisibility(View.GONE);
        }
        if(!TextUtils.isEmpty(skill_3)){
            holder.skill_3_tv.setText(skill_3);
        }else{
            holder.skill_3_tv.setVisibility(View.GONE);
        }

        //这里很重要，计算当前要展开view的高度
        LinearLayout childrenLayout = (LinearLayout) convertView.findViewById(R.id.children_ll);
        int widthSpec = View.MeasureSpec.makeMeasureSpec((int) (mDisplayMetrics.widthPixels -
                10 * mDisplayMetrics.density), View.MeasureSpec.EXACTLY);
        childrenLayout.measure(widthSpec, 0);
        LinearLayout.LayoutParams params = (LinearLayout.LayoutParams) childrenLayout.getLayoutParams();

        if (mPosition == position) {
            params.bottomMargin = 0;
            childrenLayout.setVisibility(View.VISIBLE);
        } else {
            params.bottomMargin = -childrenLayout.getMeasuredHeight();
            childrenLayout.setVisibility(View.GONE);
        }

        return convertView;
    }


    public void setPosition(int position) {
        mPosition = position;
    }

    public static class ViewHolder {
        TextView name;
        TextView skill_1_tv;
        TextView skill_2_tv;
        TextView skill_3_tv;
        LinearLayout childrenLayout;
    }
}

5、MainActivity

import android.app.Activity;
import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.view.animation.Animation;
import android.widget.AdapterView;
import android.widget.ListView;

import java.util.ArrayList;
import java.util.List;

public class MainActivity extends Activity {

    private ListView mListView;

    private List<ListItem> mList;

    private ListItemAdapter mListAdapter;

    private ListItemAdapter.ViewHolder mLastViewTag = null;

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


    public void init() {

        mListView = (ListView) findViewById(R.id.list_view);
        mList = new ArrayList<ListItem>();

        //测试展示效果，赋予3种情况：有3个技能，有2个技能，没有技能
        for (int i = 0; i < 20; i++) {
            if (i >= 10 && i <= 13) {
                mList.add(new ListItem("名字" + i, "技能" + i + "-1", "", "技能" + i + "-3"));
            } else if (i >= 15) {
                mList.add(new ListItem("名字" + i, "", "", ""));
            } else {
                mList.add(new ListItem("名字" + i, "技能" + i + "-1", "技能" + i + "-2", "技能" + i + "-3"));
            }
        }

        mListAdapter = new ListItemAdapter(this, mList);
        mListView.setAdapter(mListAdapter);

        mListView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> parent, View view, final int position, long id) {
                mListAdapter.setPosition(position);

                //将上一个展开的view 收缩
                if (mLastViewTag != null) {
                    View previousView = parent.findViewWithTag(mLastViewTag);
                    if (previousView != null) {
                        View childrenView = previousView.findViewById(R.id.children_ll);
                        if (childrenView != null
                                && (childrenView.getVisibility() != View.GONE)) {
                            childrenView.startAnimation(new ViewExpandAnimation(
                                    childrenView));
                        }
                    }
                }

                //记录当前item的Tag
                mLastViewTag = (ListItemAdapter.ViewHolder) view.getTag();

                Log.e("mLastViewTag",mLastViewTag.toString());

                //展开当前点击的item
                View childrenLayout = view.findViewById(R.id.children_ll);
                ViewExpandAnimation expandAnimation = new ViewExpandAnimation(childrenLayout);

                expandAnimation.setAnimationListener(new Animation.AnimationListener() {
                    @Override
                    public void onAnimationStart(Animation animation) {
                    }

                    @Override
                    public void onAnimationEnd(Animation animation) {
                        //item展开结束后，将当前item平滑滚动到顶部
                        mListView.smoothScrollToPositionFromTop(position, 1, 200);
                    }

                    @Override
                    public void onAnimationRepeat(Animation animation) {
                    }
                });

                childrenLayout.startAnimation(expandAnimation);
            }
        });
    }
}