仿ios短信列表滑动出现删除按钮

最近还没找到工作所以在宿舍有点闲，所以呢就自己写了这么一个例子。之前网上有很多人写过类似的文章或demo，github上面也有开源项目。但是，老是copy别人代码也怪没意思的，于是就自己尝试着自己写呗。废话多了先来看下效果咯：

运行效果：

1、实现思路
其实实现思路很简单那就是在ListView的item里面放一个可以滑动的view，这里我用的是HorizontalScrollView。我之所以选HorizontalScrollView是因为可以不用去处理move事件

2、SildingView的实现
SildingView是我自定义的一个View 他继承的是HorizontalScrollView，SildingView就是我们要放到ListView item里面的View。代码如下所示：

SlideView.java

package okhttp.lc.com.lateralslidingitem;

import android.content.Context;
import android.util.AttributeSet;
import android.util.DisplayMetrics;
import android.util.Log;
import android.view.MotionEvent;
import android.view.View;
import android.view.ViewGroup;
import android.view.WindowManager;
import android.widget.HorizontalScrollView;
import android.widget.LinearLayout;
import android.widget.Scroller;

/**
 * Created by HP on 2016/6/6.
 */
public class SildingView extends HorizontalScrollView {
    int mScreenWidth;
    boolean once = false;
    //将MenuItem的宽度设置为100px
    int MenuWidth = 100;
    LinearLayout wapperView;
    LinearLayout mContent;
    LinearLayout mMenu;

    OpenStatusListener mListener;

    //判断菜单是否打开
    boolean isOpen = false;

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

    public SildingView(Context context, AttributeSet attrs) {
        this(context, attrs, 0);
    }

    public SildingView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init(context);
    }

    public void setContent(View view) {
        addView(view);
    }

    private void init(Context context) {
        WindowManager wm = (WindowManager) context
                .getSystemService(Context.WINDOW_SERVICE);
        DisplayMetrics outMetrics = new DisplayMetrics();
        wm.getDefaultDisplay().getMetrics(outMetrics);
        mScreenWidth = outMetrics.widthPixels;
    }

    /**
     * 设置ItemMenu打开监听事件
     * @param mListener
     */
    public void setOpenStatusListener(OpenStatusListener mListener) {
        this.mListener = mListener;
    }

    public interface OpenStatusListener {
        //status 0表示打开 1表示关闭
        void getOpenStatus(int status);
    }

    @Override
    public boolean onTouchEvent(MotionEvent ev) {
        int action = ev.getAction();
        switch (action) {
            case MotionEvent.ACTION_UP: {
                if (getScrollX() >= MenuWidth / 2) {
                    smoothScrollTo(MenuWidth, 0);
                    isOpen = true;
                    mListener.getOpenStatus(0);
                } else {
                    smoothScrollTo(0, 0);
                    isOpen = false;
                    mListener.getOpenStatus(1);
                }
            }
            return true;
        }
        return super.onTouchEvent(ev);
    }

    /**
     * 打开ItemMenu
     */
    public void openItemMenu() {
        if (!isOpen) {
            smoothScrollTo(MenuWidth, 0);
            isOpen = true;
            mListener.getOpenStatus(0);
        }
    }

    public boolean getStatus() {
        return isOpen;
    }

    /**
     * 关闭ItemMenu
     */
    public void closeItemMenu() {
        if (isOpen) {
            smoothScrollTo(0, 0);
            isOpen = false;
            mListener.getOpenStatus(1);
        }
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
        //onMeasure会多次调用，用once来控制以防多次执行以下代码
        if (!once) {
            wapperView = (LinearLayout) getChildAt(0);
            mContent = (LinearLayout) wapperView.getChildAt(0);
            mMenu = (LinearLayout) wapperView.getChildAt(1);
            mContent.getLayoutParams().width = mScreenWidth;
            mMenu.getLayoutParams().width = MenuWidth;
            once = true;
        }
    }

}

3、Activity的实现

package okhttp.lc.com.lateralslidingitem;

import android.content.Context;
import android.content.Intent;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.Menu;
import android.view.MenuItem;
import android.view.MotionEvent;
import android.view.View;
import android.view.ViewGroup;
import android.widget.AdapterView;
import android.widget.BaseAdapter;
import android.widget.LinearLayout;
import android.widget.ListView;
import android.widget.TextView;
import android.widget.Toast;

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

public class MainActivity extends AppCompatActivity {

    ListView lv_main;
    List<String> list = new ArrayList<String>();
    okhttp.lc.com.lateralslidingitem.SildingView mSlidingView;

    MyAdapter adapter;
    boolean isOpen = false;

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

    private void initData() {
        for (int i = 0; i < 40; i++) {
            list.add("SomeThing" + (i + 1));
        }
        adapter = new MyAdapter(this);
        lv_main.setAdapter(adapter);
        /**
         * 监听ListView的滑动
         */
        lv_main.setOnTouchListener(new View.OnTouchListener() {
            @Override
            public boolean onTouch(View view, MotionEvent motionEvent) {
                int action = motionEvent.getAction();
                if (check()) {
                    Log.e("TAG", "true");
                    switch (action) {
                        case MotionEvent.ACTION_DOWN: {
                            close();
                        }
                        break;
                        case MotionEvent.ACTION_MOVE: {
                            close();
                        }
                        break;
                        case MotionEvent.ACTION_UP: {
                            close();
                        }
                        break;
                    }
                    return true;
                }
                return false;
            }
        });
    }

    /**
     * 关闭ItemMenu
     */
    private void close() {
        Log.e("TAG", "close");
        for (int i = 0; i < lv_main.getChildCount(); i++) {
            SildingView v = (SildingView) lv_main.getChildAt(i);
            v.closeItemMenu();
        }
    }

    /**
     * 检查是否有打开的ItemMenu
     * @return
     */
    private boolean check() {
        for (int i = 0; i < lv_main.getChildCount(); i++) {
            SildingView v2 = (SildingView) lv_main.getChildAt(i);
            if (v2.getStatus()) {
                isOpen = true;
                return isOpen;
            }
        }
        return false;
    }

    private void initViews() {
        lv_main = (ListView) findViewById(R.id.lv_main);
    }

    class MyAdapter extends BaseAdapter implements SildingView.OpenStatusListener {
        private LayoutInflater mInflater;
        private Context mContext;

        MyAdapter(Context mContext) {
            this.mContext = mContext;
            mInflater = LayoutInflater.from(mContext);
        }

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

        @Override
        public Object getItem(int i) {
            return list.get(i);
        }

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

        @Override
        public View getView(int i, View view, ViewGroup viewGroup) {
            ViewHolder mViewHolder = null;
            mSlidingView = (SildingView) view;
            if (mSlidingView == null) {
                mViewHolder = new ViewHolder();
                View itemview = mInflater.inflate(R.layout.item, null);
                mSlidingView = new SildingView(MainActivity.this);
                /**
                 * 貌似HorizontalScrollView的click事件被屏蔽了，应此为了实现点击效果采用了这种方法。
                 */
                final LinearLayout ll_item = (LinearLayout) itemview.findViewById(R.id.ll_item);
                final int in=i;
                ll_item.setOnClickListener(new View.OnClickListener() {
                    @Override
                    public void onClick(View view) {
                        if (check()) {
                            close();
                        } else
                            Toast.makeText(getApplicationContext(), "click" + in, Toast.LENGTH_SHORT).show();
                    }
                });
                mSlidingView.setContent(itemview);
                mSlidingView.setOpenStatusListener(this);
                mViewHolder.textView = (TextView) mSlidingView.findViewById(R.id.textView);
                mViewHolder.delete = (TextView) mSlidingView.findViewById(R.id.delete);
                mSlidingView.setTag(mViewHolder);
            } else {
                mViewHolder = (ViewHolder) mSlidingView.getTag();

            }
            mViewHolder.textView.setText(getItem(i).toString());
            mViewHolder.delete.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View view) {
                    Toast.makeText(getApplicationContext(), "delete", Toast.LENGTH_LONG).show();
                }
            });
            return mSlidingView;
        }

        @Override
        public void getOpenStatus(int status) {
            if (status == 0) {
                Toast.makeText(getApplicationContext(), "打开", Toast.LENGTH_SHORT).show();
//                isOpen = true;
            } else {
                Toast.makeText(getApplicationContext(), "关闭" , Toast.LENGTH_SHORT).show();
//                isOpen = false;
            }
        }
    }

    class ViewHolder {
        TextView textView;
        TextView delete;
    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.menu_main, menu);
        return true;
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        // Handle action bar item clicks here. The action bar will
        // automatically handle clicks on the Home/Up button, so long
        // as you specify a parent activity in AndroidManifest.xml.
        int id = item.getItemId();

        //noinspection SimplifiableIfStatement
        if (id == R.id.action_settings) {
            Intent intent = new Intent();
            intent.setClass(MainActivity.this, Activity2.class);
            startActivity(intent);
            return true;
        }

        return super.onOptionsItemSelected(item);
    }
}

同样也是将MainActivity的代码全部贴出来，为了方便我写了一个静态内部的Adapter。在getView()方法中将第三个参数强制转化为SildingView，然后定义一个item_view来获取加载好的布局文件，再将item_view做为SildingView的内容添加进去，最后返回SildingView。这样就很好的实现了将SildingView做为ListView的item添加进去，呃描述的实在不好能力有限啊还是看代码理解吧。。。。
如果仔细一点会发现iphone手机短信列表，如果有一个item的ItemMenu处于打开状态那么接下来无论用户是滑动列表还是点击列表的item都将没有应有的效果，而产生的效果就是将打开的ItemMenu关闭。为了实现这个效果我重写了ListView的onTouch()方法，在move事件中通过遍历ListView的所有item来检查是否有item的ItemMenu已经打开如果有则将其关闭并且屏蔽掉onTouchEvent()方法使得ListView无法滑动。最后一个问题就是item的点击事件的问题，因为我们将View换成了SlidingView（SlidingView是一个HorizontalScrollView，而HorizontalScrollView貌似将click事件屏蔽掉了）导致我们给ListView设置onItemClick事件失效，因此我选择在getView()方法中设置SlidingView中的子View的click事件这样同样实现了ListView的调集效果。但是这绝对不是最好的方法

4、布局文件

activity_main.xml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"
    android:layout_height="match_parent"
 tools:context=".MainActivity">

   <ListView
       android:id="@+id/lv_main"
       android:layout_width="match_parent"
       android:layout_height="match_parent"
       />

</RelativeLayout>

item.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:descendantFocusability="blocksDescendants"
    android:id="@+id/ll_item"
    android:orientation="horizontal">
    <LinearLayout
        android:id="@+id/ll_content"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal">

        <TextView
            android:id="@+id/textView"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_margin="20dp" />
    </LinearLayout>
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#50000000"
        >
        <TextView
            android:id="@+id/delete"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:text="delete"
            android:gravity="center"
            />
        </LinearLayout>
</LinearLayout>