android.support.design.widget包下的CoordinatorLayout、AppBarLayout、TextInputLayout、FloatingActionButton、

          在前不久的谷歌2015 I/O大会上，发布了Android新版本M，在这次的I/O大会上谷歌对Android并没有很大的改变，主要是修改完善之前Android L版本。不过在谷歌推出Material Design设计风格之后，还是做了很多风格上的兼容，比如v7包的 RecyclerView，CardView，Palette等，这次的I/O大会上也继续完善了MD设计支持库，这次谷歌推出了Android Design Support Library 库，全面支持MD设计风格的UI效果。Design Support Library库吸收了8 个新的 material design 组件！最低支持 Android2.1，其实很多组件都是Github上比较火的，只是谷歌把它官方化了，便于开发者使用。今天我们来学习FloatingActionButton，TextInputLayout，Snackbar，TabLayout 四种控件。

使用android.support.design下的类要在build.gradle中配置如下代码

dependencies {
    compile fileTree(dir: 'libs', include: ['*.jar'])
    compile 'com.android.support:appcompat-v7:22.2.0'
    compile 'com.android.support:design:22.2.0'
    compile 'com.android.support:recyclerview-v7:22.2.0'
    compile 'com.android.support:cardview-v7:22.2.0'
    compile 'com.android.support:palette-v7:22.2.0'
    compile 'de.hdodenhof:circleimageview:1.3.0'
}

代码如下：

package com.example.administrator.test;

import android.content.Intent;
import android.os.Bundle;
import android.support.design.widget.FloatingActionButton;
import android.support.design.widget.Snackbar;
import android.support.v7.app.AppCompatActivity;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.widget.Button;
import android.widget.LinearLayout;


public class MainActivity extends AppCompatActivity implements View.OnClickListener{

    private LinearLayout layout;
    private FloatingActionButton button;
    private Button button_tableLayout;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        layout = (LinearLayout) findViewById(R.id.layout);
        button = (FloatingActionButton) findViewById(R.id.button);
        button_tableLayout = (Button) findViewById(R.id.button_tableLayout);

        button.setOnClickListener(this);
        button_tableLayout.setOnClickListener(this);
    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.menu_main, menu);
        return true;
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        // Handle action bar item clicks here. The action bar will
        // automatically handle clicks on the Home/Up button, so long
        // as you specify a parent activity in AndroidManifest.xml.
        int id = item.getItemId();

        //noinspection SimplifiableIfStatement
        if (id == R.id.action_settings) {
            return true;
        }

        return super.onOptionsItemSelected(item);
    }

    @Override
    public void onClick(View v) {

        switch (v.getId()){
            case R.id.button: //FloatingActionButton and Snackbar

                //Snackbar提供了一个介于Toast和AlertDialog之间轻量级控件，它可以很方便的提供消息的提示和动作反馈
                Snackbar.make(layout, "Hello,I am Snackbar................................." +
                        "....................................................................." +
                        ".................osfjalkjlkjflkjxzlkjlk", Snackbar.LENGTH_LONG).setAction(

                        "取消", new View.OnClickListener() {

                            @Override
                            public void onClick(View v) {

                            }
                        }
                ).show();
                break;

            case R.id.button_tableLayout: //TabLayout

                Intent intent = new Intent(this,TabLayoutActivity.class);
                startActivity(intent);
                break;
        }

    }
}

Xml布局如下：

<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:layout_width="match_parent"
              android:layout_height="match_parent"
              android:orientation="vertical"
              android:paddingBottom="@dimen/activity_vertical_margin"
              android:paddingLeft="@dimen/activity_horizontal_margin"
              android:paddingRight="@dimen/activity_horizontal_margin"
              android:paddingTop="@dimen/activity_vertical_margin"
              tools:context=".MainActivity"
    android:id="@+id/layout">

    <!-- -->
    <android.support.design.widget.TextInputLayout
        style="@style/textInputlayout"
        app:hintTextAppearance="@style/edit_hint">

        <EditText
            style="@style/edit"
            android:hint="用户名"/>
    </android.support.design.widget.TextInputLayout>

    <android.support.design.widget.TextInputLayout
        style="@style/textInputlayout"
        android:layout_marginTop="10dp"
        app:hintTextAppearance="@style/edit_hint">

        <EditText
            style="@style/edit"
            android:hint="手机号码"/>
    </android.support.design.widget.TextInputLayout>

    <!-- -->
    <android.support.design.widget.FloatingActionButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/ic_plus"
        app:fabSize="mini"
        app:backgroundTint="#0000FF"/>

    <android.support.design.widget.FloatingActionButton
        android:id="@+id/button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/ic_plus"
        app:fabSize="normal"
        app:backgroundTint="#FF0000"/>

    <Button
        android:id="@+id/button_tableLayout"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="TableLayout"/>

</LinearLayout>

Style如下：

<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">

    <!-- 标题栏颜色 -->
    <item name="colorPrimary">#FFFFFF</item>
    <!--状态栏背景色-->
    <item name="colorPrimaryDark">#3A5FCD</item>
    <!-- EditText光标和原始边框颜色 -->
    <item name="colorAccent">#FF0000</item>
    <!-- 整个应用中编辑框字体提示的颜色 -->
    <item name="android:textColorHint">#AEAEAE</item>
    <!--Activity背景色-->
    <item name="android:windowBackground">@android:color/white</item>
</style>

<!-- TextInputLayout布局样式 -->
<style name="textInputlayout">
    <item name="android:layout_width">match_parent</item>
    <item name="android:layout_height">55dp</item>
    <item name="android:background">@drawable/shape_edit_grey</item>
    <item name="android:textSize">16sp</item>
    <item name="android:gravity">center_vertical</item>
    <item name="android:paddingLeft">10dp</item>
    <item name="android:paddingRight">10dp</item>
    <item name="android:paddingTop">5dp</item>
</style>

<!-- EditText 布局样式 -->
<style name="edit">
    <item name="android:layout_width">match_parent</item>
    <item name="android:layout_height">wrap_content</item>
    <!--<item name="android:textCursorDrawable">@null</item>-->
    <item name="android:background">@null</item>
</style>

有不懂的可以和我交流 QQ：619285112