Android滑动到顶部悬停

作者: peipeicn | 来源:发表于2016-09-13 20:58 被阅读6715次

    无图说卵,先上图

    jianshu-top.gif

    查阅资料后,发现网上大部分都是用这种方法实现的:
    多写一个和需要悬浮的部分一模一样的layout,先把浮动区域的可见性设置为gone。当浮动区域滑动到顶部的时候,就把浮动区域B的可见性设置为VISIBLE。这样看起来就像悬浮在顶部不动了。

    具体看下边文章 :

    高仿美团app,浮动layout滑动到顶部悬停效果

    Android实例-仿美团app,浮动layout滑动到顶部悬停效果

    这里介绍的是另外一种方式:

    使用design包中的控件

    <android.support.design.widget.CoordinatorLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        xmlns:tools="http://schemas.android.com/tools"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:fitsSystemWindows="true"
        tools:context="com.peipei.app.MainActivity">
    
        <android.support.design.widget.AppBarLayout
            android:layout_width="match_parent"
            android:layout_height="250dp">
        
            <android.support.design.widget.CollapsingToolbarLayout
                app:layout_scrollFlags="scroll"
                app:contentScrim="#000000"
                android:layout_width="match_parent"
                android:layout_height="220dp">
    
                <TextView
                    android:text="banner区域"
                    android:gravity="center"
                    android:textColor="#ffffff"
                    android:background="#987545"
                    android:layout_width="match_parent"
                    android:layout_height="220dp"/>
    
            </android.support.design.widget.CollapsingToolbarLayout>
    
            <TextView
                android:gravity="center"
                android:layout_width="match_parent"
                android:layout_height="30dp"
                android:text="悬浮的部分"/>
    
         </android.support.design.widget.AppBarLayout>
    
         <android.support.v4.widget.NestedScrollView
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                app:layout_behavior="@string/appbar_scrolling_view_behavior">
    
                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_margin="@dimen/text_margin"
                    android:text="@string/large_text"/>
    
          </android.support.v4.widget.NestedScrollView>
    
    </android.support.design.widget.CoordinatorLayout>
    

    实现步骤:

    1. 将需要悬浮的layout放到CollapsingToolbarLayout之外,AppBarLayout之内
    2. 将CollapsingToolbarLayout的app:layout_scrollFlags设置为scroll
    3. 给滚动的NestedScroolView设置
      app:layout_behavior="@String/appbar_scrolling_view_behavior"
      就大功告成了(记得根布局要是CoordinatorLayout)

    最终效果:

    damo-jianshu-top.gif

    相关文章

      网友评论

      • 26257f20415d:楼主 请教一个问题 就是网络数据成功回来后 5.0系统不能及时刷新界面 必须手指去点一下才能刷新处理 你知道怎么回事吗
      • f917f820cdc5:NestedScrollView 这里放viewpager,viewpager里面放 listview 是否可以用
        f917f820cdc5:已处理 可以用 谢谢楼主了。 用viewpager 需要给NestedScrollView加上
        android:fillViewport="true"
        android:layout_gravity="fill_vertical"
      • YbSTGing:大神还在不?使用这种方式滑动的时候很不顺畅,就是手指一动一点,上面的view动一点,没有那种滑上去的效果,有解决方法没有?如有回答,不胜感激!
        下位子:更新到最新版本
        YbSTGing:@peipeicn 没事。谢谢啦!哇塞,竟然弃坑了:grin:
        peipeicn:@YbSTGing 这个我已经好久没做安卓了,需要你自己琢磨了:sweat:
      • 6a317b483bf7:根据的作者的提供的内容 操着起来,过程坑不少。不知道其他人有没有遇到,我讲下根据这demo我遇到的坑。1.加载的类要只有继承AppCompatActivity,其他加载报错;2.声明的清单需要theme="@style/Theme.AppCompat" 的主题。望其他学习附参考
      • sankemao:这个方法fling的时候不流畅
      • 云上码农:请问:在HomeFragment 中如何实现这种效果呢?貌似只有在Activity中才可以使用 CoordinatorLayout
        peipeicn:@outlook2016 这个fragment没有试过,需要你自己去研究一下了,按道理来说只要在coordinatorlayout外边放置合适容器是可以的吧!
        云上码农:简书的搜索框悬浮应该也是写在 HomeFragment中的吧?
      • mecloud:这个源码是否分享给我,谢谢楼主。我先看一下您的实现。327239527@qq.com
        peipeicn:@mecloud https://github.com/peipei1024/scroll
        peipeicn:@mecloud 周一发你
      • 有酒和远方:你好 源码有么 ? 有些地方不懂啊
        有酒和远方:@peipeicn 谢谢啊 我准备用这个dome,真的很不错,找了很久都没有找到
        peipeicn:@画江湖之不良帅 那得等我下班回去找找了 不知道还在不在
      • 码圣:NestedScrollView换成ListView可不可以?
        Aaron96:@码圣 其实可以配套使用RecycleView的
        peipeicn:可以将listview放到nestedscrollview里边。然后处理下滚动冲突导致listview只显示一行问题。 过国庆了。没看简书
        peipeicn:不可以。
      • 捡淑:马克
        捡淑:@peipei1024 mark...你ID是不是暴露了你老司机的身份?
        peipeicn:@捡淑 ?

      本文标题:Android滑动到顶部悬停

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