轉載自:http://blog.csdn.net/gemgaozhen/article/details/52371082#comments

 
最近專案要實現如圖的效果，就是滑動的時候課程介紹那一欄到頂懸浮，而裡面的可滑動控制元件繼續滑動， 百度了好多，網上都是利用重寫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>

• 1
• 2
• 3
• 4
• 5
• 6
• 7
• 8
• 9
• 10
• 11
• 12
• 13
• 14
• 15
• 16
• 17
• 18
• 19
• 20
• 21
• 22
• 23
• 24
• 25
• 26
• 27
• 28
• 29
• 30
• 31
• 32
• 33
• 34
• 35
• 36
• 37
• 38
• 39
• 40
• 41
• 42
• 43
• 44
• 45
• 46
• 47
• 48
• 49
• 50
• 51
• 52
• 53
• 54
• 55
• 56
• 57
• 58
• 59
• 60
• 61
• 62
• 63
• 64
• 65
• 66
• 67
• 68
• 69
• 70
• 71
• 72
• 73
• 74
• 75
• 76
• 77
• 78
• 79
• 80
• 81
• 82
• 83
• 84
• 85
• 86
• 87
• 88
• 89
• 90
• 91
• 92
• 93
• 94
• 95
• 96
• 97
• 98

這裡是佈局檔案，最外層是CoordinatorLayout，然後滑動時候要隱藏的控制元件放CollapsingToolbarLayout裡面，NestedScrollView裡面放的是置頂後可滑動的控制元件，然後就可以實現效果了，就是這麼簡單。 
需要注意的有幾點： 
1.CollapsingToolbarLayout必須設定app:layout_scrollFlags=”scroll”，他才可以滑動。 
2.NestedScrollView必須設定app:layout_behavior這個屬性，他們才會聯動。 
3.NestedScrollView裡面如果巢狀listview等可滑動的佈局時要重寫listview的onmeasures方法（網上一大堆）。