仿探探：網絡請求資料将卡片進行左滑右滑

MVP+Retrofit+RxJava進行網絡資料的請求，Fresco進行圖檔的顯示實作探探的左滑右滑效果。

先看一下效果

再看一下依賴

implementation project(':library')//關聯一個 library
    compile 'com.github.bumptech.glide:glide:3.7.0'
    compile 'com.squareup.okhttp3:okhttp:3.1.2'
    compile 'com.facebook.fresco:fresco:0.11.0'
    compile 'com.google.code.gson:gson:2.6.2'
    compile 'com.squareup.retrofit2:retrofit:2.0.2'
    compile 'com.squareup.okhttp3:okhttp:3.1.2'
    compile 'com.squareup.retrofit2:converter-gson:2.0.2'
    //若和觀察者結合的話，需加上如下依賴：
    compile 'com.squareup.retrofit2:adapter-rxjava:2.1.0'
    compile 'io.reactivex:rxjava:1.0.14'
    compile 'io.reactivex:rxandroid:1.0.1'
           

下面進入代碼部分

先是布局

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:card="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#fff"
    android:orientation="vertical">

    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:background="#cd4827">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:text="探索"
            android:textColor="#fff"
            android:textSize="17sp" />

        <ImageView
            android:id="@+id/notify_change"
            android:layout_width="50dp"
            android:layout_height="50dp"
            android:layout_gravity="right|center_vertical"
            android:padding="16dp"
            android:src="@drawable/download" />

    </FrameLayout>

    <com.stone.card.library.CardSlidePanel
        android:id="@+id/image_slide_panel"
        android:layout_width="600dp"
        android:layout_height="800dp"
        card:bottomMarginTop="38dp"
        card:itemMarginTop="10dp"
        card:yOffsetStep="13dp" />

</LinearLayout>
           

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:id="@+id/card_item_content"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:gravity="center"
    android:paddingLeft="5dp"
    android:paddingRight="5dp"
    tools:context=".MainActivity">

    <RelativeLayout
        android:id="@+id/card_top_layout"
        android:layout_marginTop="150dp"
        android:layout_width="400dp"
        android:layout_height="400dp"
        android:background="@drawable/top">

        <com.facebook.drawee.view.SimpleDraweeView
            android:id="@+id/card_image_view"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:scaleType="centerCrop" />

        <View
            android:id="@+id/maskView"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="?android:attr/selectableItemBackground"
            android:clickable="true" />

        <TextView
            android:id="@+id/card_pic_num"
            android:layout_width="wrap_content"
            android:layout_height="20dp"
            android:layout_margin="5dp"
            android:background="#5f000000"
            android:drawableLeft="@drawable/card_photot"
            android:drawablePadding="4dp"
            android:gravity="center"
            android:paddingLeft="6dp"
            android:paddingRight="4dp"
            android:text="6"
            android:textColor="#fff" />
    </RelativeLayout>

    <RelativeLayout
        android:id="@+id/card_bottom_layout"
        android:layout_width="400dp"
        android:layout_height="wrap_content"
        android:background="@drawable/bottom"
        android:paddingTop="10dp">

        <TextView
            android:id="@+id/card_user_name"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="10dp"
            android:text="葉琪琪 23"
            android:textColor="#111"
            android:textSize="18sp" />

        <TextView
            android:id="@+id/card_other_description"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_below="@+id/card_user_name"
            android:layout_marginLeft="10dp"
            android:layout_marginTop="5dp"
            android:paddingBottom="16dp"
            android:text="其它 6km4"
            android:textColor="#888" />

        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentRight="true"
            android:layout_marginTop="3dp"
            android:orientation="horizontal">

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:drawableLeft="@drawable/card_left1"
                android:drawablePadding="2dp"
                android:gravity="center_horizontal"
                android:text="0"
                android:textColor="#999"
                android:textSize="15sp" />

            <TextView
                android:id="@+id/card_like"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="5dp"
                android:layout_marginRight="10dp"
                android:drawableLeft="@drawable/card_left2"
                android:drawablePadding="2dp"
                android:gravity="center_horizontal"
                android:text="2"
                android:textColor="#999"
                android:textSize="15sp" />
        </LinearLayout>
    </RelativeLayout>
</LinearLayout>
           

下面是請求資料的子產品

public interface IGetRequest {
    @GET("top250")
    Observable<Bean> getMovie(@Query("start") int start, @Query("count") int count);
}
           

MODEL層

public interface IGetModel {
    public void getData(int start, int count, Observer observer);
}
           

public class GetModel implements IGetModel {
    @Override
    public void getData(int start, int count, Observer observer) {
        Retrofit retrofit=new Retrofit.Builder()
                .baseUrl("https://api.douban.com/v2/movie/")
                .addCallAdapterFactory(RxJavaCallAdapterFactory.create())
                .addConverterFactory(GsonConverterFactory.create())
                .build();
        IGetRequest result=retrofit.create(IGetRequest.class);
        result.getMovie(start,count)
                .subscribeOn(Schedulers.io())
                .observeOn(AndroidSchedulers.mainThread())
                .subscribe(observer);
    }
           

View層

public interface IshowView {
    public void showData(List<Bean.SubjectsBean> list);
    public int getStart();
    public int getCount();
}
           

Presenter層

public class DataPresenter {
    IshowView view;
    GetModel model;
    List<Bean.SubjectsBean> list=new ArrayList<>();

    public DataPresenter(IshowView view) {
        this.view = view;
        model=new GetModel();
    }
    public void dpGetData(){
        int start=view.getStart();
        int count=view.getCount();
        model.getData(start,count,new Observer<Bean>(){

            @Override
            public void onCompleted() {

            }

            @Override
            public void onError(Throwable e) {
                Log.i("111111","onNext");
            }

            @Override
            public void onNext(Bean bean) {
                list.addAll(bean.getSubjects());
                view.showData(list);
                Log.i("111111","onNext"+list);
            }
        });
    }
}
           

下面是擴充卡

public class MyAdapter extends CardAdapter {
    Context context;
    List<Bean.SubjectsBean> list=new ArrayList<>();

    public MyAdapter(Context context, List<Bean.SubjectsBean> list) {
        this.context = context;
        this.list = list;
    }

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

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

    @Override
    public void bindView(View view, int index) {
        Object tag = view.getTag();
        ViewHolder viewHolder;
        if (null != tag) {
            viewHolder = (ViewHolder) tag;
        } else {
            viewHolder = new ViewHolder(view);
            view.setTag(viewHolder);
        }

        viewHolder.bindData(index,list);
    }

    @Override
    public Object getItem(int index) {
        return list.get(index);
    }
    @Override
    public Rect obtainDraggableArea(View view) {
        // 可滑動區域定制，該函數隻會調用一次
        View contentView = view.findViewById(R.id.card_item_content);
        View topLayout = view.findViewById(R.id.card_top_layout);
        View bottomLayout = view.findViewById(R.id.card_bottom_layout);
        int left = view.getLeft() + contentView.getPaddingLeft() + topLayout.getPaddingLeft();
        int right = view.getRight() - contentView.getPaddingRight() - topLayout.getPaddingRight();
        int top = view.getTop() + contentView.getPaddingTop() + topLayout.getPaddingTop();
        int bottom = view.getBottom() - contentView.getPaddingBottom() - bottomLayout.getPaddingBottom();
        return new Rect(left, top, right, bottom);
    }

    class ViewHolder {

        SimpleDraweeView imageView;
        View maskView;
        TextView userNameTv;
        TextView imageNumTv;
        TextView likeNumTv;

        public ViewHolder(View view) {
            imageView = (SimpleDraweeView) view.findViewById(R.id.card_image_view);
            maskView = view.findViewById(R.id.maskView);
            userNameTv = (TextView) view.findViewById(R.id.card_user_name);
            imageNumTv = (TextView) view.findViewById(R.id.card_pic_num);
            likeNumTv = (TextView) view.findViewById(R.id.card_like);
        }

        public void bindData(int index,List<Bean.SubjectsBean> list) {
            imageView.setImageURI(list.get(index).getImages().getLarge());
            userNameTv.setText(list.get(index).getTitle());
            imageNumTv.setText(list.get(index).getId());
            likeNumTv.setText(list.get(index).getYear());
        }

    }
}
           

最後是MainActivity中

public class MainActivity extends FragmentActivity implements IshowView{
    CardSlidePanel.CardSwitchListener cardSwitchListener;
    List<Bean.SubjectsBean> list;
    int start = ;
    int count = ;
    CardSlidePanel slidePanel;
    DataPresenter presenter;
    MyAdapter adapter;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        requestWindowFeature(Window.FEATURE_NO_TITLE);
        setContentView(R.layout.activity_main);
        list = new ArrayList<>();
        initView();
        presenter = new DataPresenter(this);
        presenter.dpGetData();

        findViewById(R.id.notify_change).setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                slidePanel.getAdapter().notifyDataSetChanged();
            }
        });
    }

    @Override
    public void showData(List<Bean.SubjectsBean> list) {
        adapter = new MyAdapter(this, list);
        slidePanel.setAdapter(adapter);

    }

    @Override
    public int getStart() {
        return start;
    }

    @Override
    public int getCount() {
        return count;
    }

    private void initView() {
        slidePanel = (CardSlidePanel) findViewById(R.id.image_slide_panel);
        // 1. 左右滑動監聽
        cardSwitchListener = new CardSlidePanel.CardSwitchListener() {

            @Override
            public void onShow(int index) {

            }

            @Override
            public void onCardVanish(int index, int type) {

            }
        };
        slidePanel.setCardSwitchListener(cardSwitchListener);
    }

}