1.CoordinatorLayout、AppBarLayout、CollapsingToolbarLayout简介
三者都是Material Design的设计风格,所以使用前需要添加android.support.design.widget依赖。其中:
1.CoordinatorLayout是一个加强版的FrameLayout,可以监听其所有子控件的各种事项。
2.AppBarLayout是一个垂直的LinearLayout,在CoordinatorLayout中用作直接子项。
子界面应该通过setScrollFlags(int)和相关的布局xml属性提供他们想要的滚动行为:app:layout_scrollFlags。
AppBarLayout还需要一个单独的滚动兄弟,以便知道何时滚动。 绑定是通过AppBarLayout.ScrollingViewBehavior行为类完成的,这意味着应该将滚动视图的行为设置为AppBarLayout.ScrollingViewBehavior的实例。 (好像也不一定要,额,待考证)
3.CollapsingToolbarLayout是一个作用于Toobar基础上的布局,不能独立存在,被限定只能作为AppBarLayout的直接子布局。
2.综合使用范例
<?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:activity="com.duan.musicoco.main.MainActivity">
<android.support.design.widget.AppBarLayout
android:id="@+id/activity_main_app_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@android:color/transparent"
app:elevation="0dp">
<android.support.design.widget.CollapsingToolbarLayout
android:id="@+id/activity_main_coll_tool_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_scrollFlags="scroll|exitUntilCollapsed|snap"
app:titleEnabled="false">
<LinearLayout
android:id="@+id/activity_main_top_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="?attr/actionBarSize"
android:orientation="vertical"
app:layout_collapseMode="parallax">
<include layout="@layout/recent_most_play" />
<include layout="@layout/main_sheets" />
</LinearLayout>
<android.support.v7.widget.Toolbar
android:id="@+id/activity_main_toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_collapseMode="pin" />
</android.support.design.widget.CollapsingToolbarLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="@dimen/activity_default_margin"
android:layout_marginRight="@dimen/activity_default_margin"
android:paddingBottom="@dimen/activity_default_padding_l_l"
android:paddingTop="@dimen/activity_default_padding_l_l"
app:layout_scrollFlags="scroll|exitUntilCollapsed|snap">
<TextView
android:text="@string/my_sheet_title"
android:id="@+id/my_sheet_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_marginLeft="5dp"
android:layout_marginStart="5dp"
android:drawableLeft="@drawable/line_for_main_title"
android:drawablePadding="@dimen/activity_default_padding"
android:gravity="center_vertical|start"
android:textSize="@dimen/text_middle_s" />
<TextView
android:id="@+id/my_sheet_add"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_marginLeft="8dp"
android:layout_marginStart="8dp"
android:drawableRight="@drawable/ic_chevron_right"
android:gravity="center"
android:text="@string/new_"
android:textSize="@dimen/text_middle_s" />
</RelativeLayout>
<View
android:alpha="0.7"
android:id="@+id/activity_main_line"
android:layout_width="match_parent"
android:layout_height="1px"
android:layout_marginLeft="@dimen/activity_default_margin"
android:layout_marginRight="@dimen/activity_default_margin" />
</android.support.design.widget.AppBarLayout>
<include layout="@layout/main_content" />
<LinearLayout
android:id="@+id/ll003"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom">
<include layout="@layout/play_bottom_navigation" />
</LinearLayout>
</android.support.design.widget.CoordinatorLayout>