自定义view–仿体育app,股票基金区块链APP 数据信息栏展示

自定义view–仿体育app,股票基金区块链APP 数据信息栏展示大家好,我是球迷杨指导,喜欢看各种篮球足球比赛,喜欢平时玩弄各种体育类APP,之前就发现了一个有趣的自定义view,很多场景都能通用 比如: 1.虎扑体育app 2.懂球帝APP 3.股票APP 4

1.png

大家好,我是球迷杨指导,喜欢看各种篮球足球比赛,喜欢平时玩弄各种体育类APP,之前就发现了一个有趣的自定义view,很多场景都能通用 比如:

1.虎扑体育app 2.懂球帝APP 3.股票APP 4.基金APP 5.区块链APP

下面上图

image.png

自定义view--仿体育app,股票基金区块链APP 数据信息栏展示自定义view--仿体育app,股票基金区块链APP 数据信息栏展示

以上是别人APP的效果图,下面我把我写的demo的效果图放出来

自定义view--仿体育app,股票基金区块链APP 数据信息栏展示自定义view--仿体育app,股票基金区块链APP 数据信息栏展示

从现在来看,这2个是可以一起联动的,当然,如果你根据你的需要,也是可以不设置联动

leftRecycler.addOnScrollListener(new RecyclerView.OnScrollListener() {
            @Override
            public void onScrollStateChanged(RecyclerView recyclerView, int newState) {
                super.onScrollStateChanged(recyclerView, newState);
            }
            @Override
            public void onScrolled(RecyclerView recyclerView, int dx, int dy) {
                super.onScrolled(recyclerView, dx, dy);
                if (RecyclerView.SCROLL_STATE_IDLE != recyclerView.getScrollState()) {
                    rightRecycler.scrollBy(dx, dy);
                }
            }
        });
        rightRecycler.addOnScrollListener(new RecyclerView.OnScrollListener() {
            @Override
            public void onScrollStateChanged(RecyclerView recyclerView, int newState) {
                super.onScrollStateChanged(recyclerView, newState);
            }
            @Override
            public void onScrolled(RecyclerView recyclerView, int dx, int dy) {
                super.onScrolled(recyclerView, dx, dy);
                if (RecyclerView.SCROLL_STATE_IDLE != recyclerView.getScrollState()) {
                    leftRecycler.scrollBy(dx, dy);
                }
            }
        });

思路分析

  • 1.根据虎扑的效果图可以看到,该页面主要是一个大列表(2个小列表)

  • 2.头部的tab栏可以水平滑动,或者整体水平滑动,所以父布局用 HorizontalScrollView 实现;

  • 3.列表 Item 分1部分 ,这里我用的是一排数据结果,所谓的各项分数

  • 4.头部 Tab 栏水平滑动时,列表 Item 同步滑动;

  • 5.ScrollView  跟 RecyclerView滑动冲突了

代码部分

1、自定义横向滚动控件

  • 因为上面已经分析,头部 Tab 栏父布局和 item 第二部分同步滑动,所以都采用横向滚动控件完成,所以自定义横向滚动控件,继承 HorizontalScrollView 并重写构造方法,这里重写了 3 个构造方法。
 * 自定义横向滚动控件
 * 重载了 onScrollChanged方法,监听每次的变化
 */

public class CustomHScrollView extends HorizontalScrollView {

    ScrollViewObserver mScrollViewObserver = new ScrollViewObserver();

    public CustomHScrollView(Context context) {
        super(context);
    }

    public CustomHScrollView(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public CustomHScrollView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }
}
  • 定义外部可回调接口,当发生了滚动事件时接口,供外部访问
    public void onScrollChanged(int l, int t, int oldl, int oldt);
}
  • 定义一个观察者,用于滑动控件时,接收水平滑动的回调。并定义添加滚动监听和移除滚动监听的方法。
     * 滚动观察者
     */
    public static class ScrollViewObserver {
        List<OnScrollChangedListener> mChangedListeners;

        public ScrollViewObserver() {
            super();
            mChangedListeners = new ArrayList<OnScrollChangedListener>();
        }
        //添加滚动事件监听
        public void AddOnScrollChangedListener(OnScrollChangedListener listener) {
            mChangedListeners.add(listener);
        }
        //移除滚动事件监听
        public void RemoveOnScrollChangedListener(OnScrollChangedListener listener) {
            mChangedListeners.remove(listener);
        }
        //回调
        public void NotifyOnScrollChanged(int l, int t, int oldl, int oldt) {
            if (mChangedListeners == null || mChangedListeners.size() == 0) {
                return;
            }
            for (int i = 0; i < mChangedListeners.size(); i++) {
                if (mChangedListeners.get(i) != null) {
                    mChangedListeners.get(i).onScrollChanged(l, t, oldl, oldt);
                }
            }
        }
    }

  • 因为父布局是水平滚动 HorizontalScrollView,所以需要重写 onScrollChanged()方法,监听滑动变化。当观察者 mScrollViewObserver 不为 null 时,滑动监听通知回调观察者 ScrollViewObserver。
protected void onScrollChanged(int l, int t, int oldl, int oldt) {
    //滚动时通知
    if (mScrollViewObserver != null) {
        mScrollViewObserver.NotifyOnScrollChanged(l, t, oldl, oldt);
    }
    super.onScrollChanged(l, t, oldl, oldt);
}

以上水平滚动 HorizontalScrollView 基本上已经完成,上面预留外部访问接口:OnScrollChangedListener,在 Tab 栏水平滑动时,可以在 Adapter 中获取滚动水平、垂直滚动位置,来设置 item 中第二部分控件位置。

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。
如需转载请保留出处:https://bianchenghao.cn/21711.html

(0)
编程小号编程小号

相关推荐

发表回复

您的电子邮箱地址不会被公开。 必填项已用*标注