您当前的位置: 首页 >  ui

Kevin-Dev

暂无认证

  • 0浏览

    0关注

    544博文

    0收益

  • 0浏览

    0点赞

    0打赏

    0留言

私信
关注
热门博文

【Android -- UI 开发】RecyclerView 的基本使用

Kevin-Dev 发布时间:2021-07-15 10:57:39 ,浏览量:0

在这里插入图片描述 本文主要介绍了 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());
    }
}

关注
打赏
1658837700
查看更多评论
立即登录/注册

微信扫码登录

2.1021s