1. 程式人生 > >android 頂部懸停摺疊CoordinatorLayout,AppBarLayout

android 頂部懸停摺疊CoordinatorLayout,AppBarLayout

MaterialDesign5.0 中 CoordinatorLayout 和 AppBarLayout

來製作懸停效果佈局 。

先看下栗子

實現很簡單

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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:orientation="vertical"
    tools:context="com.example.administrator.exampletest.MainActivity">
    <android.support.design.widget.CoordinatorLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <android.support.design.widget.AppBarLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:fitsSystemWindows="true"
            >
            <!--
               appbarlayout 中  只要標記有
               app:layout_scrollFlags="scroll"
               在下部的監聽滾動控制元件  上拉時會自動的收縮標記的內容
               如果不標記的  則會懸停在頂部
            -->

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="vertical"
                app:layout_scrollFlags="scroll"
                >
                <ImageView
                    android:src="@mipmap/ic_launcher_round"
                    android:layout_width="wrap_content"
                    android:layout_height="25dp" />
                <ImageView
                    android:src="@mipmap/ic_launcher_round"
                    android:layout_width="wrap_content"
                    android:layout_height="25dp" />
                <ImageView
                    android:src="@mipmap/ic_launcher_round"
                    android:layout_width="wrap_content"
                    android:layout_height="25dp" />
            </LinearLayout>

            <View
                android:layout_width="match_parent"
                android:layout_height="0.5dp"
                android:background="#f0f"
                app:layout_scrollFlags="scroll"
                ></View>


            <TextView
                android:background="#a3e2f6"
                android:text="我是懸停的那個控制元件哦"
                android:gravity="center"
                android:layout_margin="10dp"
                android:layout_width="match_parent"
                android:layout_height="20dp" />
        </android.support.design.widget.AppBarLayout>


        <android.support.v7.widget.RecyclerView
            android:id="@+id/rv"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:layout_behavior="@string/appbar_scrolling_view_behavior"
            >
            <!--
                需要監聽滾動的控制元件
                app:layout_behavior="@string/appbar_scrolling_view_behavior"

             -->

        </android.support.v7.widget.RecyclerView>

    </android.support.design.widget.CoordinatorLayout>
</LinearLayout>

佈局檔案使用

CoordinatorLayout

標明內部需要監聽事件

AppBarLayout

標記需要摺疊的佈局 

在需要摺疊佈局中 標註

app:layout_scrollFlags="scroll"

需要在頂部停留的控制元件  就直接寫就行了。

在需要監聽滑動觸發摺疊的控制元件上 標註

app:layout_behavior="@string/appbar_scrolling_view_behavior"

簡單實現就醬紫

小栗子

我是小栗子