Android 滑动悬浮置顶效果的新实现

来源：互联网发布：淘宝联盟分享优惠券编辑：程序博客网时间：2024/05/29 07:18

如图效果
最近项目要实现如图的效果，就是滑动的时候课程介绍那一栏到顶悬浮，而里面的可滑动控件继续滑动，百度了好多，网上都是利用重写scrollview滑动的监听，来隐藏和显示某一个控件来实现的，通过这个方法实现的滑动不是很流畅，于是我决定用最新的material design来实现这个效果。废话不多说，直接上代码：

<?xml version="1.0" encoding="utf-8"?><!--android:background="#ffffff"--><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:id="@+id/cotainer"    android:layout_width="fill_parent"    android:layout_height="match_parent"    android:background="#ffffff"    android:fitsSystemWindows="true"    android:orientation="vertical">    <!-- 第一部分:CoordinatorLayout -->    <android.support.design.widget.CoordinatorLayout        xmlns:app="http://schemas.android.com/apk/res-auto"        android:id="@+id/scrollview"        android:layout_width="fill_parent"        android:layout_height="match_parent"        android:background="#ffffff"        >        <!-- 第二部分:缩放控件-->        <android.support.design.widget.AppBarLayout            android:id="@+id/id_appbarlayout"            android:layout_width="match_parent"            android:layout_height="wrap_content">            <android.support.design.widget.CollapsingToolbarLayout                android:id="@+id/collapsing_tool_bar_test_ctl"                android:layout_width="match_parent"                android:layout_height="match_parent"                android:fitsSystemWindows="true"                app:contentScrim="?attr/colorPrimary"                app:expandedTitleMarginEnd="64dp"                app:expandedTitleMarginStart="48dp"                app:layout_scrollFlags="scroll">                <RelativeLayout                    android:id="@+id/userScroreRe"                    android:layout_width="match_parent"                    android:layout_height="240dp"                    android:background="#f00"                    app:layout_scrollFlags="enterAlwaysCollapsed">                </RelativeLayout>            </android.support.design.widget.CollapsingToolbarLayout>                <LinearLayout                    android:layout_width="fill_parent"                    android:layout_height="wrap_content"                    android:orientation="horizontal">                    <RadioGroup                        android:id="@+id/radioGroup"                        android:layout_width="fill_parent"                        android:layout_height="50dip"                        android:gravity="center"                        android:orientation="horizontal" />                </LinearLayout>        </android.support.design.widget.AppBarLayout>        <!-- 第三部分:Your Scroll View-->        <android.support.v4.widget.NestedScrollView            android:id="@+id/myMainScrollView"            android:layout_width="match_parent"            android:layout_height="match_parent"            android:overScrollMode="always"            app:layout_behavior="@string/appbar_scrolling_view_behavior">            <!--- app:layout_behavior="@string/appbar_scrolling_view_behavior"-->            <LinearLayout                android:id="@+id/mainLinearLayout"                android:layout_width="match_parent"                android:layout_height="wrap_content"                android:orientation="vertical">                <TextView                    android:layout_width="50dp"                    android:layout_height="match_parent"                    android:layout_gravity="center"                    android:text="测试gem测试测试测试测试测试测试测试测试测试测测试测试测试测试测试测试测试测试测试测测试测试测试测试测试测试测试测试测试测测试测试测试测试测试测试测试测试测试测测试测试测试测试测试测试测试测试测试测测试测试测试测试测试测试测试测试测试测测试测试测试测试测试测试测试测试测试测测试测试测试测试测试测试测试测试测试测试测试测试"                     />                <!--<FrameLayout-->                <!--android:id="@+id/myFrameContainer"-->                <!--android:layout_width="match_parent"-->                <!--android:layout_height="fill_parent"></FrameLayout>-->            </LinearLayout>        </android.support.v4.widget.NestedScrollView>    </android.support.design.widget.CoordinatorLayout></LinearLayout>

这里是布局文件，最外层是CoordinatorLayout，然后滑动时候要隐藏的控件放CollapsingToolbarLayout里面，NestedScrollView里面放的是置顶后可滑动的控件，然后就可以实现效果了，就是这么简单。
需要注意的有几点：
1.CollapsingToolbarLayout必须设置app:layout_scrollFlags=”scroll”，他才可以滑动。
2.NestedScrollView必须设置app:layout_behavior这个属性，他们才会联动。
3.NestedScrollView里面如果嵌套listview等可滑动的布局时要重写listview的onmeasures方法（网上一大堆）。

demo下载

8 0