本文主要介绍了 RecyclerView 的基础使用、下拉刷新、上拉加载。
1. 添加依赖
//Butter Knife
implementation "com.jakewharton:butterknife:$butterknife_version"
annotationProcessor "com.jakewharton:butterknife-compiler:$butterknife_version"
//TitleBar
implementation 'com.github.getActivity:TitleBar:8.6'
implementation 'com.github.bumptech.glide:glide:4.12.0'
implementation 'io.github.scwang90:refresh-layout-kernel:2.0.5' //核心必须依赖
implementation 'io.github.scwang90:refresh-header-classics:2.0.5' //经典刷新头
implementation 'io.github.scwang90:refresh-footer-classics:2.0.5' //经典加载
// RecyclerAdapter
implementation 'com.github.CymChad:BaseRecyclerViewAdapterHelper:3.0.4'
如果使用 AndroidX 在 gradle.properties 中添加:
android.useAndroidX=true
android.enableJetifier=true
注意:如果我们请求的 url 地址是 http,记得在清单文件中添加:
...
线性布局
1. 首先看下布局文件:
2. Activity 的代码如下:
public class LineActivity extends BaseActivity implements OnRefreshListener, OnLoadMoreListener {
@BindView(R.id.title_bar)
TitleBar mTitleBar;
@BindView(R.id.refreshLayout)
SmartRefreshLayout mRefreshLayout;
@BindView(R.id.recyclerView)
RecyclerView mRecyclerView;
private LineAdapter mAdapter;
@Override
protected int getLayoutId() {
return R.layout.activity_line;
}
@Override
protected void initView() {
mTitleBar.setOnTitleBarListener(new OnTitleBarListener() {
@Override
public void onLeftClick(View view) {
finish();
}
@Override
public void onTitleClick(View view) {
}
@Override
public void onRightClick(View view) {
}
});
initAdapter();
mRefreshLayout.setRefreshHeader(new ClassicsHeader(this));
mRefreshLayout.setRefreshFooter(new ClassicsFooter(this));
mRefreshLayout.setOnRefreshListener(this);
mRefreshLayout.setOnLoadMoreListener(this);
}
private void initAdapter() {
mAdapter = new LineAdapter(R.layout.item_line,getHomeItem());
mRecyclerView.setLayoutManager(new LinearLayoutManager(this));
mRecyclerView.setAdapter(mAdapter);
}
private List getHomeItem() {
List list = Arrays.asList(
new HomeBean("美女 1", ConstantValues.images[0]),
new HomeBean("美女 2", ConstantValues.images[1]),
new HomeBean("美女 3", ConstantValues.images[2]),
new HomeBean("美女 4", ConstantValues.images[3]),
new HomeBean("美女 5", ConstantValues.images[4]),
new HomeBean("美女 6", ConstantValues.images[5]),
new HomeBean("美女 7", ConstantValues.images[6])
);
List infos = new ArrayList(list);
return infos;
}
@Override
public void onRefresh(@NonNull RefreshLayout refreshLayout) {
mRefreshLayout.finishRefresh(2000);
}
@Override
public void onLoadMore(@NonNull RefreshLayout refreshLayout) {
mRefreshLayout.finishLoadMore(2000);
}
}
3. 接下来我们看 RecyclerView 的适配器:
public class LineAdapter extends BaseQuickAdapter {
public LineAdapter(int layoutResId, List data) {
super(layoutResId, data);
addChildClickViewIds(R.id.ll_line);
}
@Override
protected void convert(BaseViewHolder baseViewHolder, HomeBean homeBean) {
ImageView image = baseViewHolder.getView(R.id.iv_image);
Glide.with(MyApp.CONTEXT)
.load(homeBean.getUrl())
.into(image);
baseViewHolder.setText(R.id.tv_name,homeBean.getName());
}
}
4. 数据类:
public class HomeBean {
private String name;
private String url;
public HomeBean(String name, String url) {
this.name = name;
this.url = url;
}
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
public String getUrl() {
return url;
}
public void setUrl(String url) {
this.url = url;
}
}
网格布局
1. 首先看下布局文件:
2. Activity 的代码如下:
public class GridActivity extends BaseActivity implements OnRefreshListener, OnLoadMoreListener {
@BindView(R.id.title_bar)
TitleBar mTitleBar;
@BindView(R.id.refreshLayout)
SmartRefreshLayout mRefreshLayout;
@BindView(R.id.recyclerView)
RecyclerView mRecyclerView;
private GridAdapter mAdapter;
@Override
protected int getLayoutId() {
return R.layout.activity_grid;
}
@Override
protected void initView() {
mTitleBar.setOnTitleBarListener(new OnTitleBarListener() {
@Override
public void onLeftClick(View view) {
finish();
}
@Override
public void onTitleClick(View view) {
}
@Override
public void onRightClick(View view) {
}
});
initAdapter();
mRefreshLayout.setRefreshHeader(new ClassicsHeader(this));
mRefreshLayout.setRefreshFooter(new ClassicsFooter(this));
mRefreshLayout.setOnRefreshListener(this);
mRefreshLayout.setOnLoadMoreListener(this);
}
private void initAdapter() {
mAdapter = new GridAdapter(R.layout.item_grid,getHomeItem());
mRecyclerView.setLayoutManager(new GridLayoutManager(this,3,GridLayoutManager.VERTICAL,false));
mRecyclerView.setAdapter(mAdapter);
}
private List getHomeItem() {
List list = Arrays.asList(
new HomeBean("美女 1", ConstantValues.images[0]),
new HomeBean("美女 2", ConstantValues.images[1]),
new HomeBean("美女 3", ConstantValues.images[2]),
new HomeBean("美女 4", ConstantValues.images[3]),
new HomeBean("美女 5", ConstantValues.images[4]),
new HomeBean("美女 6", ConstantValues.images[5]),
new HomeBean("美女 7", ConstantValues.images[6])
);
List infos = new ArrayList(list);
return infos;
}
@Override
public void onRefresh(@NonNull RefreshLayout refreshLayout) {
mRefreshLayout.finishRefresh(2000);
}
@Override
public void onLoadMore(@NonNull RefreshLayout refreshLayout) {
mRefreshLayout.finishLoadMore(2000);
}
}
3. 接下来我们看 RecyclerView 的适配器:
public class GridAdapter extends BaseQuickAdapter {
public GridAdapter(int layoutResId, List data) {
super(layoutResId, data);
}
@Override
protected void convert(BaseViewHolder baseViewHolder, HomeBean homeBean) {
ImageView image = baseViewHolder.getView(R.id.iv_mv);
Glide.with(MyApp.CONTEXT)
.load(homeBean.getUrl())
.into(image);
}
}
瀑布流布局
1. 首先看下布局文件:
2. Activity 的代码如下:
public class StaggeredActivity extends BaseActivity implements OnRefreshListener, OnLoadMoreListener {
@BindView(R.id.title_bar)
TitleBar mTitleBar;
@BindView(R.id.refreshLayout)
SmartRefreshLayout mRefreshLayout;
@BindView(R.id.recyclerView)
RecyclerView mRecyclerView;
private StaggeredAdapter mAdapter;
@Override
protected int getLayoutId() {
return R.layout.activity_staggered;
}
@Override
protected void initView() {
mTitleBar.setOnTitleBarListener(new OnTitleBarListener() {
@Override
public void onLeftClick(View view) {
finish();
}
@Override
public void onTitleClick(View view) {
}
@Override
public void onRightClick(View view) {
}
});
initAdapter();
mRefreshLayout.setRefreshHeader(new ClassicsHeader(this));
mRefreshLayout.setRefreshFooter(new ClassicsFooter(this));
mRefreshLayout.setOnRefreshListener(this);
mRefreshLayout.setOnLoadMoreListener(this);
}
private void initAdapter() {
mAdapter = new StaggeredAdapter(R.layout.item_staggered,getHomeItem());
mRecyclerView.setLayoutManager(new StaggeredGridLayoutManager(2, StaggeredGridLayoutManager.VERTICAL));
mRecyclerView.setAdapter(mAdapter);
mRecyclerView.addItemDecoration(new GridSpaceItemDecoration(15,true));
mRecyclerView.setItemAnimator(new DefaultItemAnimator());
}
private List getHomeItem() {
List list = Arrays.asList(
new HomeBean("美女 1美女 1美女 1美女 1美女 1美女 1美女 1", ConstantValues.images[0]),
new HomeBean("美女 2美女 2美女 2美女 2美女 2美女 2", ConstantValues.images[1]),
new HomeBean("美女 3美女 3美女 3美女 3美女 3美女 3美女 3美女 3美女 3美女 3美女 3", ConstantValues.images[2]),
new HomeBean("美女 4美女 4美女 4美女 4", ConstantValues.images[3]),
new HomeBean("美女 5美女 5", ConstantValues.images[4]),
new HomeBean("美女 6", ConstantValues.images[5]),
new HomeBean("美女 7美女 5美女 5美女 5美女 5美女 5美女 5美女 5", ConstantValues.images[6])
);
List infos = new ArrayList(list);
return infos;
}
@Override
public void onRefresh(@NonNull RefreshLayout refreshLayout) {
mRefreshLayout.finishRefresh(2000);
}
@Override
public void onLoadMore(@NonNull RefreshLayout refreshLayout) {
mRefreshLayout.finishLoadMore(2000);
}
}
3. 接下来我们看 RecyclerView 的适配器:
public class StaggeredAdapter extends BaseQuickAdapter {
public StaggeredAdapter(int layoutResId, List data) {
super(layoutResId, data);
}
@Override
protected void convert(BaseViewHolder baseViewHolder, HomeBean homeBean) {
ImageView image = baseViewHolder.getView(R.id.iv_image);
Glide.with(MyApp.CONTEXT)
.load(homeBean.getUrl())
.into(image);
baseViewHolder.setText(R.id.tv_text,homeBean.getName());
}
}