Material Design控件之TextInputLayout

Material Design Android官方控件之介紹

TextInputLayout

• extends LinearLayout
• 一個TextInputLayout有且只有一個EditText(TextInputEditText)

簡單使用

    <android.support.design.widget.TextInputLayout
        android:layout_width="0dp"
        android:layout_height="100dp"
        android:layout_marginLeft="8dp"
        app:counterEnabled="true"
        app:passwordToggleEnabled="true"
        android:id="@+id/til_password"
        app:counterMaxLength="16"
        app:hintTextAppearance="@style/hintAppearance"
        app:errorTextAppearance="@style/errorAppearance"
        app:passwordToggleTint="#ababab"
        android:layout_marginRight="8dp" android:layout_marginTop="8dp"
        app:layout_constraintLeft_toLeftOf="parent" app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/til_phone"
        app:layout_constraintHorizontal_bias="0.0">
        <!--app:passwordToggleDrawable="@mipmap/ic_launcher"-->
        <!--app:passwordToggleTint="@color/colorAccent"-->
        <!--app:passwordToggleTintMode="screen"-->

        <android.support.design.widget.TextInputEditText
            android:id="@+id/et_password"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:hint="密碼"
            android:inputType="textPassword"
             />
    </android.support.design.widget.TextInputLayout>

右下角輸入數字

app:counterEnabled="true"
app:counterMaxLength="11"

關閉浮動標籤或者動畫

app:hintAnimationEnabled="false"
app:hintEnable="false"

密碼的一些屬性

android:inputType="**Password"//必須爲Password類型
app:passwordToggleEnabled="true"//顯示顯示隱藏按鈕
app:passwordToggleDrawable="@mipmap/ic_launcher"//指定圖標
app:passwordToggleTint="@color/colorAccent"//按鈕着色
//screen,src_in,src_atop,src_over,multiply等幾種着色模式
app:passwordToggleTintMode="screen" // 按鈕着色模式

文字的一些屬性

app:counterTextAppearance="@style/MyStyle"//計數文字格式
app:hintTextAppearance="@style/hintAppearance"//提示文字格式
app:errorTextAppearance="@style/errorAppearance"//錯誤提示文字格式

錯誤提示
TextInputLayout提供了一個更好的UI效果的錯誤提示。

textInputLayout.setError("只是展示下錯誤的顯示樣式");
editText.setError("只是展示下錯誤的顯示樣式");//普通的EditText提示

詳細用法請看MaterialDesignWidget.TextInputLayoutActivity

源碼地址：https://github.com/LinweiJ/MaterialDesignWidget