• 效果如下：

20170207094559319.png

20170207094616679.png

TextInputLayout 控件表現得就像LinearLayout 一樣，它是一個容器。TextInputLayout 中只能放一個子元素，和ScrollView有點類似，并且子元素必須是EditText；

TextInputLayout 實現的功能就是當EditText中輸入第一個字母要隱藏hint的時候，TextInputLayout中會出現一個懸浮的標簽來顯示這個hint，還負責一個炫酷的的material 動畫

• 首先是怎樣引入TextInputLayout

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

• 布局如下：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:background="@mipmap/login_bg"
    tools:context="cn.hnshangyu.textinputlayout.MainActivity">

    <android.support.design.widget.TextInputLayout
        app:hintTextAppearance="@style/FloatingStyle"
        android:id="@+id/username"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true">

        <EditText
            android:layout_width="260dp"
            android:layout_height="wrap_content"
            android:inputType="phone"
            android:maxLines="1"
            android:padding="@dimen/padding_10"
            android:textColor="@color/white70"
            android:textColorHint="@color/white70" />
    </android.support.design.widget.TextInputLayout>

    <android.support.design.widget.TextInputLayout
        android:id="@+id/password"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:layout_below="@id/username"
        android:layout_marginTop="@dimen/padding_20">
        <EditText
            android:layout_width="260dp"
            android:layout_height="wrap_content"
            android:inputType="textPassword"
            android:maxLines="1"
            android:padding="@dimen/padding_10"
            android:textColor="@color/white70"
            android:textColorHint="@color/white70" />
    </android.support.design.widget.TextInputLayout>

</RelativeLayout>

在這里可以看到 app:hintTextAppearance="@style/FloatingStyle"這個屬性，這個屬性是干嘛的呢？

其實當在TextInputLayout中設置這個屬性后，就會讓hint字體的內容固定在EditText上方不會出現動畫效果，同時hint字體顏色變化在FloatingStyle中設置！如效果圖中的手機號輸入框...

• FloatingStyle的內容：

 <style name="FloatingStyle" parent="@android:style/TextAppearance">
        <item name="android:textColor">#e0c9c4c4</item>
        <item name="android:textSize">12sp</item>
    </style>

• 在MainActivity中對TextInputLayout進行設置

package cn.hnshangyu.textinputlayout;

import android.os.Bundle;
import android.support.design.widget.TextInputLayout;
import android.support.v7.app.AppCompatActivity;

import butterknife.Bind;
import butterknife.ButterKnife;

public class MainActivity extends AppCompatActivity {


    @Bind(R.id.username)
    TextInputLayout username;

    @Bind(R.id.password)
    TextInputLayout password;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_login);
        ButterKnife.bind(this);
        username.setHint(getResources().getString(R.string.phone_num));
        password.setHint(getResources().getString(R.string.input_password));
        username.setError(getResources().getString(R.string.phone_num_error));
    }
}

TextInputLayout既可以在輸入時把提示語顯示與EditText的上方，又能把錯誤信息提示顯示在EditText的下方。

TextInputLayout需要注意的幾點：

• TextInputLayout不能單獨使用，必須和EditText嵌套使用。

• 1個TextInputLayout只能包1個EditTExt。

再來看看比較常用的方法

1、setHint();設置提示語

2、setError();設置錯誤顯示信息

3、setErrorEnabled();設置錯誤信息是否顯示。true顯示，false不顯示。

4、getEditText();得到EditText的控件實例。

注意：

不用設置setErrorEnabled()為true也是可以的。因為這里會調用setErrorEnabled(true)。