利用swipelistview完成qq聊天列表右滑删除功能

做一下qq聊天列表的item右滑出现后面的视图，然后我就开始着手自己做，之后无意间发现了可以利用一个github开源项目 swiplistview完成，但是当我查看那些swiplistview的相关文档时，很不全面，github官网上下载的和之前他们写的文档已经有所 不同，所以在这里我就重新来写一下怎么使用swiplistview的准备阶段。

之前的文档都是说，当从官网上下载下来后，有两个文件，一个是lib:android-swiplistview，另一个是例子：SwipListViewExampleActivity,但是现在下载后，解压后是这样的


显 然已经和之前的不一样了，现在的官网上是用了gradle来构造Android程序，但我以前根本没有接触过gradle，所以只能自己去找以前的那个 swiplistview。当时我也是纠结了很久，自己FQ出去，各种Google，最后终于找到了，swiplistview，我之后会全部上传，共享 给大家。

下面是qq的效果图：


下面是我这个项目的效果图：


现在我们进入正题：

我们一共需要两个jar包，一个swiplistview，如图所示：这三个下载地址http://download.csdn.net/detail/harryweasley/8190519


1. 引入android-swipelistview库：导入开源库，用Import选项，然后Android选项下的“Existing Android Code Into Workspace”引入库；在这里将“copy projects into workspace”前面打钩哦

2.引入android-swipelistview的依赖库nineoldandroids-2.4.0.jar：建立一个libs文件夹，将nineoldandroids-2.4.0.jar拷贝到libs文件夹之下；

3.引入android-swipelistview的依赖内部库android-support-v4.jar：项目的Android Tools选项，“Add Support Library”来增加android-support-v4库；（注：如果找不到对应的support库，可以通过SDK Manager来进行下载）
4.编译android-swipelistview库的jar包：项目的Properties选项，Android选项，勾选"Is Library"；
5.编译android-swipelistview项目，在项目的bin目录应该能看到android-swipelistview.jar包。


这样，我们就完成了swiplistview的库了。

然后我们自己建立一个Android程序SwipListView进行测试，建好后，开始导入库，项目的Properties选项，Android选项，Library框选择add按钮添加swipelistview.jar包；

这里需要注意：swipelistview这个lib必须和SwiplistView在同一工作区间，否则导入的包前面会有红叉。如图所示



我们可以看下官网上关于SwipListView的描述

If you decide to use SwipeListView as a view, you can define it in your xml layout like this:

    <com.fortysevendeg.swipelistview.SwipeListView
            xmlns:swipe="http://schemas.android.com/apk/res-auto"
            android:id="@+id/example_lv_list"
            android:listSelector="#00000000"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            swipe:swipeFrontView="@+id/front"
            swipe:swipeBackView="@+id/back"
            swipe:swipeActionLeft="[reveal | dismiss]"
            swipe:swipeActionRight="[reveal | dismiss]"
            swipe:swipeMode="[none | both | right | left]"
            swipe:swipeCloseAllItemsWhenMoveList="[true | false]"
            swipe:swipeOpenOnLongPress="[true | false]"
            swipe:swipeAnimationTime="[miliseconds]"
            swipe:swipeOffsetLeft="[dimension]"
            swipe:swipeOffsetRight="[dimension]"
            />
  • swipeFrontView - Required - front view id. 即ListView Item正常显示的控件Id，且必须与Item的布局文件中的控件id一样
  • swipeBackView - Required - back view id.  手指滑动时显示的，隐藏在FrontView后面，且必须与item的布局文件中控件Id一样
  • swipeActionLeft - Optional - left swipe action Default: 'reveal'  左滑的动作，默认reveal，即显示BackView，还有dismiss,choice会触发响应的方法。
  • swipeActionRight - Optional - right swipe action Default: 'reveal' 同上
  • swipeMode - Gestures to enable or 'none'. Default: 'both' 设置左滑、右滑、都支持
  • swipeCloseAllItemsWhenMoveList - Close revealed items on list motion. Default: 'true' 当滚动listview时，关闭所有展开的Item，最好不要设置为false，由于item的复用，false存在一些问题。
  • swipeOpenOnLongPress - Reveal on long press Default: 'true' 长按时触发显示
  • swipeAnimationTime - item drop animation time. Default: android configuration 动画时间长度
  • swipeOffsetLeft - left offset 左偏移量
  • swipeOffsetRight - right offset 右偏移量

上面是基本属性，下面开始上代码：

首先是activity_main.xml下的代码：

01 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
02     xmlns:tools="http://schemas.android.com/tools"
03     android:layout_width="match_parent"
04     android:layout_height="match_parent"
05     tools:context=".MainActivity" >
06  
07     <com.fortysevendeg.swipelistview.SwipeListView
08         xmlns:swipe="http://schemas.android.com/apk/res-auto"
09         android:id="@+id/example_lv_list"
10         android:layout_width="fill_parent"
11         android:layout_height="fill_parent"
12         swipe:swipeActionLeft="reveal"
13         swipe:swipeBackView="@+id/id_back"
14         swipe:swipeCloseAllItemsWhenMoveList="true"
15         swipe:swipeFrontView="@+id/id_front"
16         swipe:swipeMode="left"
17         swipe:swipeOffsetLeft="200dip"
18         swipe:swipeOffsetRight="0dp"
19         swipe:swipeOpenOnLongPress="true" />
20  
21 </RelativeLayout>


接下来是itm.xml的代码：

01 <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
02     xmlns:tools="http://schemas.android.com/tools"
03     android:layout_width="match_parent"
04     android:layout_height="60dp" >
05  
06     <LinearLayout
07         android:id="@+id/id_back"
08         android:layout_width="match_parent"
09         android:layout_height="match_parent"
10         android:background="#ffcccccc"
11         android:gravity="center|right" >
12  
13         <Button
14             android:id="@+id/id_remove"
15             android:layout_width="60dp"
16             android:layout_height="wrap_content"
17             android:layout_gravity="center"
18             android:layout_marginRight="4dp"
19             android:background="@android:color/holo_green_light"
20             android:text="Delete"
21             android:textColor="#fff" >
22         </Button>
23     </LinearLayout>
24  
25     <LinearLayout
26         android:id="@+id/id_front"
27         android:layout_width="match_parent"
28         android:layout_height="match_parent"
29         android:background="#ffffffff" >
30  
31         <TextView
32             android:id="@+id/id_text"
33             android:layout_width="wrap_content"
34             android:layout_height="wrap_content"
35             android:layout_marginLeft="10dp"
36             android:gravity="center_vertical"
37             android:minHeight="?android:attr/listPreferredItemHeight"
38             android:textAppearance="?android:attr/textAppearanceLarge"
39             android:textColor="#000"
40             android:textSize="25sp" >
41         </TextView>
42     </LinearLayout>
43  
44 </FrameLayout>


这里要强调一下：对应布局的id和swipeListView中的frontView和backView的Id一致。

接下来是DataAdapter的代码

 

01 package com.example.swiplistview;
02  
03 import java.util.List;
04  
05 import android.content.Context;
06 import android.view.LayoutInflater;
07 import android.view.View;
08 import android.view.View.OnClickListener;
09 import android.view.ViewGroup;
10 import android.widget.BaseAdapter;
11 import android.widget.Button;
12 import android.widget.TextView;
13  
14 import com.fortysevendeg.swipelistview.SwipeListView;
15  
16 public class DataAdapter extends BaseAdapter{
17     private List<String> mDatas; 
18     private LayoutInflater mInflater; 
19     private SwipeListView mSwipeListView ; 
20    
21     public DataAdapter(Context context, List<String> datas , SwipeListView swipeListView) 
22     { 
23         this.mDatas = datas; 
24         mInflater = LayoutInflater.from(context); 
25         mSwipeListView = swipeListView; 
26     } 
27    
28     @Override 
29     public int getCount() 
30     { 
31         return mDatas.size();
32          
33     } 
34    
35     @Override 
36     public Object getItem(int position) 
37     { 
38         return mDatas.get(position); 
39     } 
40    
41     @Override 
42     public long getItemId(int position) 
43     { 
44         return position; 
45     } 
46    
47     @Override 
48     public View getView(final int position, View convertView, ViewGroup parent) 
49     { 
50         convertView = mInflater.inflate(R.layout.item, null); 
51    
52         TextView tv = (TextView) convertView.findViewById(R.id.id_text); 
53         Button del = (Button) convertView.findViewById(R.id.id_remove); 
54         tv.setText(mDatas.get(position)); 
55         del.setOnClickListener(new OnClickListener() 
56         { 
57             @Override 
58             public void onClick(View v) 
59             { 
60                 mDatas.remove(position); 
61                 notifyDataSetChanged(); 
62                  /**
63                   * 关闭SwipeListView
64                   * 不关闭的话，刚删除位置的item存在问题 ，不能再次点击
65                   */ 
66                 mSwipeListView.closeOpenedItems(); 
67             } 
68         }); 
69            
70         return convertView; 
71     } 
72 }


最后是MainActivity的代码了，都比较简单：

 

01 package com.example.swiplistview;
02  
03 import java.util.ArrayList;
04 import java.util.List;
05  
06 import android.app.Activity;
07 import android.os.Bundle;
08  
09 import com.fortysevendeg.swipelistview.BaseSwipeListViewListener;
10 import com.fortysevendeg.swipelistview.SwipeListView;
11  
12 public class MainActivity extends Activity {
13     SwipeListView swipeListView;
14     List<String> mDatas;
15     DataAdapter adapter;
16  
17     @Override
18     protected void onCreate(Bundle savedInstanceState) {
19         super.onCreate(savedInstanceState);
20         setContentView(R.layout.activity_main);
21         mDatas = new ArrayList<String>();
22         for (int i = 0; i < 20; i++) {
23             mDatas.add("这是记录呢。。" + i);
24         }
25  
26         swipeListView = (SwipeListView) findViewById(R.id.example_lv_list);
27         adapter = new DataAdapter(this, mDatas, swipeListView);
28         swipeListView.setAdapter(adapter);
29  
30         swipeListView.setSwipeListViewListener(new BaseSwipeListViewListener() {
31             // 这里可以重写很多方法
32             @Override
33             public void onListChanged() {
34  
35                 super.onListChanged();
36  
37             }
38  
39             @Override
40             public void onClickFrontView(int position) {
41                  
42                 super.onClickFrontView(position);
43                  
44             }
45  
46         });
47     }
48 }


这样就大功告成了。

上面的都是最基本的功能，完成了上面的那些，然后我们就可以做相应的点击事件了。所以一起加油吧。

最后还有一个我在github下载的一个Demo，但并不是47deg的，是一个普通人写的，我给她上传了，下载地址http://download.csdn.net/detail/harryweasley/8190525

这里多说一下，你刚导入Eclipse时，会报一个不能解析android-14，你重启一下Eclipse，就好了。第二个问题，重启Eclipse后，bin文件里又有错误了，删除bin文件，Eclipse会重新自动生成一个，这样两个小bug就解决了。

posted @ 2015-01-09 19:03  东方小虾米  阅读(737)  评论(1)  编辑  收藏  举报