材料新特性

这篇文章主要是方便以后我去查找材料特性的使用方式，并不会作过多的分析。如果想了解更多材料特性的使用方式请参考https://developer.android.com/design/。

这是我实现的效果图，需要完整demo的朋友可以私我

ToolBar作用

用来替换ActionBar，单独使用的情况较少;我个人更喜欢搭配android:fitsSsystemWindows （背景图和系统状态栏融合）使用。
举例：

        <!--android:theme:设置toolbar上各种元素的颜色-->
        <!--app:popupTheme:弹出的菜单项指定颜色-->
        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:background="?attr/colorPrimary"
            app:layout_scrollFlags="scroll|enterAlways|snap"
            android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
            app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />

 <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <!-- Customize your theme here. -->
        <!--toolbar整体颜色-->
        <item name="colorPrimary">@color/colorPrimary</item>
        <!--导航栏颜色-->
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <!--FloatingButton和按钮的颜色-->
        <item name="colorAccent">@color/colorAccent</item>
        <!--App文本颜色-->
        <item name="android:textColorPrimary">@android:color/black</item>
        <!--主体背景颜色-->
        <item name="android:windowBackground">@android:color/white</item>
        <!--底部导航栏颜色-->
        <item name="android:navigationBarColor">@android:color/holo_red_light</item>
    </style>

        Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
        setSupportActionBar(toolbar);
 //设置侧滑菜单图标
        if (getSupportActionBar() != null) {
            getSupportActionBar().setDisplayHomeAsUpEnabled(true);
            getSupportActionBar().setHomeAsUpIndicator(R.drawable.menu);
        }

DrawerLayout+NavigationView使用

DrawerLayout作为Material侧滑菜单，必须作为顶层布局；NavigationView包含两个布局的引用，一个是导航里面的头部，另一个是菜单项；
举例：

<android.support.v4.widget.DrawerLayout 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:id="@+id/drawerlayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true"
    tools:context="com.example.p00746.googlemapdemo.materialDemo.MaterialActivity">

    <include
        layout="@layout/app_bar_main"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

    <include layout="@layout/page_start" />
    
    <!--侧滑菜单项-->
    <!--android:layout_gravity="start"必须指定-->
    <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_main"
        app:menu="@menu/activity_main_drawer" />

</android.support.v4.widget.DrawerLayout>

<menu xmlns:android="http://schemas.android.com/apk/res/android">

    <group android:checkableBehavior="none">
        <item
            android:id="@+id/nav_recycler_and_swipe_refresh"
            android:icon="@drawable/ic_format_list_bulleted_black_24dp"
            android:title="@string/nav_recycler_view" />
        <item
            android:id="@+id/nav_scrolling"
            android:icon="@drawable/ic_file_download_black_24dp"
            android:title="@string/nav_scrolling" />
        <item
            android:id="@+id/nav_full_screen"
            android:icon="@drawable/ic_fullscreen_black_24dp"
            android:title="@string/nav_fullscreen" />
        <item
            android:id="@+id/nav_bottom_navigation"
            android:icon="@drawable/ic_more_horiz_black_24dp"
            android:title="@string/nav_bottom_navigation" />
        <item
            android:id="@+id/nav_settings"
            android:icon="@drawable/ic_settings_black_24dp"
            android:title="@string/nav_settings" />
    </group>

    <group android:id="@+id/group_about">
        <item
            android:id="@+id/nav_about"
            android:icon="@drawable/ic_info_black_24dp"
            android:title="@string/nav_about" />
        <item
            android:id="@+id/nav_donate"
            android:icon="@drawable/ic_monetization_on_black_24dp"
            android:title="@string/nav_donate" />
        <item
            android:id="@+id/nav_my_apps"
            android:icon="@drawable/ic_apps_black_24dp"
            android:title="@string/nav_my_apps" />
    </group>

</menu>

        drawerLayout = (DrawerLayout) findViewById(R.id.drawerlayout);
        //DrawerLayout相关设置
        ActionBarDrawerToggle toggle = new ActionBarDrawerToggle(this,
                drawerLayout, toolbar, R.string.navigation_drawer_open, R.string.navigation_drawer_close);
        drawerLayout.addDrawerListener(toggle);
        toggle.syncState();
        navigationView = (NavigationView) findViewById(R.id.nav_view);
        navigationView.setNavigationItemSelectedListener(this);
        //更改菜单icon和title颜色变化效果
        navigationView.setItemIconTintList(null);
        View headerView = navigationView.getHeaderView(0);
        nav_header = (LinearLayout) headerView.findViewById(R.id.nav_header);
        nav_header.setOnClickListener(this);

CoordinatorLayout+AppBarLayout的使用

CoordinatorLayout加强版的FrameLayout，用来协调Material各种控件。AppBarLayout加强版的LinearLayout,内部阻力很多滚动事件封装。可以设置layout_scrollFlags属性让控件具有一些炫酷效果；

• scroll:View会随着滚动事件一起移动
• enterAlways:View向下滚动时，该View会直接往下滚动
• exitUntilCollapsed:View向上逐渐消失时，会一直往上滑动，直到剩下的高度达到它最小高度后，在响应内部事件
• enterAlwaysCollapsed:一般跟enterAlways一起使用，它是指，View在往下“出现”的时候，首先是enterAlways效果，当View的高度达到最小高度时，View就暂时不去往下滚动，直到ScrollView滑动到顶部不再滑动时，View再继续往下滑动，直到滑到View的顶部结束

<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">


    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:fitsSystemWindows="true"
        android:theme="@style/AppTheme.AppBarOverlay">
        <!--android:theme:设置toolbar上各种元素的颜色-->
        <!--app:popupTheme:弹出的菜单项指定颜色-->
        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:background="?attr/colorPrimary"
            app:layout_scrollFlags="scroll|enterAlways|snap"
            android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
            app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />

        <android.support.design.widget.TabLayout
            android:id="@+id/tab_layout_main"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:tabIndicatorColor="@color/colorAccent" />

    </android.support.design.widget.AppBarLayout>

    <android.support.v4.view.ViewPager
        android:id="@+id/view_pager_main"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior" />

    <android.support.design.widget.FloatingActionButton
        android:id="@+id/fab_main"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|end"
        android:layout_margin="@dimen/fab_margin"
        android:src="@drawable/ic_add_white_24dp"
        android:visibility="gone"
        app:layout_scrollFlags="scroll|enterAlways" />

</android.support.design.widget.CoordinatorLayout>

CollapsingToolbarLayout的作用

加强版的ToolBar，只能作为AppBarlayout的直接布局来使用,AppBarLayout又必须是CoordinatorLayout的子布局；

<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:id="@+id/activity_scroll_view"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.example.p00746.googlemapdemo.materialDemo.ScrollViewActivity">

    <android.support.design.widget.AppBarLayout
        android:id="@+id/app_bar_scrolling"
        android:layout_width="match_parent"
        android:layout_height="@dimen/app_bar_height_image_view"
        android:fitsSystemWindows="true"
        android:theme="@style/AppTheme.AppBarOverlay">

        <!--app:contentScrim="?attr/colorPrimary" 趋于折叠时的颜色-->
        <!--layout_collapseMode-->
        <!--pin:折叠的过程中位置始终保持不变-->
        <!--parallax：折叠过程中产生一定的错位偏移-->
        <android.support.design.widget.CollapsingToolbarLayout
            android:id="@+id/collapsing_toolbar"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:contentScrim="?attr/colorPrimary"
            app:layout_scrollFlags="scroll|exitUntilCollapsed">

            <ImageView
                android:id="@+id/image_scrolling_top"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:fitsSystemWindows="true"
                android:scaleType="fitXY"
                app:layout_collapseMode="parallax" />

            <android.support.v7.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
                app:layout_collapseMode="pin"
                app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />

        </android.support.design.widget.CollapsingToolbarLayout>

    </android.support.design.widget.AppBarLayout>

    <android.support.design.widget.FloatingActionButton
        android:id="@+id/fab_scrolling"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="@dimen/big_activity_fab_margin"
        android:src="@drawable/ic_share_white_24dp"
        app:layout_anchor="@id/app_bar_scrolling"
        app:layout_anchorGravity="bottom|end" />

    <include layout="@layout/content_scrolling" />

</android.support.design.widget.CoordinatorLayout>

TextInputLayout的使用

TextInputLayout 控件表现得就像LinearLayout 一样，它是一个容器。TextInputLayout 中只能放一个子元素，和ScrollView有点类似，并且子元素必须是EditText；
TextInputLayout 实现的功能就是当EditText中输入第一个字母要隐藏hint的时候，TextInputLayout中会出现一个悬浮的标签来显示这个hint，还负责一个炫酷的的material 动画

            <android.support.design.widget.TextInputLayout
                android:id="@+id/input_user_name"
                android:layout_width="match_parent"
                android:layout_height="wrap_content">

                <AutoCompleteTextView
                    android:id="@+id/tv_user_name"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:hint="@string/login_user_name_hint"
                    android:imeOptions="actionNext"
                    android:maxLength="20"
                    android:maxLines="1"
                    android:singleLine="true" />
            </android.support.design.widget.TextInputLayout>

底部导航栏的另一种实现方式（3-5之间使用）

<LinearLayout 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:id="@+id/activity_bottom_navigation"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".materialDemo.BottomNavigationActivity">

    <android.support.v4.view.ViewPager
        android:id="@+id/view_pager_bottom_navigation"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1" />

    <android.support.design.widget.BottomNavigationView
        android:id="@+id/bottom_navigation"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom"
        android:background="@color/white"
        app:itemIconTint="@color/nav_color_select"
        app:itemTextColor="@color/nav_color_select"
        app:menu="@menu/bottom_navigation" />

</LinearLayout>

<menu xmlns:android="http://schemas.android.com/apk/res/android">

    <item
        android:id="@+id/bottom_navigation_blue"
        android:icon="@drawable/ic_dashboard_black_24dp"
        android:title="Blue" />

    <item
        android:id="@+id/bottom_navigation_green"
        android:icon="@drawable/ic_photo_black_24dp"
        android:title="Green" />

    <item
        android:id="@+id/bottom_navigation_yellow"
        android:icon="@drawable/ic_music_note_black_24dp"
        android:title="Yellow" />

    <item
        android:id="@+id/bottom_navigation_red"
        android:icon="@drawable/ic_movie_black_24dp"
        android:title="Red" />
</menu>

// If BottomNavigationView has more than 3 items, using reflection to disable shift mode       
BottomNavigationViewHelper.disableShiftMode(navigation);

CardView 的使用

<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:card_view="http://schemas.android.com/apk/res-auto"
    android:id="@+id/card_main_1_1"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginBottom="@dimen/main_card_margin_vertical"
    android:layout_marginEnd="@dimen/main_card_margin_horizontal"
    android:layout_marginStart="@dimen/main_card_margin_horizontal"
    android:layout_marginTop="@dimen/main_card_margin_vertical"
    android:background="?attr/selectableItemBackgroundBorderless"
    card_view:cardCornerRadius="@dimen/card_recycler_corner_radius"
    card_view:cardElevation="@dimen/card_recycler_elevation">

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <ImageView
            android:id="@+id/img_main_card_1"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_alignParentTop="true"
            android:src="@drawable/material_design_2"
            android:adjustViewBounds="true"
            android:scaleType="centerCrop" />

        <TextView
            android:id="@+id/tv_card_main_1_title"
            style="@style/TextAppearance.AppCompat.Large"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_below="@id/img_main_card_1"
            android:layout_marginEnd="@dimen/card_title_margin"
            android:layout_marginStart="@dimen/card_title_margin"
            android:layout_marginTop="@dimen/card_title_margin_top"
            android:text="@string/main_card_title"
            android:textColor="@color/black" />

        <TextView
            android:id="@+id/tv_card_main1_subtitle"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_below="@id/tv_card_main_1_title"
            android:layout_marginBottom="@dimen/card_subtitle_margin"
            android:layout_marginEnd="@dimen/card_subtitle_margin"
            android:layout_marginStart="@dimen/card_subtitle_margin"
            android:layout_marginTop="@dimen/card_button_margin"
            android:text="@string/main_card_subtitle" />

        <Button
            android:id="@+id/btn_card_main1_action1"
            style="@style/Widget.AppCompat.Button.Borderless"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_below="@id/tv_card_main1_subtitle"
            android:layout_margin="@dimen/card_button_margin"
            android:text="@string/main_card_button_1"
            android:textColor="@color/colorAccent" />

        <Button
            android:id="@+id/btn_card_main1_action2"
            style="@style/Widget.AppCompat.Button.Borderless"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_below="@id/tv_card_main1_subtitle"
            android:layout_marginBottom="@dimen/card_button_margin"
            android:layout_marginTop="@dimen/card_button_margin"
            android:layout_toEndOf="@id/btn_card_main1_action1"
            android:text="@string/main_card_button_2"
            android:textColor="@color/colorAccent" />

    </RelativeLayout>
</android.support.v7.widget.CardView>