前言
今天给大家带来Material design系列的第二篇文章，TextInputLayout的使用。大家都知道，在EditText中有一个属性hint，能提示我们输入什么信息，当用户在EditText输入文字时，hint属性提示的文字就消失了，这样其实体验非常不好，所以今天的主角来了TextInputLayout，使用TextInputLayout能让hint属性提示的文字在用户输入时不消失，而是显示为EditText上方的浮动标签，先给大家看看对比图。
大家可以看到，当你输入的时候，hint提示语就没有了，体验很不好，那么再看看TextInputLayout的效果。
两者的差距很明显，TextInputLayout可以把hint提示语放到EditText上面。
使用
首先还是要先依赖，前面文章就说过，不再赘述，使用起来也很简单，只需要把TextInputLayout包裹你的EditText就可以，就像这样
<android.support.design.widget.TextInputLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="请输入用户名">
<EditText
android:id="@+id/et_name"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
</android.support.design.widget.TextInputLayout>
这里要注意了
1. TextInputLayout只接受一个子元素
2. 子元素只能是EditText
只要把TextInputLayout包裹EditText就能实现上面gif图里面的效果了。
TextInputLayout的一些属性、方法
-
textColorHint：修改hint的颜色
-
hintEnabled：是否使用hint属性，默认true
-
hintAnimatimock：是否开启hint提示信息的动画，默认true
-
hintTextAppearance：设置hint提示文本（在浮动标签时）的样式（大小、颜色等等）
-
errorTextAppearance：设置错误信息文本的样式（大小、颜色等等）
当文本输入类型为密码时，系统提供了一个开关来控制密码是否可见（默认为眼睛），此为design包24.0.2新提供的功能。
-
passwordToggleEnabled：控制密码可见开关是否启用
-
passwordToggleDrawable：设置密码可见开关的图标
-
passwordToggleTint：控制密码可见开关图标的颜色
-
passwordToggleTintMode：控制密码可见开关图标的背景颜色混合模式
改变EditText下划线和hint提示标签的颜色
相信这个每个小伙伴都会用到，关于这一点，谷歌把Design Support Library写的很好。每一个控件的颜色都是直接通过主题颜色绘制的，在 style.xml中指定。打开它添加colorAccent 到主题以改变表单的颜色。也就是说当你想改变颜色的时候，只需要改变colorAccent 的属性就好，举个栗子
限制输入
这里就拿手机号登录来说，我们限制的位数为11位。
使用起来也很简单，只需要在xml里面加上2行代码即可
第一行的意思是打开计数，第二个是要限制的字数。我们可以看到，当字数超过了的时候，TextInputLayout的颜色会发生变化，那么我们怎么样给用户相应的提示呢？这里就要在代码里面实现了，首先找到TextInputLayout，然后通过TextInputLayout的方法getEditText()拿到EditText，最终设置监听
在文本改变之后我们获取文本的长度，如果比我们设置的长度要大，那么就输出错误信息，也就是调用setError方法，并且要允许Error出现，也就是调用setErrorEnabled方法
最终实现效果图
密码明文和密文
当用户输入密码的时候，我们一般都是以密文的形式，但是如果用户不知道自己输的是什么的时候就想看一下自己到底输的是什么，这一点在确认密码的时候尤为重要，关于这一点，TextInputLayout也给我们提供了，先看看效果图
第一步，把EditText的inputType设置为textPassword
第二步，在TextInputLayout中添加一行属性app:passwordToggleEnabled="true"
当然，如果你感觉小眼睛不好看，你也可以自定义那个图案，使用
app:passwordToggleDrawable="@drawable/password_visible_invisible"就可以修改图标，密码可见和加密是两种状态，点击图片应该有相应的变化，所以这里使用selector 可以实现：
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@drawable/eye_open" android:state_checked="true"/>
<item android:drawable="@drawable/eye_close" android:state_checked="false"/>
</selector>
总结
今天的文章就写到这里，希望大家多多使用Material design library，做出更好看，用户体验更好的APP。
