Android开发教程类似淘宝首页标签滑动效果

Android开发教程类似淘宝首页标签滑动效果

滑动RecycleView，底部的进度条跟着滑动。

一、思路：

自定义HIndicator，横向滑动的指示器，做了基于recyclerView的联动[bindRecyclerView]，其余的需要自己适配

二、效果图：

三、关键代码：

class MainActivity : AppCompatActivity() {
    lateinit var context: Context
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        val rv_labels = findViewById<RecyclerView>(R.id.rv_labels)
        val hIndicator = findViewById<HIndicator>(R.id.hIndicator)
        hIndicator.bindRecyclerView(rv_labels)

        context = this

        val datas = mutableListOf<CateData>()
        datas.add(CateData(R.mipmap.icon1,"新品"))
        datas.add(CateData(R.mipmap.icon2,"爆款"))
        datas.add(CateData(R.mipmap.icon3,"农场"))
        datas.add(CateData(R.mipmap.icon4,"旅行"))
        datas.add(CateData(R.mipmap.icon5,"超市"))

        datas.add(CateData(R.mipmap.icon1,"新品1"))
        datas.add(CateData(R.mipmap.icon2,"爆款1"))
        datas.add(CateData(R.mipmap.icon3,"农场1"))
        datas.add(CateData(R.mipmap.icon4,"旅行1"))
        datas.add(CateData(R.mipmap.icon5,"超市1"))

        datas.add(CateData(R.mipmap.icon1,"新品2"))
        datas.add(CateData(R.mipmap.icon2,"爆款2"))
        datas.add(CateData(R.mipmap.icon3,"农场2"))
        datas.add(CateData(R.mipmap.icon4,"旅行2"))
        datas.add(CateData(R.mipmap.icon5,"超市2"))

        val adapter = CCatalogAdapter()

        rv_labels.adapter = adapter
        adapter.setNewInstance(datas)

        rv_labels.addItemDecoration(object : RecyclerView.ItemDecoration() {

            override fun getItemOffsets(
                outRect: Rect,
                view: View,
                parent: RecyclerView,
                state: RecyclerView.State
            ) {
                super.getItemOffsets(outRect, view, parent, state)
                outRect.bottom =dip2px(context, 15f)
                outRect.left = dip2px(context, 4f)
                outRect.right = dip2px(context, 4f)
            }
        })

    }


}

四、项目demo源码结构图

有问题或者需要完整源码demo的可以看简介联系我，也可以私信我，我每天都看私信的