Android CardView+RecyclerView实现卡片列表
先贴效果图

添加依赖:
RecyclerView 和 CardView都是在Android 5.0中引入的,所以需要在build.gradle中添加:
dependencies {
implementation 'com.android.support:cardview-v7:29.1.1'
implementation 'com.android.support:appcompat-v7:29.+'
}
RecyclerView相当于一个更强大,更高效的ListView,既然是列表,所以它里面的实现方式和ListView差不多,一个(含有RecyclerView)主界面布局(activity_main.xml),一个Adapter(MyAdapter.java),一个样式布局(card_item.xml)
新建样式布局card_item.xml
CardView 继承自 FrameLayout,并在其基础上添加了圆角和阴影等效果。Google用一句话介绍了CardView:一个带圆角和阴影背景的FrameLayout。
<?xml version="1.0" encoding="utf-8"?>
<androidx.cardview.widget.CardView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="@+id/item_cardview"
android:layout_gravity="center"
android:layout_width="match_parent"
android:layout_height="100dp"
card_view:cardCornerRadius="10dp"
card_view:cardElevation="3dp"
card_view:cardMaxElevation="5dp"
android:layout_margin="10dp">
<ImageView
android:id="@+id/item_iv"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop"
/>
<TextView
android:id="@+id/item_tv"
android:text="CardView测试"
android:textSize="16sp"
android:textColor="#F1F1F1"
android:gravity="center"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</androidx.cardview.widget.CardView>
定义数据类
新建一个ContactInfo类
ContactInfo.java
package com.yangmouren.taskcardview;
import android.graphics.drawable.Icon;
import android.media.Image;
/**
* @author 杨某人
*/
public class ContactInfo {
protected String text;
protected int imgId;
public ContactInfo(String text,int imgId){
this.text = text;
this.imgId = imgId;
}
public String getText(){
return text;
}
public int getImgId() {
return imgId;
}
}
创建适配器MyAdapter
MyAdapter.java
package com.yangmouren.taskcardview;
import android.content.Context;
import android.graphics.drawable.Drawable;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.TextView;
import androidx.annotation.NonNull;
import androidx.cardview.widget.CardView;
import androidx.recyclerview.widget.RecyclerView;
import java.util.List;
/**
* @author 杨某人
*/
public class MyAdapter extends RecyclerView.Adapter<MyAdapter.ContactViewHolder> {
private List<ContactInfo> contactInfoList;
private LayoutInflater mInflater;
public MyAdapter(List<ContactInfo> contactInfoList){
this.contactInfoList = contactInfoList;
}
// 重写构造方法
@NonNull
@Override
public MyAdapter.ContactViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
View itemView = LayoutInflater.from(parent.getContext())
.inflate(R.layout.card_item,parent,false);
return new ContactViewHolder(itemView);
}
@Override
public void onBindViewHolder(@NonNull MyAdapter.ContactViewHolder holder, int position) {
//contactInfoList中包含的都是ContactInfo类的对象
//通过其get()方法可以获得其中的对象
ContactInfo ci =contactInfoList.get(position);
holder.item_tv.setText(ci.getText());
holder.item_iv.setImageResource(ci.getImgId());
}
@Override
public int getItemCount() {
return contactInfoList.size();
}
class ContactViewHolder extends RecyclerView.ViewHolder{
private ImageView item_iv;
private TextView item_tv;
private CardView item_cardview;
public ContactViewHolder(@NonNull View itemView) {
super(itemView);
item_cardview = itemView.findViewById(R.id.item_cardview);
item_iv = itemView.findViewById(R.id.item_iv);
item_tv = itemView.findViewById(R.id.item_tv);
}
}
}
在主布局中插入RecyclerView
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<androidx.recyclerview.widget.RecyclerView
android:id="@+id/card_list"
android:layout_width="match_parent"
android:layout_height="wrap_content"
/>
</LinearLayout>
MainActivity.java
package com.yangmouren.taskcardview;
import androidx.appcompat.app.AppCompatActivity;
import androidx.recyclerview.widget.LinearLayoutManager;
import androidx.recyclerview.widget.RecyclerView;
import android.annotation.SuppressLint;
import android.os.Bundle;
import android.widget.RelativeLayout;
import java.util.ArrayList;
import java.util.List;
/**
* @author 杨某人
*/
public class MainActivity extends AppCompatActivity {
private MyAdapter adapter;
List<ContactInfo> mList = new ArrayList<>();
@SuppressLint("WrongConstant")
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//获取RecyclerView并将setHasFixedSize设置为true让RecyclerView避免重新计算大小
RecyclerView mRecyclerView = (RecyclerView) findViewById(R.id.card_list);
mRecyclerView.setHasFixedSize(true);
// 创建布局管理器
LinearLayoutManager layoutManager = new LinearLayoutManager(this);
layoutManager.setOrientation(LinearLayoutManager.VERTICAL);
// 将RecyclerView对象指定到布局管理器layoutManager
mRecyclerView.setLayoutManager(layoutManager);
// 初始化mList
initInfo();
// 实例化MyAdapter并传入mList对象
adapter = new MyAdapter(mList);
// 为RecyclerView对象mRecyclerView设置adapter
mRecyclerView.setAdapter(adapter);
}
// 初始化数据
public void initInfo(){
ContactInfo card1 = new ContactInfo("aaaaaaaaaaaaaaaaaaaa",R.drawable.img_01);
mList.add(card1);
ContactInfo card2 = new ContactInfo("bbbbbbbbbbbbbbbbbbbb",R.drawable.img_02);
mList.add(card2);
ContactInfo card3 = new ContactInfo("cccccccccccccccccccc",R.drawable.img_03);
mList.add(card3);
ContactInfo card4 = new ContactInfo("dddddddddddddddddddd",R.drawable.img_04);
mList.add(card4);
ContactInfo card5 = new ContactInfo("eeeeeeeeeeeeeeeeeeee",R.drawable.img_05);
mList.add(card5);
ContactInfo card6 = new ContactInfo("ffffffffffffffffffff",R.drawable.img_06);
mList.add(card6);
ContactInfo card7 = new ContactInfo("gggggggggggggggggggg",R.drawable.img_07);
mList.add(card7);
ContactInfo card8 = new ContactInfo("gggggggggggggggggggg",R.drawable.img_08);
mList.add(card8);
ContactInfo card9 = new ContactInfo("gggggggggggggggggggg",R.drawable.img_09);
mList.add(card9);
}
}

浙公网安备 33010602011771号