Android 折叠式布局
折叠式布局
效果图如下
从头开始 先建立一个名为 Folding 项目，然后在创建一个Activity, OneActivity 这个Activity带有自身的XML布局文件，
** 标题栏折叠** 首先打开activity_one.xml文件 将里面的总布局改为CoordinatorLayout里面以此嵌套AppBarLayout 、Toolbar。如下图所示
嵌套好之后设置一些简单的样式即可 到这一步基本上这个折叠布局已经完成了，然后只要填充相关的控件即可实现效果，要注意的点是Toolbar中放置的是你需要折叠和展开的控件，而AppBarLayout中放置的是Toolbar折叠之后显示的控件，这个地方你可以放任何控件，前提是你得避免控件之间的冲突。我们就折叠一个图片ImageView吧，折叠之后显示一个标题TextView。如下图所示
到这里我们就已经实现了这个折叠式，当你点击这个蓝色背景标题往上面滑动时，ImageView就会折叠起来，往下滑动时图片就会展开。为了使体现更好可以AppBarLayout下面放一个滚动条，不要用ScrollView而是NestedScrollView因为这里你是要联动的。不论是ScrollView还是NestedScrollView，里面都只能包裹一个控件，我常用的是LinearLayout 然后LinearLayout里面设置纵向排列，放三张图片，这样LinearLayout的总高度就会超过手机屏幕，形成滑动之后图片向上面展示的效果，其实加了NestedScrollView之后，即使里面什么东西都没有，你照样可以滚动，但是如果你用ScrollView就不行，它里面就必须要有东西才行，我们看一下布局
这个时候再运行一下就有比较好的折叠效果了
最后我再放一下整体的布局页面的代码
<?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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".OneActivity">
<android.support.design.widget.AppBarLayout
android:id="@+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:contentInsetStart="0dp"
android:fitsSystemWindows="true"
app:layout_scrollFlags="scroll|enterAlways"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light">
<ImageView
android:scaleType="centerCrop"
android:src="@drawable/background7"
android:layout_width="match_parent"
android:layout_height="200dp"/>
</android.support.v7.widget.Toolbar>
<TextView
android:gravity="center"
android:textSize="18sp"
android:textColor="#fff"
android:text="标题"
android:background="#2B8EE1"
android:layout_width="match_parent"
android:layout_height="50dp"/>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true"
android:orientation="vertical"
app:layout_behavior="@string/appbar_scrolling_view_behavior">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:scaleType="centerCrop"
android:src="@drawable/background"
android:layout_width="match_parent"
android:layout_height="300dp"/>
<ImageView
android:scaleType="centerCrop"
android:src="@drawable/background3"
android:layout_width="match_parent"
android:layout_height="300dp"/>
<ImageView
android:scaleType="centerCrop"
android:src="@drawable/background5"
android:layout_width="match_parent"
android:layout_height="300dp"/>
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CoordinatorLayout>