Android开发丶MaterialDesign实战のCardViewRecyclerView实现炫酷列表页
在RecyclerView的基础上,使用MaterialDesign控件CardView实现炫酷的列表栏
实现效果:
实现步骤
1.在build.gradle里面添加依赖
recyclerView
cardView
2.在主界面的XML文件中设置RecyclerView控件
<android.support.v7.widget.RecyclerView
android:id= “@+id/main_rv”
android:width= “match_parent”
android:height= “200dp”
/>
3.新建一个Bean文件
public class HeroBean(){
private int banner;
private String name;
public HeroBean(int banner, String name){
super();
this.banner= banner;
this.name= name;
}
public int getBanner(){
return banner;
}
public void setBanner(int banner){
this.banner= banner;
}
public String getName(){
return name;
}
public void setName(String name){
this.name= name;
}
}
4.编辑列表的item布局item_main.xml
1)最外层嵌套CardView
2)调整一下间距,此处注意不用设置marginbottom距离底部的距离,因为每个item下面item的marginTop的关系,所以要是设置了marginbottom会重叠高度
<android.support.v7.widget.CardView
android:marginLeft= “10dp”
android:marginTop= “10dp”
android:marginRight= “10dp”
app:cardCornerRadius= “10dp”
app:elevation= “5dp”>
<LinearLayout
android:width= “match_parent”
android:height= “match_parent”
android:oritention=”vertical”>
<ImageView
android:id= ”@+id/item_iv”
android:width= “match_parent”
android:height= “match_parent”/>
<TextView
android:id= “@+id/item_tv”
android:width= “wrap_content”
android:height= “wrap_content”
android:padding= “5dp”
/>
</LinearLayout>
</android.support.v7.widget.CardView>
5.编写RecyclerView的适配器HeroAdapter.java
public HeroAdapter extends RecyclerView.Adapter<HeroAdapter.ViewHolder>{
static class HeroAdapter extends RecyclerView.ViewHolder{
public ViewHolder(View itemView){
super(itemView);
iv= (ImageView)itemView.findViewById(R.id.item_iv);
tv= (TextView))itemView.findViewById(R.id.item_tv);
}
}
public HeroAdapter(List<Hero> heroList){
mHeroList= heroList;
}
public HeroAdapter.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType){
View view= LayoutInflater.from(parent.getContext()).inflate(R.layout.item_main, parent, false);
ViewHolder viewHolder= new ViewHolder(view);
return viewHolder;
}
public void onBindViewHolder(HeroAdapter.ViewHolder holder, int position){
Hero hero= mHeroList.get(position);
holder.iv.setImageResource(hero.getBanner());
holder.tv.setText(hero.getName());
}
public int getItemCount(){
return mHeroList.size();
}
}
6.编辑目标活动Activity文件MainActivity.java
public MainActivity extends AppCompatActivity{
private List<Hero> heroList= new ArrayList<>();
protected void OnCreate(Bundle savedInstance){
super.onCreate(savedInstance);
setContentView(R.layout.activity_main);
recyclerView=(RecyclerView) findViewById(R.id.main_recyclerView);
initData();
LinearLayoutManager manager= new LinearLayoutManager(this);
HeroAdapter adapter= new HeroAdapter(heroList);
recyclerView.setLayoutManager(manager);
recyclerView.setAdapter(adapter);
}
public void initData(){
for(int i= 0; i< 9; i++){
Hero hero1= new Hero(“真田幸村”, R.drawable.zhentianxingcun);
heroList.add(hero1);
Hero hero2= new Hero(“织田信长”, R.drawable.zhitianxinchang);
heroList.add(hero2);
Hero hero3= new Hero(“本多忠胜”, R.drawable.benduozhongsheng);
heroList.add(hero3);
Hero hero4= new Hero(“明智光秀”, R.drawable.mingzhiguangxiu);
heroList.add(hero4);
Hero hero5= new Hero(“猿飞佐助”, R.drawable.yaunfeizuozhu);
heroList.add(hero5);
}
}
}
7.设置RecyclerView的点击事件
由于RecyclerView不同于ListView,不能直接设置点击事件,因此该处要通过接口回调的方式来实现item的点击监听。
实现效果:
实现步骤:
1.打开适配器HeroAdapter.java
新建OnItemClickListener接口
public interface onItemClickListener{
void onItemClick(View view, int position);
}
2.新建setOnItemClickListener监听
public void setOnItemClickListener(onItemClickListener mOnItemClickListener){
this.mOnItemClickListener= mOnItemClickListener;
}
3.在适配器里的onBindViewHolder方法里
if(mOnItemClickListener!= null){
holder.itemView.setOnClickListener(new View.OnClickListener(){
@Override
public void onClick(View view){
int position= holder.getLayoutPosition();
mOnItemClickListener.onItemClick(holder.item.position);
}
});
}
4.在目标Activity里面调取适配器HeroAdapter里的接口
heroAdapter.setOnItemClickListener(new View.OnItemClickListener()){
@Override
public void OnItemClick(View view, int position){
Toast.makeText(MainActivity.this,
heroList.get(position).getName(), LENGTH_SHORT).show();
}
}
DEMO下载地址:
http://download.****.net/download/u014078990/9963185