开源控件DragTopLayout分析与使用指南

Github地址:
https://github.com/chenupt/DragTopLayout
最近项目重要用到这个效果,但是在RecyclerView和ViewPager结合使用的时候状态总是不对,我修改了上面的Demo中使用时的部分bug,并添加Viewpager+RecyclerView的使用范例:
https://github.com/maoranbian/ExtraDragTopLayout
增加的例子从主页右上角的菜单键点开,最后两个就是了,名称为ViewpagerRecyclerActivity和StripTabHideActivity。其中 ViewpagerRecyclerActivity更像新浪微博的个人主页,两个tab中的列表只要有一个达到顶部并使得topView展开,另一个tab中的列表自动滚动到第一条。 StripTabHideActivity将tab切换放在了topView里。


1. 知识预备

2.控件思路分析

  • 目标效果:豌豆荚主页效果,新浪微博个人主页的效果
  • 思路分析:整个View分为topView和contentView两部分,并且利用ViewDragHelper接管Touch事件,是否接管由一个标志性的boolean变量shouldIntercept决定,使得topView可以根据手势的滑动收缩Collapsed或者展开Expand,其中:
    1.topView收缩时:ViewDragHelper不接管Touch事件,由contentView自己处理。
    2.topView展开时:ViewDragHelper接管Touch事件,事件拦截,contentView不处理。
    3.状态的衔接:滑动过程中contentView中有监听滑动动作,保证对滑动到顶部的事件实时监听,
    比如调用方法:AttachUtil.isRecyclerViewAttach(recyclerView)
    并通过回调或者EventBus通信传递到使用该DragTopLayout的页面,可以对该控件的标志变量shouldIntercept进行实时更新,保证Touch事件有恰当的处理(根据各自的场景由ViewDragHelper或者contentView处理滑动)。
  • 存在的问题:主要bug点在于:
    1.tab点击选择页面时,如果页面是recyclerview点击时不会触发onscroll()所以不会更新点击事件托管状态。但是页面使用的是ListView或者GridView时点击tab后会触它们的发onscroll(),就触发了当前首条是否显示的状态传递,主页面收到了可能会误用,导致DragTopLayout的状态不对了。所以如果Fragment中使用的是recyclerview,需要在切换到该Fragment中获取recyclerView的状态来判断shouldIntercept。
    2.tab空间区域点击判断cotentView的问题,区域误判,场景误判。返回true的前提还有当前是托管状态。--加强判断条件
    3.一个tab页面滑到顶部联动第二tab页面个自动到顶部时,第二tab页面从很靠后位置滑动到顶部,切换tab的时候还未滑动完,导致topview的状态变化,因为这个方法引发onScroll;去掉耗时较长的动画滑动,将
    recyclerViewParent.smoothScrollToPosition(0);
    改为recyclerViewParent.getLayoutManager().scrollToPosition(0);

3.app使用中偶现问题

对偶现问题的调查-从代码角度;从现象角度--如何必现或尽最大可能重现
Q1:各分页面fagment各自滑动后点击tab切换,topview状态或者fragment的滑动状态不对。
Q2:实现新浪微博个人主页的效果,有一个页面滑动到顶部且引起topview显示后,另一个页面也滑动到顶部。
Q3:快速上下暴力滑动时topview没有收缩。
Q4:topView和contentView边缘临界滑动,topView不隐藏。
解决方法:
关键解决实时获取正确的指示变量并设置到页面的DragTopLayout实例中。

  • 内部修改:加强变量的判断。tryCaptureView中

// return child == dragContentView
// 修改原因:加强条件,dragContentView可以移动的前提也是shouldIntercept==true
return child == dragContentView && shouldIntercept;

  • 使用时注意:
    A1:tab的点击切换页面的时,同步更新控件的状态,只监听当前显示的页面的滑动:除了传递boolean的shouldIntercept,还要再传递boolean值的来源标志。
    A2:在状态监听中检测各个tab下列表滑动的状态,适当的条件下自动滑动到首条数据
    recyclerView.smoothScrollToPosition(0);
    改为recyclerView.getLayoutManager().scrollToPosition(0);
    A3:弄清异常状态的值,对异常状态调整。
    A4:临界状态,由contentView过渡到topView滑动时内部判断不准确,改为在使用的Activity中接收到的onEvent()或者回调接口中判断。

4.使用DragTopLayout的步骤:

1.在使用该DragTopLayout的主类里,步骤:

  • mDragLayout.listener(mPanelListener);  // 设定下拉刷新的对应动作,设定onPanelStateChanged改变时的动作,一定要设定的:// 有一个到顶部,其他都到顶部
  • 里面至少有两个Fragment,每个都需要绑定OnDragScrollListener,这里根据传来的状态和当前tab的名称确定TouchMode:mDragLayout.setTouchMode(shouldDelegateTouch);
  • 在点击tab切换时,需要updateDragTopStatus,根据当前显示的fragmentCurrent的状态,更新TouchMode:mDragLayout.setTouchMode(fragmentCurrent.getShouldDelegateTouch());

2.包含的Fragment:

  • 必须或者父类必须要继承自DragTopBaseFragment
  • 调用:setRecyclerView(mRecyclerView);这是DragTopBaseFragment的方法,mRecyclerView是该Fragment中的唯一的那个RecyclerView。
  • 在mRecyclerView绑定的onScroll中调用mOnDragScrollListener.onRecyclerScroll(recyclerView, TAG);将滑动状态透传给使用该DragTopLayout的主类

5.引用文档

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

推荐阅读更多精彩内容