ToolBar的滚动展开和收缩

ToolBar是 Material Designer 风格，在 5.0 系统新出的特性，用来代替 ActionBar。为了
兼容低版本，在使用的时候选择v7版本的.

ToolBar 作为 ActionBar使用

compile ‘com.android.support:design:25+’

        //模式设置为noActionBar
        mToolBar.setTitle("ToolBar");
        //将toolBar设置为actionBar
        setSupportActionBar(mToolBar);
        //为true,显示返回按钮
        getSupportActionBar().setDisplayHomeAsUpEnabled(false);

ToolBar 和 DrawerLayout 配合使用，实现左侧菜单的切换

        // 显示ToolBar左侧按钮

        // 将toggle开关放入toolbar
        mDrawerToggle = new ActionBarDrawerToggle(this, mDrawerLayout, toolbar, 
            R.string.drawer_open, R.string.drawer_close);

        //显示关闭图标，箭头为打开图标
        mDrawerToggle.syncState();
        //监听toggle状态，并改变图标
        mDrawerLayout.setDrawerListener(mDrawerToggle);

Material Designer 风格滚动的 ToolBar

想实现这样的效果，只有 ToolBar 是远远不够的。

至少还需要这些：
1. 必须CoordinatorLayout作为外层布局
2. AppBarLyaout作为父布局
3. 必须关联的view必须是可以滚动的View

CoordinatorLayout作为外层布局

这里写图片描述

CoordinatorLayout 是 ViewGroup 的子类，并实现了 NestedScrollingParent 接口。主要用作视图协调子视图的行为。

AppBarLyaout作为父布局

这里写图片描述
AppBarLayout是垂直的LinearLayout。子类通过 app:layout_scrollFlags 属性提供滚动行为。只有在 CoordinatorLayout

作为 AppBarLayout的外层视图时，AppBarLayout才会监听子类的滚动。如果它的父类不是 CoordinatorLayout ,它就是垂

直的LinearLayout.

关联的view必须是可以滚动的view。

必须是外部View，有 app:layout_behavior 属性，这个属性是将关联view的滚动行为反馈给CoordinatorLayout，由CoordinatorLayout 协调它与 AppBarLayout 的滚动。

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.design.widget.AppBarLayout
        android:id="@+id/app_bar"
        android:layout_width="match_parent"
        android:layout_height="100dp"
        android:gravity="bottom"
        app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">


            <android.support.v7.widget.Toolbar
                android:id="@+id/tool_bar"
                app:collapsedTitleGravity="center"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                app:layout_collapseMode="pin"
                android:minHeight="30dp"
                app:layout_scrollFlags="scroll|enterAlways|enterAlwaysCollapsed"
                app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
                app:title=""/>

        <!--</android.support.design.widget.CollapsingToolbarLayout>-->
    </android.support.design.widget.AppBarLayout>

    <android.support.v7.widget.RecyclerView
        android:id="@+id/recycler_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:layout_behavior="@string/appbar_scrolling_view_behavior"/>
</android.support.design.widget.CoordinatorLayout>

这样，就可以支持普通的滚动了。

当然如果想要更炫的效果，可以在让 CollapsingToolbarLayout 作为 AppBarLayout 的

父布局，CollapsingToolbarLayout 只能作为 CoordinatorLayout 的直接子视图。CollapsingToolbarLayout 是实现滚动

细节的视图，比如：工具栏的颜色，状态栏的颜色等等。

也可以自定义Behavior。

ToolBar的滚动展开和收缩

猜你喜欢