Android Material风格的应用(五)--CollapsingToolbar

Collapsing Toolbar

Android Material风格的应用(一)--AppBar TabLayout
Android Material风格的应用(二)--RecyclerView
Android Material风格的应用(三)--DrawerLayout
Android Material风格的应用(四)--FloatActionButton
Android Material风格的应用(五)--CollapsingToolbar

CollapsingToolbar

工程源码
我们为列表的item创建一个详情页面，创建DetailActivity.java对应的布局文件activity_detail.xml

  <android.support.design.widget.AppBarLayout

    android:layout_width="match_parent"

    android:layout_height="@dimen/app_bar_height"

    android:fitsSystemWindows="true"

    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

    <android.support.design.widget.CollapsingToolbarLayout

        android:layout_width="match_parent"

        android:layout_height="match_parent"

        android:id="@+id/collapsing_toolbar"

        android:fitsSystemWindows="true"

        android:theme="@style/ThemeOverlay.AppCompat.Dark"

        app:contentScrim="?attr/colorPrimary"

        app:expandedTitleMarginEnd="@dimen/article_keylines"

        app:expandedTitleMarginStart="@dimen/md_keylines"

        app:layout_scrollFlags="scroll|exitUntilCollapsed">

        <ImageView

            android:layout_width="match_parent"

            android:layout_height="match_parent"

            android:id="@+id/image"

            android:fitsSystemWindows="true"

            android:scaleType="centerCrop"

            app:layout_collapseMode="parallax"/>

        <android.support.v7.widget.Toolbar

            android:layout_width="match_parent"

            android:layout_height="?attr/actionBarSize"

            app:layout_collapseMode="pin"

            app:popupTheme="@style/ThemeOverlay.AppCompat.Light"></android.support.v7.widget.Toolbar>

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

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

在代码中初始化相关的逻辑

  CollapsingToolbarLayout collapsingToolbarLayout = (CollapsingToolbarLayout)findViewById(R.id.collapsing_toolbar);