MaterialDesign之TextInputLayout和TextInputEditText

最近总结一下自己开发中常见Material Design的一些控件,TextInputLayout的使用及解析常用的属性,嘻嘻。

希望给大家带来帮助,同时通过学习来发现自己的不足,希望大家给予一些建议,哈哈。接下来开始撸代码。

首先在build.gradle中添加依赖如下:

dependencies {

compile'com.android.support:appcompat-v7:25.0.1'

compile'com.android.support:design:25.0.1'

}

查看源码发现TextInputLayout布局封装以前最常用的编辑文本框EditText,这就让我们不禁想起EditText的友好画面了吧,不过现在这个TextInputLayout会让你更加喜欢上了这个优雅的控件,

在源码解释中:TextInputLayout的作用是:显示一个浮动的标签-->当提示隐藏由于用户输入文本。(英语比较渣渣);

因为TextInputLayout封装了EditText,所以在使用时还是不开EditText。在XML文件中声明如下:

android:id="@+id/login_til_username"

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:layout_margin="20dp"

>

android:id="@+id/login_et_username"

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:hint="用户名"

/>

这里的属性:android:hint="用户名",当我点击EditText时,该hint的文本会悬浮在EditText的上方,这让我们的页面布局显示一个非常友好的设置。

接下来让我们来实践一下这个布局的常用的属性。

默认显示横线的颜色是默认主题中 colorAccent

(1)app:counterEnabled="true"字符计数是否可用

(2)app:counterMaxLength="24"设计计算最大的长度如:24

android:id="@+id/til_username"

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:hint="用户名"

app:counterEnabled="true"

app:counterMaxLength="24"

>

(3)app:counterOverflowTextAppearance ="@style/TextInputOverflowText"计数超过最大长度时显示的文本样式风格(悬浮文本、底部横线均发生改变)