美文网首页
Android 使用三个Reyclerview 实现表格布局,支

Android 使用三个Reyclerview 实现表格布局,支

作者: 因为我的心 | 来源:发表于2023-09-05 18:17 被阅读0次

一、前言:

这个案例是通过子条目item为recycleview实现多条目联动,使得recycleview支持横向和纵向滑动

话不多说 ,先上Demo演示

6c26d9b4261e8f88dcbb1b7d8a98710.png

https://img.haomeiwen.com/i13893207/ba2949a2f5bca579.gif?imageMogr2/auto-orient/strip|imageView2/2/w/325/format/webp

Demo代码:https://github.com/LgSecret/Linkagelayout

此Demo实现效果就是这种,基本无嵌套。摆脱使用HorizontalScrollView 嵌套横向数据过多而导致的性能问题,自测demo数据横向50条 纵向150条都很丝滑,并且支持内部recycleview自定义多布局实现复杂布局效果。

备用gitee地址:

二、分析

1、下面是Demo布局

图片.png

上下滑动整体是一个recycleview 可以直接实现,而左右滑动联动头部一起滑动就是我们要解决的问题,为了避免嵌套解决性能问题,此demo采用了子条目为recycleview 横向滑动 然后联动其它条目 还有头部列表一起滑动策略。

2、接下来贴出关键实现联动代码

 //多条recycleview联动
    public void initRecyclerView(RecyclerView recyclerView) {
        recyclerView.setHasFixedSize(true);
        //为每一个recycleview创建layoutManager
        LinearLayoutManager layoutManager = (LinearLayoutManager) recyclerView.getLayoutManager();
        //todo
        // 通过移动layoutManager来实现列表滑动  此行是让新加载的item条目保持跟已经滑动的recycleview位置保持一致
        // 也就是上拉加载更多的时候  保证新加载出来的item 跟已经滑动的item位置保持一致
        if (layoutManager != null && firstPos > 0 && firstOffset > 0) {
            layoutManager.scrollToPositionWithOffset(firstPos + 1, firstOffset);
        }
        // 添加所有的 recyclerView
        observerList.add(recyclerView);
        //当触摸条目的时候 停止滑动
        recyclerView.setOnTouchListener(new View.OnTouchListener() {
            @Override
            public boolean onTouch(View view, MotionEvent motionEvent) {
                switch (motionEvent.getAction()) {
                    case MotionEvent.ACTION_DOWN:
                    case MotionEvent.ACTION_POINTER_DOWN:
                        for (RecyclerView rv : observerList) {
                            rv.stopScroll();
                        }
                }
                return false;
            }
        });
        //添加当前滑动recycleview的滑动监听
        recyclerView.addOnScrollListener(new RecyclerView.OnScrollListener() {
            @Override
            public void onScrolled(RecyclerView recyclerView, int dx, int dy) {
                super.onScrolled(recyclerView, dx, dy);
                LinearLayoutManager linearLayoutManager = (LinearLayoutManager) recyclerView.getLayoutManager();
                //获取显示第一个item的位置
                int firstPos1 = linearLayoutManager.findFirstVisibleItemPosition();
                View firstVisibleItem = linearLayoutManager.getChildAt(0);
                if (firstVisibleItem != null) {
                    //获取第一个item的偏移量
                    int firstRight = linearLayoutManager.getDecoratedRight(firstVisibleItem);
                    //遍历其它的所有的recycleview条目
                    for (RecyclerView rv : observerList) {
                        if (recyclerView != rv) {
                            LinearLayoutManager layoutManager = (LinearLayoutManager) rv.getLayoutManager();
                            if (layoutManager != null) {
                                firstPos = firstPos1;
                                firstOffset = firstRight;
                                //通过当前显示item的位置和偏移量的位置来置顶recycleview 也就是同步其它item的移动距离
                                layoutManager.scrollToPositionWithOffset(firstPos + 1, firstRight);
                            }
                        }
                    }
                }
            }

            @Override
            public void onScrollStateChanged(RecyclerView recyclerView, int newState) {
                super.onScrollStateChanged(recyclerView, newState);
            }
        });
    }

上方的代码还有注释已经很好的解释了如何进行多个recycleview进行联动的方式,主要还是通过

 layoutManager.scrollToPositionWithOffset(firstPos + 1, firstRight);

此方法来实现其它recycleview进行联动 并且联动上方的recycleview

整体思路就是子条目的横向滑动来联动其它条目同步滑动,从而解决整体滑动的问题,避免嵌套HorizontalScrollView 从而提高性能问题。


参考地址:https://www.jianshu.com/p/8df9f0600f27

相关文章

  • Android 使用三个Reyclerview 实现表格布局,支

    这个案例是通过子条目item为recycleview实现多条目联动,使得recycleview支持横向和纵向滑动 ...

  • 基础布局

    Android中的布局 线性布局:LinerLayout 表格布局:TableLayout 相对布局:Relati...

  • Android 六大基本布局

    1.android 六大基本布局: 线性布局LinearLayou、相对布局RelativeLayout、表格布局...

  • Android学习日记

    Day 11 Title 1:UI布局之帧布局、表格布局 android:layout_gravity=""//当...

  • 2019-03-15

    实验内容:关于线性布局、约束布局及表格布局的使用 主要代码: 主界面: 线性布局: 约束布局: 表格布局: 截图:...

  • 前端如何实现表格布局

    实现效果 详细实现思路 表格整体布局为:五行四列,部分单元格占据多行或者多列。表格的标题是使用caption标签,...

  • Android 常见布局

    基本理论 Android六大基本布局分别是:线性布局LinearLayout、表格布局TableLayout、相对...

  • Android FlowLayout 流式布局

    FlowLayout 流式布局 Android 流式布局控件,实现自动换行,操出范围可以滑动功能,未使用控件复用功...

  • Android的reyclerView的基本使用

    自Android 5.0之后,谷歌公司推出了RecylerView控件,RecylerView,我想看到一个新名词...

  • TableLayout 表格布局管理器

    表格布局与常见的表格类似,以行列的形式来管理放入其中的组件,表格布局使用TableLayout的形式进行定义。表格...

网友评论

      本文标题:Android 使用三个Reyclerview 实现表格布局,支

      本文链接:https://www.haomeiwen.com/subject/evphvdtx.html