前言
在上篇文章中，我们已经实现了AppbarLayout+双导航嵌套滑动效果，大家有兴趣的话，可以参看我的上篇文章
AppbarLayout+双导航嵌套滑动效果
那么今天就让我们来学习下AppBarLayout,SwipeRefreshLayout以及上拉加载控件组合的界面效果吧。
今天涉及内容：
- 要实现的效果
- 库依赖
- 代码实现
3.1 adapter适配器
3.2 activity中实现代码
3.3 activity对应布局代码 - 需要注意的点
- 如何实现整体下刷新效果？
- 滑动过程，如何实现大图跟随滑动显示和隐藏，而大图下的布局顶在标题栏下面不动？
-
SmartRefreshLayout外面为啥要包裹NestedScrollView? -
SmartRefreshLayout为上拉加载下拉刷新控件，如何做到只有上拉刷新功能，且在SwipeRefreshLayout下拉刷新的时候，刷新了SmartRefreshLayout包裹的RecyclerView的数据？ - 如何解决
AppBarLayout+NestedScrollView+RecyclerView滑动冲突问题？ - 如何解决
SwipeRefreshLayout和AppbarLayout滑动冲突?
- 效果图及项目结构图
先来波效果图吧
1.gif
一. 要实现的效果
下面简述下要实现的效果：
- 标题栏下有一张大图，在程序打开时会展现出来，但是界面向下滑的时候，图片会渐渐消失，然后当界面往上滑的时候，大图又会渐渐出来
- 大图下面有一个横向展示的布局，当界面不窜向下滑的时候，此布局会顶在标题栏下面不动，当界面往上滑的时候，此布局又会随着大图的出现，向下滑去
- 横向布局下是一个上拉加载更多的布局
- 整个界面除标题栏以外，均用
SwipeRefreshLayout布局包裹，当界面处在最上面的时候，下拉刷新可刷新整个加载更多布局的数据
二.库依赖
下拉刷新我用的是SwipeRefreshLayout，其库引用如下：
//swiperefreshlayout
implementation 'androidx.swiperefreshlayout:swiperefreshlayout:1.1.0'
上拉加载更多，我用的是SmartRefreshLayout，其库引用如下：
//SmartRefreshLayout
implementation 'com.scwang.smartrefresh:SmartRefreshLayout:1.1.0-x'
implementation 'com.scwang.smartrefresh:SmartRefreshHeader:1.1.0-x'
三. 代码实现
3.1 adapter适配器
在此布局中，我们肯定要使用到适配器展示数据的问题，然后我写了一个数据展示的适配器DefaultAdapter，下面给出DefaultAdapter代码：
public class DefaultAdapter extends RecyclerView.Adapter{
protected Context mContext;
protected View mLayoutView;
protected List mData;
public DefaultAdapter(Context context,Listdata){
this.mContext=context;
this.mData=data;
}
@NonNull
@Override
public RecyclerView.ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
mLayoutView= LayoutInflater.from(mContext).inflate(R.layout.item_one,parent,false);
ViewHolder viewHolder=new ViewHolder(mLayoutView);
return viewHolder;
}
@Override
public void onBindViewHolder(@NonNull RecyclerView.ViewHolder holder, int position) {
String name=mData.get(position).toString();
((ViewHolder)holder).mTvName.setText(name);
}
@Override
public int getItemCount() {
return mData==null?0:mData.size();
}
class ViewHolder extends RecyclerView.ViewHolder{
TextView mTvName;
public ViewHolder(View view) {
super(view);
mTvName=(TextView)view.findViewById(R.id.tv_text);
}
}
}
DefaultAdapter对应布局item_one.xml代码如下：
3.2 activity中实现代码
下面给出此效果在TempActivity中实现的代码：