使用swipecard實現卡片視圖左右滑動監聽以及點擊監聽

 前言： 大家好，今天給大家介紹安卓一種特別實用有很酷炫的組件swipecard，當然這並不是安卓爸爸創造的，這是國內的一個我認為是大牛的一個人隨便寫着玩兒搞出來了，我看了他的代碼介紹已經很清晰了，但是對於剛入門學安卓的同學們來說理解還是得需要一定的時間，於是在這里我就給大家把他的代碼給精簡一下步驟，希望能給大家一些幫助。

（圖片無法上傳所以導致圖片不可見，大家可以點擊我的有道鏈接查看 http://note.youdao.com/noteshare?id=ef7292c53d507cd0e1f3b15abb518e48）

 

1、導入：

 

第一步：首先大家需要去GitHub上去下載這個組件的壓縮包然后解壓，解壓點開文件后應該是下圖這種效果(圖片不顯示，就是一個文件夾)：

 

第二步：導入Module,在file的目錄下選擇new選擇import

 

    然后點擊出現下圖界面，在瀏覽你第一步下載的文件夾選擇library然后點擊完成

 

 

第三步：

添加依賴：在file文件目錄下的project structure里選擇你的APP，選擇depedence目錄

點擊加號選擇第二個Module depedence選擇lib目錄下點擊選擇添加依賴,點擊完成

 

至此我們對於導入Module的工作已經完成了，下面就是實現組件的效果了：

2、使用：

 

第一步：首先我們要明白，這是一個組件，類似於ListView的一個組件，所以第一步就是在xml文件中生成它

第二步：因為與ListView相似，所以這個組件也需要適配器，下面我們就要自定義一個適配器，但是需要繼承的不是BaseAdapter而是繼承咱們導入的那個Module里的BaseCardAdapter,看下面代碼：（每個方法都已經有了注釋，大家應該都看的明白）

package com.jereh.biyingapplication.adapter;

import android.content.Context;
import android.view.View;
import android.widget.ImageView;

import com.bumptech.glide.Glide;
import com.huxq17.swipecardsview.BaseCardAdapter;
import com.jereh.biyingapplication.entity.CardImg;
import com.jereh.biyingapplication.*;
import java.util.List;

/**
 * Created by zhangdi on 2016/8/31.
 */
public class MyAdapter extends BaseCardAdapter {
private List<CardImg> datas;
private Context context;

public MyAdapter(List<CardImg> datas, Context context) {
this.datas = datas;
this.context = context;
    }
/**
     * 獲取卡片的數量
*
     * @return
*/
@Override
public int getCount() {
if (datas.size()<1){
return 0;
        }else {
return datas.size();
        }

    }

/**
     * 獲取卡片view的layout id
     *
     * @return
*/
@Override
public int getCardLayoutId() {
return R.layout.card_item;
    }

/**
     * 將卡片和數據綁定在一起
*
     * @param position 數據在數據集中的位置
* @param cardview 要綁定數據的卡片
*/
@Override
public void onBindData(int position, View cardview) {
if (datas == null || datas.size() == 0) {
return;
        }
        ImageView imageView =
                (ImageView) cardview.findViewById(R.id.lv_img);
        CardImg img = datas.get(position);
        Glide.with(context)
                .load(img.getImg())
                .crossFade()
                .centerCrop()
                .into(imageView);
    }

/**
     * 獲取可見的cardview的數目，默認是3
     * @return
*/
@Override
public int getVisibleCardCount() {
return datas.size();
    }
}

 

第三步：現在已經有了適配器，布局中也已經有了組件，剩下要做的就是在java代碼中把他們關聯起來並給添加數據以及對各種事件做監聽了：

swipeCardsView =
        (SwipeCardsView)view.findViewById(R.id.swipCardsView);
//設置滑動監聽
swipeCardsView
.setCardsSlideListener(new SwipeCardsView.CardsSlideListener() {
@Override
public void onShow(int index) {
                Log.i("test showing index = ", "" + index);
            }

@Override
public void onCardVanish(int index, SwipeCardsView.SlideType type) {
                String orientation = "";
switch (type) {
case LEFT:
                        orientation = "向左飛出";
break;
case RIGHT:
                        orientation = "向右飛出";
break;
                }
            }

@Override
public void onItemClick(View cardImageView, int index) {

            }
        });

 

下面就是定義各種事件的方法以及關聯適配器展示界面的方法：（其中mList是數據）

/**
 * 卡片向左邊飛出
*/
public void doLeftOut() {
swipeCardsView.slideCardOut(SwipeCardsView.SlideType.LEFT);
}
/**
 * 卡片向右邊飛出
*/
public void doRightOut() {
swipeCardsView.slideCardOut(SwipeCardsView.SlideType.RIGHT);
}
/**
 * 顯示cardsview
 */
private void show() {
if (adapter == null) {
adapter = new MyAdapter(mList, getActivity());
swipeCardsView.setAdapter(adapter);
    } else {
swipeCardsView.notifyDatasetChanged(mList.indexOf(mList));
    }
}

 

至此這個組件已經完全配置完成，簡單吧，希望我的筆記能對大家有所幫助，更希望大家能在自己的APP中實現，謝謝