8月4日学习笔记

最新推荐文章于 2025-06-23 20:11:13 发布

原创最新推荐文章于 2025-06-23 20:11:13 发布 · 423 阅读

0 ·

CC 4.0 BY-SA版权

每日学习标签专栏收录该内容

2 篇文章

订阅专栏

本文介绍了如何在Android应用中正确使用AppbarLayout实现ToolBar与内容视图的联动滚动效果。详细解释了如何配置scrollFlags属性及CoordinatorLayout的布局行为，以确保在不同屏幕尺寸和内容长度下都能获得良好的用户体验。

1.在使用AppbarLayout中的layout_srcollFlags时,设置成如下不管用:

<android.support.v7.widget.Toolbar
                android:id="@+id/toolBar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:background="@color/colorPrimary"
                android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
                app:layout_scrollFlags="scroll|enterAlways|snap"
                app:popupTheme="@style/ThemeOverlay.AppCompat.Light">

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

因为ToolBar包含在AppBarLayout中,而AppBarLayout被包含在CoordinatorLayout中,CoordinatorLayout会接受子类控件的滑动事件

<android.support.v4.widget.DrawerLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/drawerlayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.design.widget.CoordinatorLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <android.support.design.widget.AppBarLayout
            android:id="@+id/app_bar_layout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content">

            <android.support.v7.widget.Toolbar
                android:id="@+id/toolBar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:background="@color/colorPrimary"
                android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
                app:layout_scrollFlags="scroll|enterAlways|snap"
                app:popupTheme="@style/ThemeOverlay.AppCompat.Light">

            </android.support.v7.widget.Toolbar>
        </android.support.design.widget.AppBarLayout>

<!--如果用ListView,ToolBar设置的app:layout_scrollFlags="scroll|enterAlways|snap"会不起效果-->
        <!--<ListView-->
            <!--android:id="@+id/listview"-->
            <!--android:layout_width="match_parent"-->
            <!--android:layout_height="match_parent"-->
            <!--android:divider="@null"-->
            <!--app:layout_behavior="@string/appbar_scrolling_view_behavior"></ListView>-->
        <!---->
        <android.support.v7.widget.RecyclerView
            android:id="@+id/recycler_view"
            app:layout_behavior="@string/appbar_scrolling_view_behavior"
            android:layout_width="match_parent"
            android:layout_height="match_parent"></android.support.v7.widget.RecyclerView>


        <android.support.design.widget.FloatingActionButton
            android:id="@+id/fab"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom|end"
            android:layout_margin="15dp"
            android:src="@drawable/ic_right"/>

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

    <!--左侧菜单-->
    <android.support.design.widget.NavigationView

        android:id="@+id/nav_view"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        app:headerLayout="@layout/nav_header"
        app:menu="@menu/nav_menu">

    </android.support.design.widget.NavigationView>
</android.support.v4.widget.DrawerLayout>

2.在使用CoordinatorLayout的时候,因为CoordinatorLayout其实是个加强版的FrameLayout,如果将CoordinatorLayout作为主体内容的根控件的时候,如果还想要设置ToolBar,那么ToolBar会被遮挡住,这里就需要用到AppBarLayout,AppBarLayout实际上是一个垂直方向的LinearLayout,它在内部做了很多滚动事件的封装,使用了Material Design的设计理念,只需要在AppbarLayout下面的一个控件里加上这么一个属性

app:layout_behavior="@string/appbar_scrolling_view_behavior"

CoordinatorLayout会自动的将AppBarLayout放置在最顶端,然后再排布其他的控件

如果页面的主体内容比较长,我们又希望ToolBar能够参与进滚动的效果,我们就需要对ToolBar设置这样一个属性
app:layout_scrollFlags="scroll|enterAlways|snap"
关于更多 app:layout_scrollFlags 请参考 http://blog.youkuaiyun.com/qiaoyl113/article/details/65629024