淺析 TextInputLayout
Material Design(質感設計)是Google工程師基于傳統優秀的設計原則,結合豐富的創意和科學技術所發明的一套全新的界面設計語言,主要用于解決Android平臺界面風格不統一的問題。在2015年的Google I/O大會上退出的Design Support庫將Material Design中最具代表性的一些控件和效果進行了封裝，從而方便開發者調用相應的API來實現相應的MD風格。
本篇主要介紹TextInputLayout的使用。
首先聲明:
TextInputLayout是一個類似于LinearLayout存放空間的容器,TextInputLayout和ScrollView一樣只能接受一個子元素,并且子元素是EditText的類型。
接下來介紹TextInputLayout的使用:
首先添加Gradle依賴:
現在我們就可以使用TextInputLayout控件了。
布局文件中具體使用:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools" android:id="@+id/activity_main"
android:layout_width="match_parent" android:layout_height="match_parent"
android:orientation="vertical"
tools:context="com.fuyunwang.myapplication.MainActivity">
<android.support.design.widget.TextInputLayout
android:id="@+id/accoutinput"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="請輸入手機號"
>
<EditText
android:id="@+id/accout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="phone"
android:singleLine="true"
/>
</android.support.design.widget.TextInputLayout>
<android.support.design.widget.TextInputLayout
android:id="@+id/passwordinput"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="請輸入密碼"
>
<EditText
android:id="@+id/password"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</android.support.design.widget.TextInputLayout>
<Button
android:id="@+id/accout_sign_in_button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"
style="?android:textAppearanceSmall"
android:text="注冊"
android:textStyle="bold"
android:textColor="@color/colorAccent"
android:background="@color/colorPrimary"
/>
</LinearLayout>
其中,android:hint屬性指定了浮動標簽所顯示的內容。當然也可以直接使該屬性失效: app:hintEnabled="false" ,
此外對于浮動標簽的顯示隱藏切換有一個過渡動畫,我們可以通過 app:hintAnimationEnabled="false" 來取消該效果。
指定輸入的最大值： app:counterMaxLength="11" ,一旦在xml代碼中指定了最大值,代碼中可以通過 accountinput.getcounterMaxLength() 來獲取設置的值。
設置錯誤提示:
首先確保錯誤提示的功能是開啟的。
xml方式: app:errorEnabled="true"
代碼方式: accountinput.setErrorEnabled(true)
如果要關閉錯誤提示:
取消錯誤提示:
方式一:
accoutinput.setEnable(true);
passwordinput.setEnable(true);
//setEnabled設置之后不會自動的取消錯誤提示,只有置為空之后才會取消
accoutinput.setError(null);
passwordinput.setError(null);
方式二:
accountinput.setErrorEnable(false);
passwordinput.setErrorEnable(false);
方式三:
app:errorEnabled="false"
我這里辨析一下,xml和java代碼是一致的,其中errorEnable是表示是否開啟顯示錯誤的功能;error指的是當錯誤發生時在TextInputLayout下會有錯誤的提示并且我們仍然可以輸入;而enable不同,當我們設置為false的時候,整個空間處于不可用的狀態,我們無法輸入值
常見使用方式:
editText.addTextChangedListener(new TextWatcher() {
@Override
public void beforeTextChanged(CharSequence charSequence, int i, int i1, int i2) {
}
@Override
public void onTextChanged(CharSequence charSequence, int i, int i1, int i2) {
if (charSequence.toString().length()>5){
inputLayout.setCounterMaxLength(5);
inputLayout.setError("您的輸入超出了5個字符");
// inputLayout.setEnabled(false); 當輸入的值為6個的時候控件處于不可用狀態,一般這種處理方式極少用
}else{
// inputLayout.setErrorEnabled(false); //注意此代碼作用相當于下面的兩行代碼
inputLayout.setEnabled(true);
inputLayout.setError(null);
}
}
@Override
public void afterTextChanged(Editable editable) {
}
});
在實際的應用中,如果我們需要在編輯的時候自動的取消錯誤的提示
accout.addTextChangedListener(new TextWatcher() {
@Override
public void beforeTextChanged(CharSequence charSequence, int i, int i1, int i2) {
}
@Override
public void onTextChanged(CharSequence charSequence, int i, int i1, int i2) {
}
@Override
public void afterTextChanged(Editable editable) {
if(accoutinput.getError()!=null){
accoutinput.setError(null);
}
}
});
關于密碼效果的使用,在EditText中指定類型為textPassword,并且在TextInputLayout中指定 app:passwordToggleEnabled="true" ,可以得到密碼是否可見的效果。
<android.support.design.widget.TextInputLayout
android:id="@+id/passwordinput"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="請輸入密碼"
app:hintAnimationEnabled="false"
app:passwordToggleEnabled="true"
>
<EditText
android:id="@+id/password"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="textPassword"
/>
</android.support.design.widget.TextInputLayout>
當然我們也會在輸入完成的時候取消煩人的軟鍵盤,此時我們可以在TextInputLayout上設置監聽事件onClick:
<android.support.design.widget.TextInputLayout
android:id="@+id/textInputLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:onClick="hideKeyBord"
app:hintAnimationEnabled="true"
app:counterMaxLength="5"
app:errorEnabled="true"
>
<EditText
android:id="@+id/editText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="text"
android:hint="請輸入用戶名:"
/>
</android.support.design.widget.TextInputLayout>
public void hideKeyBord(View v) {
View view=getCurrentFocus();
if(null!=view){
InputMethodManager manager= (InputMethodManager) getSystemService(Context.INPUT_METHOD_SERVICE);
manager.hideSoftInputFromWindow(view.getWindowToken(),InputMethodManager.HIDE_NOT_ALWAYS);
}
}
來自：http://blog.csdn.net/James_shu/article/details/55098500