Android Material Design 踩坑记(1)

最近随大流学着使用Material Design元素重新设计App，尝试着使用v4，v7，design库中的新组件，AppBarLayout，Toolbar，Nest系列，CoordinatorLayout.Behavior等等。

以前一直使用基础的组件来自己封装或者使用开源框架来实现一些目前很流行的页面效果，改造起来还是有点麻烦，使用新的Material控件之后真是柳暗花明又一村，用户体验蹭蹭上几个档次，但是但是.....新东西上手总是要踩坑的....

• AppBarLayout + ToolBar

ToolBar需要AppBarLayout包括才能显示出来！
如果在API19以上想使用沉浸式状态栏，请从最外层根视图加上

android:fitsSystemWindows="true"

<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:fitsSystemWindows="true">
    <android.support.design.widget.AppBarLayout
        android:fitsSystemWindows="true">
        <android.support.v7.widget.Toolbar
            android:fitsSystemWindows="true" />
    </android.support.design.widget.AppBarLayout>
    <!--  .... others  -->
</android.support.design.widget.CoordinatorLayout>

在对应的Activity或者Fragment中将ActionBar替换为ToolBar

setSupportActionBar(toolbar)

Fragment中想使用menu，需要在Fragment中增加

setHasOptionsMenu(true)

• 主题Theme

    <style name="AppTheme" parent="@style/Theme.AppCompat.Light.NoActionBar">
        <!-- Window 背景设置为Toolbar颜色，避免切换动画时状态栏闪烁 -->
        <item name="android:windowBackground">@color/app_theme</item>
        <!-- Toolbar 背景颜色 -->
        <item name="colorPrimary">@color/app_theme</item>
        <item name="colorPrimaryDark">@color/app_theme</item>
        <!-- Toolbar 文字颜色（标题） -->
        <item name="titleTextColor">@android:color/white</item>
        <!-- Toolbar 按钮颜色（返回键） -->
        <item name="colorControlNormal">@android:color/white</item>
        <!-- Toolbar 菜单文字颜色 -->
        <item name="actionMenuTextColor">@android:color/white</item>
    </style>

以上是使用ToolBar的通用配置，针对API19开始状态栏透明，API21 SharedElementTransition场景过度动画，经过不断的尝试得出以下效果还不错的设置
values-v19.xml

    <style name="AppThemeCompact" parent="AppTheme">
        <!-- 透明状态栏 -->
        <item name="android:windowTranslucentStatus">true</item>
    </style>

values-v21.xml

    <style name="AppThemeCompact" parent="AppTheme">
        <!-- 透明状态栏 -->
        <item name="android:windowDrawsSystemBarBackgrounds">true</item>
        <item name="android:statusBarColor">@android:color/transparent</item>
        <!-- window transition -->
        <!-- 切换动画播放顺序 -->
        <item name="android:windowAllowEnterTransitionOverlap">true</item>
        <item name="android:windowAllowReturnTransitionOverlap">true</item>
        <!--<item name="android:windowEnterTransition">@transition/window</item>-->
        <!--<item name="android:windowExitTransition">@transition/window</item>-->
        <!--<item name="android:windowReturnTransition">@transition/window</item>-->
        <item name="android:windowSharedElementEnterTransition">@transition/window_shared</item>
        <item name="android:windowSharedElementExitTransition">@transition/window_shared</item>
        <item name="android:windowSharedElementReturnTransition">@transition/window_shared</item>
    </style>

Android Material Design 踩坑记(2)