本文介绍如何使用RecyclerView和CardView实现新闻卡片样式，并探讨SwipeRefreshLayout的集成应用，包括上拉加载更多和下拉刷新功能的具体实现。
学习来源
Material Design：利用RecyclerView CardView实现新闻卡片样式
截图
学习到的新知识
- CardView里面有三个属性：
android:foreground="?android:attr/selectableItemBackground"//波纹效果=》有边界
android:clickable="true" //cardView是否可点击,默认是不可点击的
app:cardCornerRadius="3dp" //圆角
app:cardElevation="8dp" //阴影- RecyclerView ===>
recyclerView.setHasFixedSize(true);
- setHasFixedSize()方法用来使RecyclerView保持固定的大小，该信息被用于自身的优化
- ImageView中
android:scaleType="centerCrop"表示所显示的图片如何缩放或移动以适应ImageView的大小 - 在RelativeLayout布局内的控件设置属性
android:layout_alignParentTop="true"控制该组件是否与布局容器顶端对齐android:layout_alignParentBottom="true"控制该组件是否与布局容器底端对齐android:layout_alignParentLeft="true"控制该组件是否与布局容器左边对齐android:layout_alignParentRight="true"控制该组件是否与布局容器右边对齐
News implements Serializable为了在Intent中能够直接传递News对象==》Key值- 如果主题使用
DarkActionBar
- 在
Mainifest中添加<activity android:name=".NewsActivity"android:parentActivityName=".MainActivity"></activity> - 那么在看新闻详细内容的时候在左上角有个返回按钮可以返回到之前的Activity
- 在
News类的构造方法是public News(String name, String age, int photoId)
- 所以添加数据的时候
private List<News> newsListnewsList = new ArrayList<>();newsList.add(new News((getString(R.string.news_one_title),getString(R.string.news_one_desc),R.mipmap.news_one))
RecyclerView+CardView+SwipeRefreshLayout===>学到的知识
- SwipeRefreshLayout是官方的下拉刷新控件 配合RecyclerView*使用
- RecyclerView的LayoutManger的一个方法详情请点击
/**
* 当我们滚动的时候，RecyclerView找不到可以重用的view了，它将创建一个新的，
* 因此在滑动到第二个feed的时候就会有一定的延时，
* 但是第二个feed之后的滚动是流畅的，因为这个时候RecyclerView已经有能重用的view
* 只需重写getExtraLayoutSpace()方法。
* getExtraLayoutSpace将返回LayoutManager应该预留的额外空间（显示范围之外，应该额外缓存的空间）
*/
final LinearLayoutManager layoutManager = new LinearLayoutManager(this){
protected int getExtraLayoutSpace(RecyclerView.State state) {
return 300;
}
};- swipeRefreshLayout的
setColorSchemeResources()设置进度条的颜色主题，最多设置四种 - swipeRefreshLayout的
setOnfreshListener方法跟OnClickLisenter方法一样可以多种方法实现
swipeRefreshWidget.setOnRefreshListener(new SwipeRefreshLayout.OnRefreshListener() {
//设置下拉监听 当用户下拉的时候会去执行回调
@Override
public void onRefresh() {//在该方法中进行网络请求最新数据
new Handler().postDelayed(new Runnable() {//postDelayed是3000ms(3秒)后调用Runnable内的
@Override
public void run() {
List<News> temp = new ArrayList<News>();
temp.add(new News(getString(R.string.news_one_title), getString(R.string.news_one_desc), R.drawable.presto));
temp.add(new News(getString(R.string.news_two_title), getString(R.string.news_two_desc), R.drawable.nmd));//下拉刷新添加的数据
adapter.addItem(temp);//调用PullMoreRecyclerAdapter中的方法==》实现新添加的数据添加到原数据的上面
swipeRefreshWidget.setRefreshing(false);//显示或者隐藏刷新进度条
Toast.makeText(MainActivity.this, "下拉更新的数据加载完毕...", Toast.LENGTH_SHORT).show();
}
}, 3000);
}
});- RecyclerView的上拉加载更多
//设置监听RecyclerView的滚动事件===>上拉加载更多
rv.addOnScrollListener(new RecyclerView.OnScrollListener() {
private int lastVisibleItem;
@Override
public void onScrollStateChanged(RecyclerView recyclerView, int newState) {
super.onScrollStateChanged(recyclerView, newState);
if (newState == RecyclerView.SCROLL_STATE_IDLE && lastVisibleItem + 1 ==
adapter.getItemCount()) {//进行判断
//调用PullMoreRecyclerAdapter中的setMoreStatusd方法
//改变load_more_status的数值 然后执行notifyDataSetChanged();
adapter.setMoreStatus(PullMoreRecyclerAdapter.LOADING_MORE);
new Handler().postDelayed(new Runnable() {
@Override
public void run() {
newsList.add(new News(getString(R.string.news_three_title), getString(R.string.news_three_desc), R.drawable.pro));
newsList.add(new News(getString(R.string.news_four_title), getString(R.string.news_four_desc), R.drawable.yeezy));//设置上拉加载的两个内容
adapter.setMoreStatus(PullMoreRecyclerAdapter.PULLUP_LOAD_MORE);
//adapter.notifyDataSetChanged();//去掉目测没有影响
}
}, 3000);
}
}
@Override
public void onScrolled(RecyclerView recyclerView, int dx, int dy) {
super.onScrolled(recyclerView, dx, dy);
lastVisibleItem = layoutManager.findLastVisibleItemPosition();//findLastVisibleItemPosition是LinearlayoutManager的一个方法
//用来查找屏幕当前的最后一个条目
}
});- PullMoreRecyclerAdapter的源码
public class PullMoreRecyclerAdapter extends RecyclerView.Adapter<RecyclerView.ViewHolder>{
private static final int TYPE_NORMAL_ITEM = 0; //普通Item
private static final int TYPE_FOOTER_ITEM = 1; //底部FooterView
//上拉加载更多
public static final int PULLUP_LOAD_MORE = 0;
//正在加载中
public static final int LOADING_MORE = 1;
//默认为0
private int load_more_status = 0;
public List<News> list;
public Context context;
public PullMoreRecyclerAdapter(List<News> list,Context context) {
this.list = list;
this.context = context;
}
//创建新View，被LayoutManager所调用
@Override
public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup viewGroup, int viewType) {
//如果viewType是普通item返回普通的布局，否则是底部布局并返回
if (viewType == TYPE_NORMAL_ITEM) {
View view = LayoutInflater.from(viewGroup.getContext()).inflate(R.layout
.news_item, viewGroup, false);
//可以做一些属性设置 甚至事件监听绑定
final NormalItmeViewHolder vh = new NormalItmeViewHolder(view);
return vh;
} else {
View view = LayoutInflater.from(viewGroup.getContext()).inflate(R.layout
.activity_footer, viewGroup, false);
//可以做一些属性设置 甚至事件监听绑定
FooterViewHolder vh = new FooterViewHolder(view);
return vh;
}
}
//将数据与界面进行绑定的操作
@Override
public void onBindViewHolder(RecyclerView.ViewHolder viewHolder, final int position) {
if (viewHolder instanceof NormalItmeViewHolder) {
((NormalItmeViewHolder) viewHolder).news_title.setText(list.get(position).getTitle());
((NormalItmeViewHolder) viewHolder).news_desc.setText(list.get(position).getDesc());
((NormalItmeViewHolder) viewHolder).news_photo.setImageResource(list.get(position).getPhotoId());
((NormalItmeViewHolder) viewHolder).share.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Intent intent=new Intent(Intent.ACTION_SEND);
intent.setType("text/plain");
intent.putExtra(Intent.EXTRA_SUBJECT, "分享");
intent.putExtra(Intent.EXTRA_TEXT, list.get(position).getDesc());
intent.setFlags(Intent.FLAG_ACTIVITY_NEW_TASK);
context.startActivity(Intent.createChooser(intent, list.get(position).getTitle()));
}
});
((NormalItmeViewHolder) viewHolder).readMore.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Intent intent=new Intent(context,NewsActivity.class);
intent.putExtra("News",list.get(position));
context.startActivity(intent);
}
});
} else if (viewHolder instanceof FooterViewHolder) {
FooterViewHolder footViewHolder = (FooterViewHolder) viewHolder;
switch (load_more_status) {
case PULLUP_LOAD_MORE:
footViewHolder.foot_view_item_tv.setText("上拉加载更多");
footViewHolder.foot_view_item_tv.setVisibility(View.VISIBLE);
footViewHolder.pb.setVisibility(View.GONE);
break;
case LOADING_MORE:
footViewHolder.foot_view_item_tv.setText("正在加载更多数据...");
//footViewHolder.foot_view_item_tv.setVisibility(View.GONE);
footViewHolder.pb.setVisibility(View.VISIBLE);
break;
}
}
}
@Override
public int getItemCount() {
//+1是在原来的基础上 增加一项底部的加载布局
return list.size() + 1;
}
//得到布局类型
public int getItemViewType(int position) {
// 如果position+1等于整个布局所有数总和就是底部布局
if (position + 1 == getItemCount()) {
return TYPE_FOOTER_ITEM;//加载footerview
} else {
return TYPE_NORMAL_ITEM;
}
}
//自定义的ViewHolder，持有每个Item的的所有界面元素
public static class NormalItmeViewHolder extends RecyclerView.ViewHolder {
CardView cardView;
ImageView news_photo;
TextView news_title;
TextView news_desc;
Button share;
Button readMore;
public NormalItmeViewHolder(View itemView) {
super(itemView);
cardView= (CardView) itemView.findViewById(R.id.card_view);
news_photo= (ImageView) itemView.findViewById(R.id.news_photo);
news_title= (TextView) itemView.findViewById(R.id.news_title);
news_desc= (TextView) itemView.findViewById(R.id.news_desc);
share= (Button) itemView.findViewById(R.id.btn_share);
readMore= (Button) itemView.findViewById(R.id.btn_more);
//设置TextView背景为半透明
news_title.setBackgroundColor(Color.argb(20, 0, 0, 0));
}
}
/**
* 底部FooterView布局
*/
public static class FooterViewHolder extends RecyclerView.ViewHolder {
public TextView foot_view_item_tv;
public ProgressBar pb;
public FooterViewHolder(View view) {
super(view);
pb = (ProgressBar) view.findViewById(R.id.progress_view);
foot_view_item_tv = (TextView) view.findViewById(R.id.tv_content);
}
}
public void setMoreStatus(int status){
load_more_status=status;
notifyDataSetChanged();//取消不会有上拉加载的动画效果
//notifyDataSetChanged方法通过一个外部的方法控制如果适配器的内容改变时需要强制调用getView来刷新每个Item的内容。
}
public void addItem(List<News> newDatas){//为了让下拉刷新增加的内容添加到原来内容的前面
newDatas.addAll(list);
list.removeAll(list);
list.addAll(newDatas);
notifyDataSetChanged();
}
}Github地址
如果以上解释有错误的帮忙指出 谢谢了 ==》共同学习
需要解决点击ReadMore后再退出 之前加载的内容就消失了 有谁知道？帮个忙！
扫一扫
4229
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
