ListView 仿QQ微信侧滑出现删除按钮

要在ListView侧滑时出现删除等按钮，见下面效果图:

实现起来很简单，使用HorizontalScrollView将正常显示的item层及操作按钮层水平并排起来，滑动时再将操作按钮显示出来，详见代码:

（1）MainActivity.java

package com.justlcw.csdn;

import android.app.Activity;
import android.os.Bundle;
import android.util.DisplayMetrics;
import android.widget.ListView;


public class MainActivity extends Activity
{
  
    private ListView mListView;
 
    private MyAdapter mAdapter;

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

        mListView = (ListView) findViewById(R.id.listView);
        
        DisplayMetrics dm = new DisplayMetrics();
        getWindowManager().getDefaultDisplay().getMetrics(dm);
        
        mAdapter = new MyAdapter(this, dm.widthPixels);
        //ListView
        mListView.setAdapter(mAdapter);
    }
}

（2）MyAdapter.java

package com.justlcw.csdn;

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

import android.content.Context;
import android.view.LayoutInflater;
import android.view.MotionEvent;
import android.view.View;
import android.view.ViewGroup;
import android.view.ViewGroup.LayoutParams;
import android.widget.BaseAdapter;
import android.widget.Button;
import android.widget.HorizontalScrollView;
import android.widget.TextView;

public class MyAdapter extends BaseAdapter implements View.OnClickListener  
{  
    /** 
     * 这个用来填充list 
     */  
    private List<Integer> colors;  
    /** 
     * context上下文,用来获得convertView 
     */  
    private Context mContext;  
    /** 
     * 屏幕宽度,由于我们用的是HorizontalScrollView,所以按钮选项应该在屏幕外 
     */  
    private int mScreentWidth;  
  
    /** 
     * 构造方法 
     * @param context 
     * @param screenWidth 
     */  
    public MyAdapter(Context context, int screenWidth)  
    {  
        //初始化  
        mContext = context;  
        mScreentWidth = screenWidth;  
          
        //填充list的内容  
        colors = new ArrayList<Integer>();  
        for (int i = 0; i < 5; i++)  
        {  
            colors.add(R.color.blue);  
        }  
    }  
  
    @Override  
    public int getCount()  
    {  
        return colors.size();  
    }  
  
    @Override  
    public Object getItem(int position)  
    {  
        return position;  
    }  
  
    @Override  
    public long getItemId(int position)  
    {  
        return position;  
    }  
  
    @Override  
    public View getView(int position, View convertView, ViewGroup parent)  
    {  
        final ViewHolder holder;  
        //如果没有设置过,初始化convertView  
        if (convertView == null)  
        {  
            //获得设置的view  
            convertView = LayoutInflater.from(mContext).inflate(R.layout.item_list, parent, false);  
  
            //初始化holder  
            holder = new ViewHolder();  
            
            /**
             * 整个item的水平滚动层
             */
            holder.itemHorizontalScrollView = (HorizontalScrollView) convertView.findViewById(R.id.hsv);  
  
            /**
             * 操作按钮层
             */
            holder.actionLayout = convertView.findViewById(R.id.ll_action);  
            holder.btOne = (Button) convertView.findViewById(R.id.button1);  
            holder.btTwo = (Button) convertView.findViewById(R.id.button2);  
            holder.btThree = (Button) convertView.findViewById(R.id.button3);  
  
            //把位置放到view中,这样点击事件就可以知道点击的是哪一条item  
            holder.btOne.setTag(position);  
            holder.btTwo.setTag(position);  
            holder.btThree.setTag(position);  
  
            holder.tvContent = (TextView) convertView.findViewById(R.id.tv);  
  
            //设置内容view的大小为屏幕宽度,这样按钮就正好被挤出屏幕外  
            holder.normalItemContentLayout = convertView.findViewById(R.id.ll_content);  
            LayoutParams lp = holder.normalItemContentLayout.getLayoutParams();  
            lp.width = mScreentWidth;  
  
            convertView.setTag(holder);  
        }  
        else//有直接获得ViewHolder  
        {  
            holder = (ViewHolder) convertView.getTag();  
        }  
  
        //设置监听事件  
        convertView.setOnTouchListener(new View.OnTouchListener()  
        {  
            @Override  
            public boolean onTouch(View v, MotionEvent event)  
            {  
                switch (event.getAction())  
                {  
                    case MotionEvent.ACTION_UP:  
                          
                        //获得ViewHolder  
                        ViewHolder viewHolder = (ViewHolder) v.getTag();  
                          
                        //获得HorizontalScrollView滑动的水平方向值.  
                        int scrollX = viewHolder.itemHorizontalScrollView.getScrollX();  
                          
                        //获得操作区域的长度  
                        int actionW = viewHolder.actionLayout.getWidth();  
                          
                        //注意使用smoothScrollTo,这样效果看起来比较圆滑,不生硬  
                        //如果水平方向的移动值<操作区域的长度的一半,就复原  
                        if (scrollX < actionW / 2)  
                        {  
                            viewHolder.itemHorizontalScrollView.smoothScrollTo(0, 0);  
                        }  
                        else//否则的话显示操作区域  
                        {  
                            viewHolder.itemHorizontalScrollView.smoothScrollTo(actionW, 0);  
                        }  
                        return true;  
                }  
                return false;  
            }  
        });  
  
        //这里防止删除一条item后,ListView处于操作状态,直接还原  
        if (holder.itemHorizontalScrollView.getScrollX() != 0)  
        {  
            holder.itemHorizontalScrollView.scrollTo(0, 0);  
        }  
          
        //设置背景颜色,设置填充内容.  
        holder.normalItemContentLayout.setBackgroundResource(colors.get(position));  
        holder.tvContent.setText("" + position);  
  
        //设置监听事件  
        holder.btOne.setOnClickListener(this);  
        holder.btTwo.setOnClickListener(this);  
        holder.btThree.setOnClickListener(this);  
  
        return convertView;  
    }  
  
    /** 
     * ViewHolder 
     *@Title: 
     *@Description:主要是避免了不断的view获取初始化. 
     *@Author:justlcw 
     *@Since:2013-11-22 
     *@Version: 
     */  
    class ViewHolder  
    {  
        public HorizontalScrollView itemHorizontalScrollView;  
          
        /**
         * 正常（没左侧滑）情况的item内容布局
         */
        public View normalItemContentLayout;  
        public TextView tvContent;  
  
        /**
         * 删除，添加，变色操作按钮层
         */
        public View actionLayout;  
        public Button btOne;  
        public Button btTwo;  
        public Button btThree;  
    }  
  
    @Override  
    public void onClick(View v)  
    {  
        int position = (Integer) v.getTag();  
        switch (v.getId())  
        {  
            case R.id.button1:  
  
                colors.add(R.color.blue);  
                break;  
  
            case R.id.button2:  
  
                colors.remove(position);  
                break;  
  
            case R.id.button3:  
  
                if (colors.get(position) == R.color.blue)  
                {  
                    colors.set(position, R.color.red);  
                }  
                else  
                {  
                    colors.set(position, R.color.blue);  
                }  
                break;  
  
            default:  
                break;  
        }  
        //刷新ListView内容  
        notifyDataSetChanged();  
    }  
}  

（3）主界面布局activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

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

</RelativeLayout>

（4）item界面布局item_list.xml

<?xml version="1.0" encoding="utf-8"?>
<HorizontalScrollView xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/hsv"
    android:layout_width="wrap_content"
    android:layout_height="80dip"
    android:scrollbars="none" >

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:orientation="horizontal" >

        <!-- 没有左侧滑操作的item显示界面 -->
        <LinearLayout
            android:id="@+id/ll_content"
            android:layout_width="match_parent"
            android:layout_height="match_parent" >

            <TextView
                android:id="@+id/tv"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:gravity="center"
                android:text="" />
        </LinearLayout>

        <!-- 左侧滑操作后的显示出的操作按钮层 -->
        <LinearLayout
            android:id="@+id/ll_action"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:orientation="horizontal" >

            <Button
                android:id="@+id/button1"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:background="@android:color/darker_gray"
                android:paddingLeft="20dip"
                android:paddingRight="20dip"
                android:text="@string/action1" />

            <Button
                android:id="@+id/button2"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:layout_marginLeft="2dip"
                android:layout_marginRight="2dip"
                android:background="@android:color/darker_gray"
                android:paddingLeft="20dip"
                android:paddingRight="20dip"
                android:text="@string/action2" />

            <Button
                android:id="@+id/button3"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:background="@android:color/darker_gray"
                android:paddingLeft="20dip"
                android:paddingRight="20dip"
                android:text="@string/action3" />
        </LinearLayout>
    </LinearLayout>

</HorizontalScrollView>

(5)color.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="red">#f5c662</color>
    <color name="blue">#96cff7</color>
    
</resources>

(6)strings.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>

    <string name="app_name">ListViewSlidingMenu</string>
    
    <string name="action1"> 添 加 </string>
    <string name="action2"> 删 除 </string>
    <string name="action3"> 变 色 </string>

</resources>

 源代码见附件

另可参考:

http://blog.csdn.net/chaishen10000/article/details/22527365