TextInputLayout介紹
TextInputLayout是Google基于Material Design風(fēng)格出現(xiàn)的一個(gè)文本輸入布局。主要特點(diǎn)在樣式上，官方第一句介紹是當(dāng)輸入的文本顯示或者隱藏的時(shí)候智哀，EditText顯示浮動(dòng)標(biāo)簽的布局。
先看看樣式
樣式其實(shí)是有動(dòng)畫效果的
使用方法
引入包環(huán)境
由于這個(gè)控件在這個(gè)android.support.design.widget包下，所以要查看是否已經(jīng)引入了:
compile ‘com.android.support:design:22.2.0’
compile ‘com.android.support:appcompat-v7:22.2.0’
版本可根據(jù)需求自行調(diào)整
在布局中加入代碼
<android.support.design.widget.TextInputLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.design.widget.TextInputEditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="@string/form_username"/>
</android.support.design.widget.TextInputLayout>
樣式修改
將默認(rèn)的AppTheme主體添加如下屬性
<item name="android:textColorHint">@colorcommonTextColorWhite</item>
<item name="colorControlNormal">@colorcommonTextColorWhite</item>
<item name="colorControlActivated">@colorcommonTextColorWhite</item>
<item name="colorControlHighlight">@colorcommonTextColorWhite</item>
解釋：
| 屬性 | 含義 |
|---|---|
| android:textColorHint | 提示字體的顏色 |
| colorControlNormal | 下劃線沒(méi)有獲取焦點(diǎn)娘摔，也就是默認(rèn)的顏色 |
| colorControlActivated | 點(diǎn)擊時(shí)下劃線的顏色 |
計(jì)數(shù)器功能
使用
TextInputLayout還實(shí)現(xiàn)了輸入時(shí)候記錄輸入字符數(shù)的功能，可以通過(guò)設(shè)置參數(shù)實(shí)現(xiàn),導(dǎo)入如下環(huán)境
xmlns:app="http://schemas.android.com/apk/res-auto"
添加如下屬性
app:counterEnabled="true"
app:counterMaxLength="11"
app:counterTextAppearance="@style/text_style"
| 屬性 | 含義 |
|---|---|
| app:counterEnabled | 是否開啟此功能 |
| app:counterMaxLength | 計(jì)數(shù)器限制的最大值 |
| app:counterTextAppearance | 計(jì)數(shù)器的字體樣式 |
錯(cuò)誤提示功能
TextInputLayout還有個(gè)錯(cuò)誤提示的功能唤反，可以直接通過(guò)api使用凳寺。
添加如下代碼
app:errorEnabled="true"
app:errorTextAppearance="@style/error_text_style"
在java代碼中設(shè)置
textInputLayout.setError("這是textInputLayout的錯(cuò)誤提示");
mobile.setError("這是EditText的錯(cuò)誤提示");
密碼可視功能
將inputType的類型設(shè)置為password之后鸭津，可以通過(guò)設(shè)置如下屬性。而且默認(rèn)效果支持Material Design效果和默認(rèn)動(dòng)畫读第，也是酷酷的曙博。
app:passwordToggleEnabled="true"
app:passwordToggleTint="@color/colorAccent"
| 屬性 | 含義 |
|---|---|
| app: passwordToggleEnabled | 是否開啟密碼可視的功能 |
| app: passwordToggleTint | 修改提示圖標(biāo)的顏色 |
總結(jié)
google繼Android5.0后出了一系列Material Design風(fēng)格的控件，也引起了部分web端與Android端的的Material Design風(fēng)格化怜瞒。個(gè)人認(rèn)為這也是一個(gè)比較好的設(shè)計(jì)語(yǔ)言父泳。如果利用的好，將會(huì)對(duì)APP的交互很有利吴汪。
