Android中MD相关的控件介绍及使用

Material Design 中有八个控件分别是：

首先，在 gradle 文件中引入 meterial design 库：

compile 'com.android.support:design:22.2.0'

1.CoordinatorLayout其实就是类似于一个FrameLayout布局，该布局的强大之处在于能够协调各个view之间的关系，只需要将各个view包含Coordinator中即可，

2.AppBarLayout 它继承于LinerLayout,依赖于CoordinatorLayout，必须是它下面的子view，否则放到其他ViewGroup下面是无效的。

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


    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
        >

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

3.CollapsingToolbarLayout 主要是用来对Toolbar进行包装的ViewGroup,主要用于实现折叠的Appbar的效果，它需要放在AppBarLayout的布局里，作为它的直接子View。

<android.support.design.widget.AppBarLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
    >
    <android.support.design.widget.CollapsingToolbarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:expandedTitleMarginEnd="64dp"
        app:expandedTitleMarginStart="48dp"
        app:layout_scrollFlags="scroll|exitUntilCollapsed"
        >
        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="300dp"
            android:scaleType="centerCrop"
            android:src="@drawable/material"
            app:layout_collapseMode="parallax"
            />
        <android.support.v7.widget.Toolbar
            android:layout_width="match_parent"
            android:layout_height="?android:attr/actionBarSize"
            app:layout_collapseMode="pin"
            />
    </android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>

4.NavigationView是在做抽屉布局的时候左滑出来的部分，原来都是自定义，现在Google在5.0之后推出来这样一这样简单而又方便的组件，这个菜单大概分为两部分，上面一部分叫HeaderLayout,下面一部分点击项叫menu,首先把要把它放到一个DrawerLayout中，然后可以直接使用NavigationView，其中headLayout就是上面的一个头布局文件可以 设置一下高度，一个背景看一个效果图，ment就是点击项。

<?xml version="1.0" encoding="utf-8"?>  
<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:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="org.mobiletrain.drawerlayout.MainActivity">  
  
    <LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">  
  
        <TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="主页面"/>  
    </LinearLayout>  
  
    <android.support.design.widget.NavigationView
    android:id="@+id/navigation_view"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:layout_gravity="left"
    android:fitsSystemWindows="true"
    app:headerLayout="@layout/header_layout"
    app:menu="@menu/main"></android.support.design.widget.NavigationView>  
</android.support.v4.widget.DrawerLayout>

5.NestedScrollView和ScrollView基本功能是一致的，只不过NetstedScrollView可以兼容新的控件，关键在于和ToolBar交互产生的作用。

app:layout_behavior="@string/appbar_scrolling_view_behavior"和

CollapsingToolbarLayout中的

app:layout_scrollFlags="scroll|exitUntilCollapsed"是对应的，

一旦发现NestedScrollView中有那句话，就会检查其他的控件，然后如果有上面这句话对应的话，滑动的效果就可以实现的。

<android.support.v4.widget.NestedScrollView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:paddingTop="50dp"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    >
    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="@string/my_txt"
        android:textSize="20sp" />

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

6.FloatingActionButton 就一个漂浮的按钮，这个类是继承于ImageView的，所以对于它可以使用ImageView的所有属性。

<android.support.design.widget.FloatingActionButton
android:id="@+id/floatingActionButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:background="@drawable/floatbutton"
android:src="@mipmap/ok"
app:borderWidth="0dp"
app:rippleColor="#33728dff"
app:elevation="8dp"
app:pressedTranslationZ="16dp"
        />

7.TabLayout类似于今日头条上的每一个tab，一般是和ViewPager联动，可滑动。

<android.support.design.widget.TabLayout
    android:id="@+id/tablayout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:tabMode="scrollable"
    app:tabIndicatorColor="@color/ssxinhongse1"
    app:tabTextAppearance="@style/TextAppearanceBig"
    app:tabSelectedTextColor="@color/ssxinhongse1"
    />
<View
    android:layout_width="match_parent"
    android:layout_height="1dp"
    android:background="@color/ssxinheise2_press"
    />
<android.support.v4.view.ViewPager
    android:id="@+id/vp"
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="1"/>

8.SnackBar类似于Toast的一个控件。

 Snackbar snackbar =
            Snackbar.make(fab, "过年了，过年了", Snackbar.LENGTH_LONG)
                    .setAction("去过年", new View.OnClickListener() {
                        @Override
                        public void onClick(View view) {
                            Toast.makeText(MainActivity.this, "你点击了右边的按钮", Toast.LENGTH_LONG).show();                    }
                    });
    //获取Snackbar的view
    View snackbarview = snackbar.getView();
    Snackbar.SnackbarLayout snackbarLayout(Snackbar.SnackbarLayout)snackbarview;
	ckbarview.setBackgroundColor(0xffffffff);
    //要添加图片的布局
    View add_view = LayoutInflater.from(snackbarview.getContext()).inflate(R.layout.snackbar_main,null);
	//文字的颜色
	((TextView) snackbarview.findViewById(R.id.snackbar_text)).setTextColor(Color.parseColor("#FF0000"));
	//按钮的颜色
	((Button)snackbarview.findViewById(R.id.snackbar_action)).setTextColor(Color.parseColor("#ff0000"));
    	LinearLayout.LayoutParams p = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT,LinearLayout.LayoutParams.WRAP_CONTENT);
    	p.gravity= Gravity.CENTER_VERTICAL;
	//添加布局
	snackbarLayout.addView(add_view, 0, p);
	snackbar.show();

以上是我简单的总结的，希望对大家会有所帮助，更好的使用，有问题随时扣我，谢谢大家。

QQ：1119348287（微信同步）。