CoordinatorLayout-帶圖片伸縮工具列，

CoordinatorLayout-帶圖片伸縮工具列，
：

步驟一：

在build.gilde中添加以下代碼

dependencies {    compile fileTree(dir: 'libs', include: ['*.jar'])    compile 'com.android.support:appcompat-v7:22.2.0'    compile 'com.android.support:design:22.2.0'    compile 'com.android.support:cardview-v7:22.2.0'}

步驟二：

布局檔案：

<?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:id="@+id/main_content"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:fitsSystemWindows="true">    <!--第一部分：伸縮工具列-->    <android.support.design.widget.AppBarLayout        android:id="@+id/appbar"        android:layout_width="match_parent"        android:layout_height="@dimen/detail_backdrop_height"        android:fitsSystemWindows="true"        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">        <android.support.design.widget.CollapsingToolbarLayout            android:id="@+id/collapsing_toolbar"            android:layout_width="match_parent"            android:layout_height="match_parent"            android:fitsSystemWindows="true"            app:contentScrim="?attr/colorPrimary"            app:expandedTitleMarginEnd="64dp"            app:expandedTitleMarginStart="48dp"            app:layout_scrollFlags="scroll|exitUntilCollapsed">            <ImageView                android:id="@+id/backdrop"                android:layout_width="match_parent"                android:layout_height="match_parent"                android:fitsSystemWindows="true"                android:scaleType="centerCrop"                android:src="@drawable/cheese_2"                app:layout_collapseMode="parallax" />            <android.support.v7.widget.Toolbar                android:id="@+id/toolbar"                android:layout_width="match_parent"                android:layout_height="?attr/actionBarSize"                app:layout_collapseMode="pin"                app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />        </android.support.design.widget.CollapsingToolbarLayout>    </android.support.design.widget.AppBarLayout>    <!--第二部分：主要內容，NestedScrollView和ScrollView準系統一致，只不過NestedScrollView可以相容新的控制項-->    <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="match_parent"            android:orientation="vertical"            android:paddingTop="24dp">            <!--卡片布局-->            <android.support.v7.widget.CardView                android:layout_width="match_parent"                android:layout_height="wrap_content"                android:layout_margin="@dimen/card_margin">                <LinearLayout                    style="@style/Widget.CardContent"                    android:layout_width="match_parent"                    android:layout_height="wrap_content">                    <TextView                        android:layout_width="match_parent"                        android:layout_height="wrap_content"                        android:text="Info"                        android:textAppearance="@style/TextAppearance.AppCompat.Title" />                    <TextView                        android:layout_width="match_parent"                        android:layout_height="wrap_content"                        android:text="@string/cheese_ipsum" />                </LinearLayout>            </android.support.v7.widget.CardView>            <android.support.v7.widget.CardView                android:layout_width="match_parent"                android:layout_height="wrap_content"                android:layout_marginBottom="@dimen/card_margin"                android:layout_marginLeft="@dimen/card_margin"                android:layout_marginRight="@dimen/card_margin">                <LinearLayout                    style="@style/Widget.CardContent"                    android:layout_width="match_parent"                    android:layout_height="wrap_content">                    <TextView                        android:layout_width="match_parent"                        android:layout_height="wrap_content"                        android:text="Friends"                        android:textAppearance="@style/TextAppearance.AppCompat.Title" />                    <TextView                        android:layout_width="match_parent"                        android:layout_height="wrap_content"                        android:text="@string/cheese_ipsum" />                </LinearLayout>            </android.support.v7.widget.CardView>            <android.support.v7.widget.CardView                android:layout_width="match_parent"                android:layout_height="wrap_content"                android:layout_marginBottom="@dimen/card_margin"                android:layout_marginLeft="@dimen/card_margin"                android:layout_marginRight="@dimen/card_margin">                <LinearLayout                    style="@style/Widget.CardContent"                    android:layout_width="match_parent"                    android:layout_height="wrap_content">                    <TextView                        android:layout_width="match_parent"                        android:layout_height="wrap_content"                        android:text="Related"                        android:textAppearance="@style/TextAppearance.AppCompat.Title" />                    <TextView                        android:layout_width="match_parent"                        android:layout_height="wrap_content"                        android:text="@string/cheese_ipsum" />                </LinearLayout>            </android.support.v7.widget.CardView>        </LinearLayout>    </android.support.v4.widget.NestedScrollView>    <!--第三部分：漂浮按鈕-->    <android.support.design.widget.FloatingActionButton        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_margin="@dimen/fab_margin"        android:clickable="true"        android:src="@drawable/ic_discuss"        app:layout_anchor="@id/appbar"        app:layout_anchorGravity="bottom|right|end" /></android.support.design.widget.CoordinatorLayout>

步驟三：

首頁面代碼：

public class MainActivity extends AppCompatActivity {    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        //給版面設定工具列        final Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);        setSupportActionBar(toolbar);        getSupportActionBar().setDisplayHomeAsUpEnabled(true);        //設定工具列標題        CollapsingToolbarLayout collapsingToolbar = (CollapsingToolbarLayout) findViewById(R.id.collapsing_toolbar);        collapsingToolbar.setTitle("cheeseName");    }    @Override    public boolean onCreateOptionsMenu(Menu menu) {        getMenuInflater().inflate(R.menu.menu_main, menu);        return true;    }    @Override    public boolean onOptionsItemSelected(MenuItem item) {        int id = item.getItemId();        if (id == R.id.action_settings) {            return true;        }        return super.onOptionsItemSelected(item);    }}

小結：

伸縮工具列的代碼結構：

<android.support.design.widget.AppBarLayout        android:layout_height="192dp"        android:layout_width="match_parent">    <android.support.design.widget.CollapsingToolbarLayout            android:layout_width="match_parent"            android:layout_height="match_parent"            app:layout_scrollFlags="scroll|exitUntilCollapsed">        <android.support.v7.widget.Toolbar                android:layout_height="?attr/actionBarSize"                android:layout_width="match_parent"                app:layout_collapseMode="pin"/>        </android.support.design.widget.CollapsingToolbarLayout></android.support.design.widget.AppBarLayout>

節選自android開發部落格