探探首页的卡片的效果

效果图

探探-编程之家

首先我们要下载一个封装的类点击进入下载CarderLibrary 或者 https://github.com/wuzeqiang2017/CarderLibrary 地址  

并且我们要和项目进行依赖 一下 。 


还需要需要的是一个Gilder 的依赖

compile 'com.github.bumptech.glide:glide:3.7.0'


在assets中我们要 放入的是图片


布局的XMl  的 yanfshi 我们使用的  下载的封装好的类 

<LinearLayoutxmlns:android="http://schemas.android.com/apk/res/android"xmlns:app="http://schemas.android.com/apk/res-auto"android:orientation="vertical"xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"android:layout_height="match_parent" tools:context="com.baidu.carderdemo.MainActivity"><FrameLayoutandroid:layout_width="match_parent"android:layout_height="50dp"android:background="#cd4827"><TextViewandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_gravity="center"android:text="搜索"android:textColor="#fff"android:textSize="17sp" /><ImageViewandroid:id="@+id/notify_change"android:layout_width="60dp"android:layout_height="60dp"android:layout_gravity="right|center_vertical"android:padding="16dp"android:src="@drawable/download" /></FrameLayout><com.stone.card.library.CardSlidePanelandroid:id="@+id/image_slide_panel"android:layout_width="match_parent"android:layout_height="match_parent"app:bottomMarginTop="38dp"app:itemMarginTop="10dp"app:yOffsetStep="13dp" /></LinearLayout>

  CardDataItem  一个类是属性的类
public class CardDataItem {String imagePath;String userName;int likeNum;int imageNum;
}


综合 的代码

public class MainActivity extends FragmentActivity {private CardSlidePanel slidePanel;private CardSlidePanel.CardSwitchListener cardSwitchListener;private List<CardDataItem> dataList = new ArrayList<CardDataItem>();private String imagePaths[] = {"file:///android_asset/wu1.jpg","file:///android_asset/guofucheng.jpg","file:///android_asset/liudehua.jpg", "file:///android_asset/zhangxueyou.jpg","file:///android_asset/lilianjie.jpg", "file:///android_asset/chenglong.jpg","file:///android_asset/xietingfeng.jpg", "file:///android_asset/liyifeng.jpg","file:///android_asset/huojianhua.jpg", "file:///android_asset/huge.jpg","file:///android_asset/yangyang.jpg", "file:///android_asset/dilireiba.jpg","file:///android_asset/mayun.png"}; // 12个图片资源private String names[] = {"武泽强","郭富城", "刘德华", "张学友", "李连杰", "成龙", "谢霆锋", "李易峰","霍建华", "胡歌", "杨洋", "迪丽热巴", "马云"};@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);slidePanel = (CardSlidePanel) findViewById(R.id.image_slide_panel);initView();}private void initView() {// 1. 左右滑动监听cardSwitchListener =new CardSlidePanel.CardSwitchListener(){@Overridepublic void onShow(int index) {Log.d("Card", "正在显示-" + dataList.get(index).userName);}@Overridepublic void onCardVanish(int index, int type) {Log.d("Card", "正在消失-" + dataList.get(index).userName + " 消失type=" + type);}};slidePanel.setCardSwitchListener(cardSwitchListener);// 2. 绑定AdapterslidePanel.setAdapter(new CardAdapter() {@Overridepublic int getLayoutId() {return R.layout.card_item;}@Overridepublic int getCount() {return dataList.size();}@Overridepublic void bindView(View view, int index) {Object tag = view.getTag();ViewHolder viewHolder;if(null!=null){viewHolder = (ViewHolder) tag;}else{viewHolder = new ViewHolder(view);view.setTag(viewHolder);}viewHolder.bindData(dataList.get(index));}@Overridepublic Object getItem(int index) {return dataList.get(index);}@Overridepublic 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 button = view.getBottom() -contentView.getPaddingBottom() - bottomLayout.getPaddingBottom();return new Rect(left , top , right , button);}});Handler handler = new Handler();handler.postDelayed(new Runnable() {@Overridepublic void run() {prepareDataList();slidePanel.getAdapter().notifyDataSetChanged();}},500);// 3. notifyDataSetChanged调用findViewById(R.id.notify_change).setOnClickListener(new View.OnClickListener() {@Overridepublic void onClick(View v) {appendDataList();slidePanel.getAdapter().notifyDataSetChanged();}});}
//随机显示private void prepareDataList() {for (int i = 0; i < names.length; i++) {CardDataItem dataItem = new CardDataItem();dataItem.userName = names[i];dataItem.imagePath = imagePaths[i];dataItem.likeNum = (int) (Math.random() * 10);dataItem.imageNum = (int) (Math.random() * 6);dataList.add(dataItem);}}//刷新界面private void appendDataList() {for (int i = 0; i < 8; i++) {CardDataItem dataItem = new CardDataItem();dataItem.userName = names[i];dataItem.imagePath = imagePaths[i];dataItem.likeNum = (int) (Math.random() * 10);dataItem.imageNum = (int) (Math.random() * 6);dataList.add(dataItem);}}class ViewHolder {ImageView imageView;View maskView;TextView userNameTv;TextView imageNumTv;TextView likeNumTv;public ViewHolder(View view) {imageView = (ImageView) 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(CardDataItem itemData) {Glide.with(MainActivity.this).load(itemData.imagePath).into(imageView);userNameTv.setText(itemData.userName);imageNumTv.setText(itemData.imageNum + "");likeNumTv.setText(itemData.likeNum + "");}}
}


可以打开demo中,找到相关的资料

下载Demo   https://github.com/wuzeqiang2017/tantan