Material Design
Toolbar
//android:layout_height="?attr/actionBarSize" actionBarSize获取系统设置的高度写wrap_content //android:background="?attr/colorPrimary" //其实不用设置默认是这颜色,不过可以设置其它颜色 //android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" 导航栏颜色 //app:popupTheme="@style/ThemeOverlay.AppCompat.Light" 弹出菜单栏颜色 //app:layout_scrollFlags="scroll|enterAlways|snap" 滑动类型 // <android.support.v7.widget.Toolbar android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="?attr/actionBarSize" android:background="?attr/colorPrimary" //其实不用设置默认是这颜色 android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" app:popupTheme="@style/ThemeOverlay.AppCompat.Light" app:layout_scrollFlags="scroll|enterAlways|snap" />
<?xml version="1.0" encoding="utf-8"?> <menu xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto"> //app:showAsAction="always" 总是直接展示 <item android:id="@+id/backup" android:icon="@drawable/ic_backup" android:title="Backup" app:showAsAction="always"/> //app:showAsAction="ifRoom" 如果有空间直接展示 <item android:id="@+id/delete" android:icon="@drawable/ic_delete" android:title="Delete" app:showAsAction="ifRoom"/> //app:showAsAction="never" 从不直接展示 <item android:id="@+id/settings" android:icon="@drawable/ic_settings" android:title="Settings" app:showAsAction="never"/> </menu>
DrawerLayout
NavigationView
android:layout_gravity=”start” start end right left
<android.support.design.widget.NavigationView android:id="@+id/nav_view" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_gravity="start" app:headerLayout="@layout/nav_header" app:menu="@menu/nav_menu" />
FloatingActionButton
//app:elevation="8dp" 阴影 //app:layout_anchor="@id/appBar" 锚点 //app:layout_anchorGravity="bottom|end" 锚点位置 <android.support.design.widget.FloatingActionButton android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_margin="16dp" android:src="@drawable/ic_comment" app:elevation="8dp" app:layout_anchor="@id/appBar" app:layout_anchorGravity="bottom|end" />
Snackbar
Snackbar.make(view, "Data deleted", Snackbar.LENGTH_SHORT) .setAction("Undo", new View.OnClickListener() { @Override public void onClick(View v) { Toast.makeText(MainActivity.this, "Data restored", Toast.LENGTH_SHORT).show(); } }) .show();
CoordinatorLayout
更好的支持滑动
CardView和SwipeRefreshLayout和RecyclerView
//appbar_scrolling_view_behavior <android.support.v4.widget.SwipeRefreshLayout android:id="@+id/swipe_refresh" android:layout_width="match_parent" android:layout_height="match_parent" app:layout_behavior="@string/appbar_scrolling_view_behavior"> <android.support.v7.widget.RecyclerView android:id="@+id/recycler_view" android:layout_width="match_parent" android:layout_height="match_parent" /> </android.support.v4.widget.SwipeRefreshLayout>
AppBarLayout extends LinearLayout
app:layout_behavior=”@string/appbar_scrolling_view_behavior”
appbar_scrolling_view_behavior material design 提供的布局行为
app:layout_scrollFlags=”scroll|enterAlways|snap”
scroll:底部滑动控件向上滑动时,顶部导航栏一起向上滑动并隐藏
enterAlways:底部滑动控件向下滑动时,顶部导航栏一起向下滑动并显示
snap:顶部导航栏会根据当前滚动的距离,自动选择是否隐藏还是显示
CollapsingToolbarLayout 可折叠式标题栏
<android.support.design.widget.AppBarLayout android:id="@+id/appBar" android:layout_width="match_parent" android:layout_height="250dp" android:fitsSystemWindows="true"> <android.support.design.widget.CollapsingToolbarLayout android:id="@+id/collapsing_toolbar" android:layout_width="match_parent" android:layout_height="match_parent" android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" android:fitsSystemWindows="true" app:contentScrim="?attr/colorPrimary" app:layout_scrollFlags="scroll|exitUntilCollapsed"> <ImageView android:id="@+id/fruit_image_view" android:layout_width="match_parent" android:layout_height="match_parent" android:scaleType="centerCrop" android:fitsSystemWindows="true" 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" /> </android.support.design.widget.CollapsingToolbarLayout> </android.support.design.widget.AppBarLayout>
app:contentScrim=”?attr/colorPrimary” 折叠后背景色
app:layout_scrollFlags=”scroll|exitUntilCollapsed” scroll:随着内容详情的滚动一起滚动 exitUntilCollapsed:滚动完成之后,留在页面内
app:layout_collapseMode=”parallax” 控件是否会根据滑动产生一定的偏差
app:layout_collapseMode=”pin” 折叠过程中,位置保持不变
充分使用系统状态栏
android:fitsSystemWindows=”true”