64、具有过渡动画效果的布局Layout（ 2 ）

【 CoordinatorLayout-与手势完美结合的滑动视图 】

【 AppBarLayout-可以随手势滑动的AppBar 】

 <android.support.design.widget.CoordinatorLayout
     xmlns:android="http://schemas.android.com/apk/res/android"
     xmlns:app="http://schemas.android.com/apk/res-auto"
     android:id="@+id/root_layout"
     android:layout_width="match_parent"
     android:layout_height="match_parent"
     android:orientation="vertical">

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

         <!--
         使用 Toolbar 作为一个标题栏

         app:layout_scrollFlags="scroll|enterAlways":
         当向上混动的时候，Toolbar会移出屏幕，只要向下滑动，就会显示Toolbar。

         app:layout_scrollFlags="scroll|enterAlwaysCollapsed":
         当向上混动的时候，Toolbar会移出屏幕,向下滑动时，滑动到第一个的时候才会显示Toolbar。

         app:layout_scrollFlags="scroll|exitUntilCollapsed":
         不管向上还是向下移动，Toolbar都不会滑出屏幕。
         另外：如果加上，android:minHeight="20dp"的时候。
         当向上滑动时候，Toolbar移出屏幕，直到变成最小高度，
         向下滑动时，滑动到第一个的时候才会显示Toolbar
         -->
         <android.support.v7.widget.Toolbar
             android:id="@+id/toolbar"
             android:layout_width="match_parent"
             android:layout_height="?attr/actionBarSize"
             android:background="#77db93"
             android:minHeight="20dp"
             app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
             app:layout_scrollFlags="scroll|exitUntilCollapsed" />
     </android.support.design.widget.AppBarLayout>

     <!-- 与手势完美结合的滑动视图 -->
     <android.support.v4.widget.NestedScrollView
         android:layout_width="match_parent"
         android:layout_height="match_parent"
         app:layout_behavior="@string/appbar_scrolling_view_behavior">
         <LinearLayout
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
             android:orientation="vertical">
             <ImageView
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
                 android:src="@drawable/ic_launcher" />
             ............
             <ImageView
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
                 android:src="@drawable/ic_launcher" />
         </LinearLayout>
     </android.support.v4.widget.NestedScrollView>

     <android.support.design.widget.FloatingActionButton
         android:id="@+id/fab_btn"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_gravity="bottom|right"
         android:layout_margin="10dp"
         android:src="@drawable/ic_launcher"
         app:fabSize="normal" />
 </android.support.design.widget.CoordinatorLayout>

 <resources>
     <!-- values/styles.xml -->
     <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
         <!-- Customize your theme here. -->
         <item name="android:windowActionBar">false</item>
         <item name="android:windowNoTitle">true</item>
         <item name="windowActionBar">false</item>
         <item name="windowNoTitle">true</item>
     </style>
 </resources>

 package com.example.com.designdemo;

 import android.os.Bundle;
 import android.support.design.widget.CoordinatorLayout;
 import android.support.design.widget.FloatingActionButton;
 import android.support.design.widget.Snackbar;
 import android.support.v7.app.AppCompatActivity;
 import android.support.v7.widget.Toolbar;
 import android.view.View;

 public class MainActivity2 extends AppCompatActivity {
     private FloatingActionButton fab_btn = null;
     private CoordinatorLayout root_layout = null;
     private Toolbar toolbar = null;

     @Override
     protected void onCreate(Bundle savedInstanceState) {
         super.onCreate(savedInstanceState);
         setContentView(R.layout.activity_main2);

         toolbar = (Toolbar) this.findViewById(R.id.toolbar);
         setSupportActionBar(toolbar);

         root_layout = (CoordinatorLayout) this.findViewById(R.id.root_layout);
         fab_btn = (FloatingActionButton) this.findViewById(R.id.fab_btn);
         fab_btn.setOnClickListener(new View.OnClickListener() {
             @Override
             public void onClick(View v) {
                 Snackbar.make(root_layout, "我出来了", Snackbar.LENGTH_LONG)
                         .setAction("知道了", new View.OnClickListener() {
                             @Override
                             public void onClick(View v) {
                             }
                         }).show();
             }
         });

     }
 }

使用 Toolbar 作为一个标题栏

app:layout_scrollFlags="scroll|enterAlways":
当向上混动的时候，Toolbar会移出屏幕，只要向下滑动，就会显示Toolbar。

app:layout_scrollFlags="scroll|enterAlwaysCollapsed":
当向上混动的时候，Toolbar会移出屏幕,向下滑动时，滑动到第一个的时候才会显示Toolbar。

app:layout_scrollFlags="scroll|exitUntilCollapsed":
不管向上还是向下移动，Toolbar都不会滑出屏幕。
另外：如果加上，android:minHeight="20dp"的时候。当向上滑动时候，Toolbar移出屏幕，直到变成最小高度，
         向下滑动时，滑动到第一个的时候才会显示Toolbar

【 Collapsing Toolbars-可以伸缩的ToolBar 】

1、activity_main2.xml

 <android.support.design.widget.CoordinatorLayout
     xmlns:android="http://schemas.android.com/apk/res/android"
     xmlns:app="http://schemas.android.com/apk/res-auto"
     android:id="@+id/root_layout"
     android:layout_width="match_parent"
     android:layout_height="match_parent"
     android:orientation="vertical">

     <!--
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
        把文字颜色设置成白色。
     -->
     <android.support.design.widget.AppBarLayout
         android:layout_width="match_parent"
         android:layout_height="300dp"
         android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
         <!--
              app:contentScrim="#77db93" 滑动到顶部，图片背景变成Toolbar条。
         -->
         <android.support.design.widget.CollapsingToolbarLayout
             android:id="@+id/collapsingToolbarLayout"
             android:layout_width="match_parent"
             android:layout_height="match_parent"
             app:contentScrim="#77db93"
             app:expandedTitleMarginStart="80dp"
             app:layout_scrollFlags="scroll|exitUntilCollapsed">
             <ImageView
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
                 android:scaleType="fitXY"
                 android:src="@drawable/bg_01"
                 app:layout_collapseMode="parallax"
                 app:layout_collapseParallaxMultiplier="0.8"/>

             <!-- android:background="#77db93" -->
         <android.support.v7.widget.Toolbar
             android:id="@+id/toolbar"
             android:layout_width="match_parent"
             android:layout_height="?attr/actionBarSize"
             android:minHeight="20dp"
             app:layout_collapseMode="pin"
             app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />
         </android.support.design.widget.CollapsingToolbarLayout>
     </android.support.design.widget.AppBarLayout>

     <!-- 与手势完美结合的滑动视图 -->
     <android.support.v4.widget.NestedScrollView
         android:layout_width="match_parent"
         android:layout_height="match_parent"
         app:layout_behavior="@string/appbar_scrolling_view_behavior">
         <LinearLayout
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
             android:orientation="vertical">
             <ImageView
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
                 android:src="@drawable/ic_launcher" />
             ...............
             <ImageView
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
                 android:src="@drawable/ic_launcher" />
         </LinearLayout>
     </android.support.v4.widget.NestedScrollView>

     <android.support.design.widget.FloatingActionButton
         android:id="@+id/fab_btn"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_gravity="bottom|right"
         android:layout_margin="10dp"
         android:src="@drawable/ic_launcher"
         app:fabSize="normal" />
 </android.support.design.widget.CoordinatorLayout>

2、MainActivity2.xml

 package com.example.com.designdemo;

 import android.os.Bundle;
 import android.support.design.widget.CollapsingToolbarLayout;
 import android.support.design.widget.CoordinatorLayout;
 import android.support.design.widget.FloatingActionButton;
 import android.support.design.widget.Snackbar;
 import android.support.v7.app.AppCompatActivity;
 import android.support.v7.widget.Toolbar;
 import android.view.View;

 public class MainActivity2 extends AppCompatActivity {
     private FloatingActionButton fab_btn = null;
     private CoordinatorLayout root_layout = null;
     private CollapsingToolbarLayout collapsingToolbarLayout = null;
     private Toolbar toolbar = null;

     @Override
     protected void onCreate(Bundle savedInstanceState) {
         super.onCreate(savedInstanceState);
         setContentView(R.layout.activity_main2);

         toolbar = (Toolbar) this.findViewById(R.id.toolbar);
         setSupportActionBar(toolbar);
         getSupportActionBar().setHomeButtonEnabled(true);
         getSupportActionBar().setDisplayHomeAsUpEnabled(true);

         collapsingToolbarLayout = (CollapsingToolbarLayout)this.findViewById(R.id.collapsingToolbarLayout);
         collapsingToolbarLayout.setTitle("标题文字内容");

         root_layout = (CoordinatorLayout) this.findViewById(R.id.root_layout);
         fab_btn = (FloatingActionButton) this.findViewById(R.id.fab_btn);
         fab_btn.setOnClickListener(new View.OnClickListener() {
             @Override
             public void onClick(View v) {
                 Snackbar.make(root_layout, "我出来了", Snackbar.LENGTH_LONG)
                         .setAction("知道了", new View.OnClickListener() {
                             @Override
                             public void onClick(View v) {}
                         }).show();
             }
         });
     }
 }

3、styles.xml

<resources>
    <!-- values/styles.xml -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <!-- Customize your theme here. -->
        <item name="android:windowActionBar">false</item>
        <item name="android:windowNoTitle">true</item>
        <item name="windowActionBar">false</item>
        <item name="windowNoTitle">true</item>
    </style>
</resources>

DEMO完整下载地址：http://download.csdn.net/detail/androidsj/9304305