一、概述

TextInputLayout通過對EditText進行包裝，擴充套件了EditText的功能，今天，我們就來介紹一下和TextInputLayout相關的知識：

• 輸入檢查
• 輸入計數
• 密碼隱藏

二、TextInputLayout

2.1 基本用法

• 首先，匯入TextInputLayout的依賴包：

compile 'com.android.support:design:25.3.1'
複製程式碼

• 之後，我們需要將TextInputLayout作為EditText的父容器以實現相關的功能，例如下面這樣，我們的佈局中有兩個EditText，都使用TextInputLayout把它們包裹起來。

<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_margin="20dp">
    <android.support.design.widget.TextInputLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <EditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:hint="Username"/>
    </android.support.design.widget.TextInputLayout>
    <android.support.design.widget.TextInputLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <EditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:hint="Password"/>
    </android.support.design.widget.TextInputLayout>
</LinearLayout>
複製程式碼

當EditText獲得焦點的時候，android:hint所指定的字串會以高亮的顏色顯示在EditText的上方，而當EditText失去焦點時，hint會以灰顯的方式顯示在EditText中，這就是TextInputLayout最基本的使用，它讓我們在輸入的過程當中仍然可以獲得當前EditText所關聯的提示。

2.2 輸入檢查

除了在EditText上面的提示之外，TextInputLayout還支援在EditText下方顯示提示，這種一般用於使用者在輸入過程中，輸入了不符合要求的文字，用來給予使用者錯誤提示。

private void checkError() {
        mPasswordEditText.addTextChangedListener(new TextWatcher() {

            @Override public void beforeTextChanged(CharSequence s, int start, int count, int after) {}

            @Override public void onTextChanged(CharSequence s, int start, int before, int count) {}

            @Override public void afterTextChanged(Editable s) {
                int len = s.length();
                if (len > MAX_PASSWORD_LEN) {
                    mPasswordTextInput.setError("Max Password len is " + MAX_PASSWORD_LEN);
                } else {
                    mPasswordTextInput.setErrorEnabled(false);
                }
            }
        });
}
複製程式碼

效果如下圖所示：

在上面的例子中，我們通過監聽EditText的輸入，然後在某個條件被觸發時，呼叫TextInputLayout的setError方法，以提示使用者，與setError相關的方法有：

• public void setError(@Nullable final CharSequence error) 設定錯誤提示的文字，它會被顯示在EditText的下方
• public void setErrorTextAppearance(@StyleRes int resId) 設定錯誤提示的文字顏色和大小
• public void setErrorEnabled(boolean enabled) 設定錯誤提示是否可用

2.3 輸入計數

TextInputLayout還支援對於輸入框內字元的實時統計，並在字元數超過閾值之後，改變輸入框及提示文字的顏色。

private void checkCount() {
        mPasswordTextInput.setCounterEnabled(true);
        mPasswordTextInput.setCounterMaxLength(MAX_PASSWORD_LEN);
}
複製程式碼

與輸入計數有關的方法有：

• public void setCounterEnabled(boolean enabled) 設定計數功能是否可用
• public void setCounterMaxLength(int maxLength) 設定計數功能的閾值

2.4 輸入時隱藏密碼

相信大家都有見到過這樣的輸入框，在輸入框的右邊有一個開關，可以讓使用者來決定輸入過程中的字元是否隱藏（以*號顯示），TextInputLayout也提供了這樣的功能： EditText的inputType為textPassword/textWebPassword/numberPassword時，通過下面的設定：

mPasswordTextInput.setPasswordVisibilityToggleEnabled(true);
複製程式碼

同時，我們也可以通過上面的方法來定義切換的圖示以及它的著色。

---

更多文章，歡迎訪問我的 Android 知識梳理系列：

• Android 知識梳理目錄：www.jianshu.com/p/fd82d1899…
• 個人主頁：lizejun.cn
• 個人知識總結目錄：lizejun.cn/categories/