仿拼多多搜索页面多列表联动

项目有类似的功能,在网上找了不少都不是很符合,结合起来自己做了一个,用2个recycleview就可以解决了。
主要是右边带动左边列表滚动,先看图吧:录制的不是很流畅,可以自己下下来看看


TIM图片20180905173437.gif

1.关键代码

private fun smoothMoveToPosition() {

    mShopRecyclerView.addOnScrollListener(object : RecyclerView.OnScrollListener() {
        override fun onScrolled(recyclerView: RecyclerView?, dx: Int, dy: Int) {
            super.onScrolled(recyclerView, dx, dy)

            if (mRightList[first].isHeader) {
                val view = mShopLinearLayoutManager.findViewByPosition(first)
                if (view != null) {
                    //如果此组名item顶部和父容器顶部距离大于等于title的高度,则设置偏移量
                    if (view.top >= tHeight) {
                        right_title.y = (view.top - tHeight).toFloat()
                    } else {
                        //否则不设置
                        right_title.y = 0f
                    }
                }
            }
            //因为每次滑动之后,右侧列表中可见的第一个item的position肯定会改变,并且右侧列表中可见的第一个item的position变换了之后,
            //才有可能改变右侧title的值,所以这个方法内的逻辑在右侧可见的第一个item的position改变之后一定会执行
            val firstPosition = mShopLinearLayoutManager.findFirstVisibleItemPosition()

            if (first != firstPosition && firstPosition >= 0) {

                //给First赋值
                first = firstPosition
                //不设置Y轴的偏移量
                right_title.y = 0f

                //判断如果右侧可见的第一个item是否是header,设置相应的值
                if (mRightList[first].isHeader) {
                    right_title.text = mRightList[first].header
                } else {
                    right_title.text = mRightList[first].t.name
                }
            }

            /**
             *遍历左边列表,列表对应的内容等于右边的title,则设置左侧对应的item高亮
             */
            mLeftList.forEachIndexed { index, s ->
                if (mLeftList[index] == right_title.text) {

                    mSearchLeftListQuickAdapter.selectItem(index)
                    moveToCenter(index)
                }
            }
            //如果右边最后一个完全显示的item的position,等于bean中最后一条数据的position(也就是右侧列表拉到底了),
            //则设置左侧列表最后一条item高亮
            if (mShopLinearLayoutManager.findLastCompletelyVisibleItemPosition() == mRightList.size - 1) {
                mSearchLeftListQuickAdapter.selectItem(mLeftList.size - 1)
                moveToCenter(mLeftList.size - 1)
            }
        }

        override fun onScrollStateChanged(recyclerView: RecyclerView?, newState: Int) {
            super.onScrollStateChanged(recyclerView, newState)
            //获取右侧title的高度
            tHeight = right_title.height
        }
    })

}
//将当前选中的item居中,如果不加这段代码,左边的recyclerview并不会跟随滚动
private fun moveToCenter(position: Int) {
    //将点击的position转换为当前屏幕上可见的item的位置以便于计算距离顶部的高度,从而进行移动居中
    val childAt = mSelectedRecyclerView.getChildAt(position - mLinearLayoutManager.findFirstVisibleItemPosition())
    if (childAt != null) {
        val y = childAt.top - mSelectedRecyclerView.height / 2
        mSelectedRecyclerView.smoothScrollBy(0, y)
    }

}

2.左边adapter里面关键代码

 fun selectItem(position: Int) {

    tv.forEachIndexed { index, _ ->
        if (position == index) {
            tv[index].setTextColor(ContextCompat.getColor(mContext, R.color.colorAccent))
            tv[index].setBackgroundColor(ContextCompat.getColor(mContext, R.color.colorPrimary))
        } else {
            tv[index].setTextColor(ContextCompat.getColor(mContext, R.color.colorPrimary))
            tv[index].setBackgroundColor(ContextCompat.getColor(mContext, R.color.colorAccent))
        }
    }
}

这里是循环添加adapter的TextView,因为如果循环的是数据的话,当你数据过多,那么就会有数组越界的问题,问题recycleview适配器一开始并没有那么加载出来那么多TextView,例如:一个屏幕只能看见12条数据,那么当你的数据超过12的时候一开始就会出错,循环tv就没有这个问题了。具体有需要的自己看代码吧。
参考:https://www.jianshu.com/p/82ced8707f2b
github:https://github.com/byning2012/RVandRv

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 215,794评论 6 498
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 92,050评论 3 391
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 161,587评论 0 351
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 57,861评论 1 290
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 66,901评论 6 388
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 50,898评论 1 295
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,832评论 3 416
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 38,617评论 0 271
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 45,077评论 1 308
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,349评论 2 331
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,483评论 1 345
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 35,199评论 5 341
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 40,824评论 3 325
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,442评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,632评论 1 268
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 47,474评论 2 368
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,393评论 2 352

推荐阅读更多精彩内容