來由

之所以做這個效果是因為專案中有這個效果需要實現。

• 一開始我有在github上找到不少類似的庫，但是發現放在專案中會發現要麼有鋸齒，要麼就是卡頓，總之就是效果不好，其實絕大多數的庫都和Swipecards差不多，做法是重寫了adapterview，然後設定監聽，在監聽裡做移動和縮放。移動用的是設定view的x和y座標，這樣做法的弊端是會頻繁觸發view樹重繪，效率不高。
• 後來發現這個庫android-card-slide-panel，它的做法是重寫了viewgroup，裡面view的數目是固定的，卡片的滑動是通過viewDragHelper來做的，沒有鋸齒同時也不卡頓了，但是viewDragHelper有問題：
  1、在多個手指同時滑動的時候會有概率出現pointIndex out of range異常，這個問題倒沒什麼，我通過修改viewDragHelper的原始碼已經解決了這個問題；
  2、當用picasso或者glide載入圖片以後，在手指拖動卡片的過程中有時會莫名的收到MotionEvent的UP事件，導致卡片回到了初始位置，這個問題折騰了我半天，後來的解決辦法是棄用了viewDragHelper，直接使用Scroller。
  3、還有一點要吐槽下，這個庫的使用太麻煩了，耦合太重，整合到專案裡比較費事。

效果圖

本來還有幾個效果圖的，但是被csdn給刪了，所以如果想要瀏覽更多，請點我瀏覽更多效果圖

特點

1. 如絲般順滑，這是同事體驗過後的評價；
2. 靈活，可以通過設定幾個屬性，很容易就能定製可視卡片的數量和卡片的疊加垂直偏移量、縮放比例，透明度比例；
3. 使用方便，直接setadapter就可以使用了，資料更新呼叫swipeCardsView.notifyDatasetChanged(mList);就行了，下面有使用說明。

Gradle

dependencies {
   compile 'com.huxq17.android:SwipeCardsView:0.0.5'
 

   //依賴下面的庫
   compile 'com.android.support:appcompat-v7:23.0.1'
}

Example

xml：

<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:card="http://schemas.android.com/apk/res-auto"
    android:layout_width
 
="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true">

    <com.huxq17.swipecardsview.SwipeCardsView
        android:id="@+id/swipCardsView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#f3f3f3"
        card:alphaOffsetStep="40"
        card:scaleOffsetStep="0.08"
        card:yOffsetStep="20dp" />

    ...省略部分程式碼...

</android.support.design.widget.CoordinatorLayout>

對card中屬性的解釋：

<declare-styleable name="SwipCardsView">
        <!-- yOffsetStep定義的是卡片之間在y軸方向上的偏移量，單位是dp，
        舉個例子，可見的卡片有3個，如果步長是20dp，從前往後看，卡片y軸座標會依次增加20dp，表現上就是後面一張卡片底部有20dp會露出來
        如果值是負的，如 -20dp，那麼表現則相反。
         如果不需要對卡片進行y軸方向上的偏移量處理，不設定這個屬性或者設定為0dp就可以了-->
        <attr name="yOffsetStep" format="dimension" />
        <!-- alpha定義的取值範圍是0-100，所以alpha的步長也得在這個範圍之內，
        舉個例子，可見的卡片有3個，如果步長是40，那麼最前面的alpha是100，後面一點的是60，最後面的是20
         如果不需要對卡片進行透明度處理，不設定這個屬性或者設定為0就可以了-->
        <attr name="alphaOffsetStep" format="integer" />
        <!-- scale定義的取值範圍是0-1，所以scale的步長也得在這個範圍之內，
        舉個例子，可見的卡片有3個，如果步長是0.08，那麼最前面的alpha是1，後面一點的是0.92，最後面的是0.84
        值得注意的是 x 和 y同時被縮放了(1 - scaleStep*index)
        如果不需要對卡片進行縮放處理，不設定這個屬性或者設定為0就可以了-->
        <attr name="scaleOffsetStep" format="float" />
    </declare-styleable>

adapter：

1、抽象類

public abstract class BaseCardAdapter<T> {
   /**
        * 獲取卡片的數量
        *
        * @return
     */
     public abstract int getCount();


    /**
     * 獲取卡片view的layout id
     *
     * @return
     */
    public abstract int getCardLayoutId();

    /**
     * 將卡片和資料繫結在一起
     *
     * @param position 資料在資料集中的位置
     * @param cardview 要繫結資料的卡片
     * @param data     資料集中對應位置的資料
     */
    public abstract void onBindData(int position, View cardview, T data);

    /**
     * 獲取可見的cardview的數目，預設是3
     * @return
     */
    public int getVisibleCardCount() {
        return 3;
    }
}

2、實現

public class MeiziAdapter extends BaseCardAdapter {
    private List<ContentBean> datas;
    private Context context;

    public MeiziAdapter(List<ContentBean> datas, Context context) {
        this.datas = datas;
        this.context = context;
    }

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

    @Override
    public int getCardLayoutId() {
        return R.layout.card_item;
    }

    @Override
    public void onBindData(int position, View cardview) {
        if (datas == null || datas.size() == 0) {
            return;
        }
        ImageView imageView = (ImageView) cardview.findViewById(R.id.iv_meizi);
        ContentBean meizi = datas.get(position);
        String url = meizi.getUrl();
        Picasso.with(context).load(url).config(Bitmap.Config.RGB_565).into(imageView);
    }

    /**
     * 如果可見的卡片數是3，則可以不用實現這個方法
     * @return
     */
    @Override
    public int getVisibleCardCount() {
        return super.getVisibleCardCount();
    }
}

activity or fragment：

    /**
     * 卡片向左邊飛出
     */
    public void doLeftOut() {
        swipeCardsView.slideCardOut(SwipeCardsView.SlideType.LEFT);
    }

    /**
     * 卡片向右邊飛出
     */
    public void doRightOut() {
        swipeCardsView.slideCardOut(SwipeCardsView.SlideType.RIGHT);
    }

    /**
     * 從頭開始，重新瀏覽
     */
    public void doRetry() {
        //必須先改變adapter中的資料，然後才能由資料變化帶動頁面重新整理
        if (mList != null) {
            adapter.setData(mList);
            swipeCardsView.notifyDatasetChanged(0);
        }

    /**
     * 顯示cardsview
     */
    private void show() {
        if (adapter == null) {
            adapter = new MeiziAdapter(mList, getActivity());
            swipeCardsView.setAdapter(adapter);
        } else {
            //if you want to change the UI of SwipeCardsView,you must modify the data first
           adapter.setData(mList);
           swipeCardsView.notifyDatasetChanged(curIndex);
        }
    }

      ...省略部分程式碼...
        swipeCardsView = (SwipeCardsView) container.findViewById(R.id.swipCardsView);
       //設定滑動監聽
        swipeCardsView.setCardsSlideListener(new SwipeCardsView.CardsSlideListener() {
            @Override
            public void onShow(int index) {
                LogUtils.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) {
                toast("點選了 position="+index);
            }
        }); 

經驗總結

1. 用removeView和addView是會觸發view樹重繪的，而用removeViewInLayout和addViewInLayout則不會。通過設定view的x y座標來移動view不是一個好的選擇，道理也一樣，應該使用offsetTopAndBottom和offsetLeftAndRight；
2. ViewDragHelper是有問題的，上面有說明，儘量使用Scroller完成任務；
3. 其實很多經驗都在程式碼裡，挨個拿出來說也不現實，點選獲取SwipeCardsView的原始碼，如果感覺不錯，那就給個star唄，萬分感謝！