Android Design Support Library使用详解——TextInputLayout与TextInputEditText
TextInputLayout
在谷歌的Material Design中,文本输入是这样表现的:当用户点击输入框想要输入文字时,如果输入框是空的,那么它的提示文字(hint)就会变小并且同时移动到输入框的上方;如果文字不为空,则上方一直浮着这个提示文字(见https://material.google.com/components/text-fields.html#text-fields-input )。并且在I/O大会的视频上,我们可以看到整个的动画过程很优美流畅。在design support library中,TextInputLayout就是提供了它的实现。
使用
通过TextInputLayout来实现上述这种效果很简单,就是在布局代码中每一个EditText外面再套上一个TextInputLayout就可以了,代码如下。注意一个TextInputLayout只能套一个EditText,否则会抛异常。
<android.support.design.widget.TextInputLayout
android:id="@+id/mobile_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@id/image_title">
<EditText
android:id="@+id/mobile"
style="@style/InputEditText.Login"
android:drawableLeft="@drawable/icon_small_phone"
android:hint="@string/hint_mobile"
android:inputType="number"
android:maxLength="11"/>
</android.support.design.widget.TextInputLayout>
编译运行,效果出现。
显示错误消息
除了显示提示文字,TextInputLayout还提供了显示错误消息的接口。显示的方法也很简单,以前我们是通过TextView的setError(String)来显示,现在改为调用TextInputLayout的setError(String)就可以了。代码如下:
ViewParent parent = editText.getParent();
if (parent instanceof TextInputLayout) {
((TextInputLayout)parent).setError(message);
}
editText.setError(message);
错误消息会直接显示在编辑框下面,并且不像EditText那样必须要获得焦点才能显示出来。如图所示:
除了显示错误消息之外,我们还需要清空错误消息,毕竟不能在用户改正之后还一直显示它吧。清空错误消息很简单,只需要调用它的API inputLayout.setErrorEnabled(false);即可。比如我们可以在用户修改EditText时调用它:
ViewParent viewParent = inputText.getParent();
if (viewParent != null && viewParent instanceof TextInputLayout) {
final TextInputLayout inputLayout = (TextInputLayout) viewParent;
inputText.addTextChangedListener(new TextWatcher() {
@Override
public void onTextChanged(CharSequence s, int start, int before, int count) {
inputLayout.setErrorEnabled(false);
}
});
}
统计输入字数
TextInputLayout还封装了输入框的输入字数的统计。这一特性在一些字数受限的功能中可是大有用处,比如发个微博提交个用户反馈,通常都会限定一个最大字数,因而需要显示给用户已经输入了多少个字。
统计字数默认是不开启的,我们可以在属性里配置:
<android.support.design.widget.TextInputLayout
android:id="@+id/password_layout"
app:counterEnabled="true"
app:counterTextAppearance="@style/counter"
app:counterMaxLength="8"
app:counterOverflowTextAppearance="@style/counterOverflow"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@id/mobile_layout"
android:layout_marginBottom="@dimen/margin_double">
counterOverflow定义:
<style name="counterOverflow">
<item name="android:textColor">@color/red</item>
</style>
我们可以只配置counterEnabled,这样的话它就只会显示输入的字数。而counterTextAppearance属性则用于配置计数文本外观。counterMaxLength用于配置最大字数,当配置了它时,就必须再配置counterOverflowTextAppearance,否则当用户输入的字数超过这个最大字数时会引发异常。
下图是我们配置后的运行效果:
其他属性与方法请参数API文档,这里不再赘述。
TextInputEditText
在上一节中,我们可以看到TextInputLayout与EditText在搭配使用当中,对于所需的功能都处理得非常好,那么,为什么还要有TextInputEditText呢?
原因很简单,TextInputEditText是为了填坑的。
当我们的界面处于横屏时,点击一个EditText,默认情况下不是在它下面弹出键盘,而是进入到输入法的一个全屏的输入界面(通过配置android:imeOptions="flagNoExtractUi"可以设为直接在当前界面显示)。
一般在我们要弹出输入法时,它会与对应的View建立一个连接,用于两者之间的互动,比如获取输入提示hint,然后在刚才所述的情况中显示到输入法的输入界面上。但是当我们为EditText外面套上一个TextInputLayout时,TextInputLayout会拿到EditText的hint显示出来并把EditText本身的hint设为空。这样如果跳到输入法的输入界面上,就显示不了我们所设置的提示文本了。所以TextInputEditText重写了EditText的onCreateInputConnection(EditorInfo outAttrs)方法,把父容器的hint内容传给EditorInfo,下面就是它唯一做的事情:
@Override
public InputConnection onCreateInputConnection(EditorInfo outAttrs) {
final InputConnection ic = super.onCreateInputConnection(outAttrs);
if (ic != null && outAttrs.hintText == null) {
// If we don't have a hint and our parent is a TextInputLayout, use it's hint for the
// EditorInfo. This allows us to display a hint in 'extract mode'.
final ViewParent parent = getParent();
if (parent instanceof TextInputLayout) {
outAttrs.hintText = ((TextInputLayout) parent).getHint();
}
}
return ic;
}
所以当我们使用了TextInputLayout时,就需要把我们的EditText换成TextInputEditText。
下面两张图分别是使用EditText及TextInputEditText的运行效果:
Android Design Support Library使用详解——TextInputLayout与TextInputEditText的更多相关文章
- Android Design Support Library使用详解
Android Design Support Library使用详解 Google在2015的IO大会上,给我们带来了更加详细的Material Design设计规范,同时,也给我们带来了全新的And ...
- Android Design Support Library使用详解——Snackbar
Google在2015 I/O大会上,给我们带来了更加详细的Material Design规范,同时也引入了Android Design Support Library,为我们提供了基于Materia ...
- Android Design Support Library(2)- TextInputLayout的使用
原创文章,转载请注明 http://blog.csdn.net/leejizhou/article/details/50494634 这篇文章介绍下Android Design Support Lib ...
- Android Design Support Library初探,NavigationView实践
前言 在前几天的IO大会上,Google带来了Android M,同时还有Android支持库的新一轮更新,其中更是增加一个全新的支持库Android Design Support Library,包 ...
- 【转】【翻】Android Design Support Library 的 代码实验——几行代码,让你的 APP 变得花俏
转自:http://mrfufufu.github.io/android/2015/07/01/Codelab_Android_Design_Support_Library.html [翻]Andro ...
- Android Design Support Library 的 代码实验——几行代码,让你的 APP 变得花俏
原文:Codelab for Android Design Support Library used in I/O Rewind Bangkok session--Make your app fanc ...
- Codelab for Android Design Support Library used in I/O Rewind Bangkok session
At the moment I believe that there is no any Android Developer who doesn't know about Material Desig ...
- Material Design 开发利器:Android Design Support Library 介绍
转自:https://blog.leancloud.cn/3306/ Android 5.0 Lollipop 是迄今为止最重大的一次发布,很大程度上是因为 material design —— 这是 ...
- Android Design Support Library——Navigation View
前沿 Android 从5.0开始引入了Material design元素的设计,这种新的设计语言让整个安卓的用户体验焕然一新,google在Android Design Support Librar ...
随机推荐
- 使用 WTForms 进行表单验证的例子
#使用 WTForms 进行表单验证的例子 from wtforms import Form from wtforms import BooleanField from wtforms import ...
- requests-证书验证
import requests #response = requests.get('https://www.12306.cn') #print(response.status_code) #以上会显示 ...
- 模拟Paxos算法及其简单学习总结
一.导读 Paxos算法的流程本身不算很难,但是其推导过程和证明比较难懂.在Paxos Made Simple[1]中虽然也用了尽量简化的流程来解释该算法,但其实还是比较抽象,而且有一些细节问题没有交 ...
- ProxySQL 读写分离实践
前言 ProxySQL是一个高性能的MySQL中间件,拥有强大的规则引擎.具有以下特性: 连接池,而且是 multiplexing 主机和用户的最大连接数限制 自动下线后端DB 延迟超过阀值 ping ...
- Spring-cloud(五) 使用Ribbon进行Restful请求
写在前面 本文由markdown格式写成,为本人第一次这么写,排版可能会有点乱,还望各位海涵. 主要写的是使用Ribbon进行Restful请求,测试各个方法的使用,代码冗余较高,比较适合初学者,介意 ...
- [LeetCode] 24 Game 二十四点游戏
You have 4 cards each containing a number from 1 to 9. You need to judge whether they could operated ...
- PHPCMS v9.6.0 任意文件上传漏洞分析
引用源:http://paper.seebug.org/273/ 配置了php debug的环境,并且根据这篇文章把流程走了一遍,对phpstorm的debug熟练度+1(跟pycharm一样) 用户 ...
- SpringMVC入门到精通(一)
推荐一个很不错的学习博客 http://jinnianshilongnian.iteye.com/blog/1752171
- [WC 2006]水管局长数据加强版
Description SC省MY市有着庞大的地下水管网络,嘟嘟是MY市的水管局长(就是管水管的啦),嘟嘟作为水管局长的工作就是:每天供水公司可能要将一定量的水从x处送往y处,嘟嘟需要为供水公司找到一 ...
- [POJ]1279: Art Gallery
题目大意:有一个N边形展馆,问展馆内有多少地方可以看到所有墙壁.(N<=1500) 思路:模板题,半平面交求出多边形的核后计算核的面积. #include<cstdio> #incl ...