Android开发手册TextInputLayout样式使用示例


Posted in Java/Android onJune 10, 2022

前言

前面小空带同学们学了EditText控件,又用其实践做了个验证码功能,以为这就完了吗?

然而并没有。

Android在5.0以后引入了Materia Design库的设计,现在又有了Jetpack UI库的设计。帮助开发者更高效的实现炫酷的UI界面,降低开发门槛。

Jetpack我们后面再说,承接之前的EditText,先说说Materia Design里的TextInputLayout。

使用方式是将TextInputEditText或EditText套到TextInputLayout内,这样友情提示信息hit就可以带有动画(上浮为标题),计数/密码可见等属性设置。  

布局代码

<com.google.android.material.textfield.TextInputLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:hint="请输入用户名">
    <EditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:inputType="number" />
</com.google.android.material.textfield.TextInputLayout>
<com.google.android.material.textfield.TextInputLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="60dp"
    android:hint="请输入密码">
    <EditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:inputType="textPassword" />
</com.google.android.material.textfield.TextInputLayout>

Android开发手册TextInputLayout样式使用示例

这样就简单的实现了一个效果。我们在继续深入添加些属性:

<com.google.android.material.textfield.TextInputLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:hint="请输入用户名"
    app:hintAnimationEnabled="false">
    <EditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:inputType="number" />
</com.google.android.material.textfield.TextInputLayout>
<com.google.android.material.textfield.TextInputLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="60dp"
    android:hint="请输入密码"
    app:counterEnabled="true"
    app:counterMaxLength="10"
    app:passwordToggleEnabled="true">
    <EditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:inputType="textPassword" />
</com.google.android.material.textfield.TextInputLayout>

从运行结果可以看出,设置了字数限制后,自动在编辑框右下角显示最大字数和当前输入字数(随着输入情况实时变化),并且更改了颜色样式

?属性介绍

  • app:boxCollapsedPaddingTop 设置用于编辑文本在框模式下折叠的顶部填充的值 
  • app:boxStrokeErrorColor 在显示错误时设置轮廓框的描边颜色。 
  • app:boxStrokeWidth 设置描边的宽度 
  • app:boxStrokeWidthFocused 设置获取焦点框的描边宽度 
  • app:counterEnabled     是否显示计数器 
  • app:counterMaxLength 设置计数器的最大值,与counterEnabled同时使用 
  • app:counterTextAppearance       计数器的字体样式 
  • app:counterOverflowTextAppearance 输入字符大于我们限定个数字符时的字体样式 
  • app:errorEnabled  是否显示错误信息 
  • app:errorTextAppearance&nbsp;   错误信息的字体样式 
  • app:endIconCheckable 设置是否显示结束图标 
  • app:endIconContentDescription 为结束图标设置内容说明 
  • app:endIconDrawable 设置结束图标图像 
  • app:endIconMode 设置模式 
  • app:endIconTintMode 指定混合模式,用于将 指定的色调应用于可绘制的结束图标。 
  • app:helperText 设置帮助文本 
  • app:helperTextEnabled 设置是否激活帮助文本 
  • app:helperTextTextColor 设置帮助文本颜色 
  • app:hintAnimationEnabled  是否显示hint的动画,默认true 
  • app:hintEnabled    是否使用hint属性,默认true 
  • app:hintTextAppearance      设置hint的文字样式(指运行动画效果之后的样式) 
  • app:passwordToggleDrawable    设置密码开关Drawable图片,于passwordToggleEnabled同时使用 
  • app:passwordToggleEnabled      是否显示密码开关图片,需要EditText设置inputType 
  • app:passwordToggleTint     设置密码开关图片颜色 
  • app:passwordToggleTintMode    设置密码开关图片(混合颜色模式),与passwordToggleTint同时使用

以上就是Android开发手册TextInputLayout样式使用示例的详细内容,更多关于Android开发TextInputLayout样式的资料请关注三水点靠木其它相关文章!


Tags in this post...

Java/Android 相关文章推荐
Feign调用全局异常处理解决方案
Jun 24 Java/Android
Java基于字符界面的简易收银台
Jun 26 Java/Android
Java移除无效括号的方法实现
Aug 07 Java/Android
Java 实战项目之家居购物商城系统详解流程
Nov 11 Java/Android
springboot新建项目pom.xml文件第一行报错的解决
Jan 18 Java/Android
SpringBoot+Redis实现布隆过滤器的示例代码
Mar 17 Java/Android
解决springboot druid数据库连接失败后一直重连的方法
Apr 19 Java/Android
Elasticsearch Recovery 详细介绍
Apr 19 Java/Android
MyBatis核心源码深度剖析SQL语句执行过程
May 20 Java/Android
Android studio 简单计算器的编写
May 20 Java/Android
java.util.NoSuchElementException原因及两种解决方法
Jun 28 Java/Android
OpenFeign实现远程调用
Aug 14 Java/Android
Java实现简单小画板
Android开发EditText禁止输入监听及InputFilter字符过滤
Jun 10 #Java/Android
详解Spring Bean的配置方式与实例化
Jun 10 #Java/Android
Spring JPA 增加字段执行异常问题及解决
Jun 10 #Java/Android
Android开发手册自定义Switch开关按钮控件
Jun 10 #Java/Android
java实现面板之间切换功能
Jun 10 #Java/Android
Spring Boot项目如何优雅实现Excel导入与导出功能
Jun 10 #Java/Android
You might like
PHP读书笔记整理_结构语句详解
2016/07/01 PHP
PHP中常用的三种设计模式详解【单例模式、工厂模式、观察者模式】
2019/06/14 PHP
两个select之间option的互相添加操作(jquery实现)
2009/11/12 Javascript
用Jquery实现可编辑表格并用AJAX提交到服务器修改数据
2009/12/27 Javascript
javascript获取ckeditor编辑器的值(实现代码)
2013/11/18 Javascript
js实现的全国省市二级联动下拉选择菜单完整实例
2015/08/17 Javascript
jQuery实现垂直半透明手风琴特效代码分享
2015/08/21 Javascript
分享jQuery插件的学习笔记
2016/01/14 Javascript
javascript实现数组去重的多种方法
2016/03/14 Javascript
通过原生JS实现为元素添加事件的方法
2016/11/23 Javascript
JavaScript运动框架 解决速度正负取整问题(一)
2017/05/17 Javascript
Ionic3 UI组件之Gallery Modal详解
2017/06/07 Javascript
angular5 httpclient的示例实战
2018/03/12 Javascript
JQuery通过后台获取数据遍历到前台的方法
2018/08/13 jQuery
在LayUI图片上传中,解决由跨域问题引起的请求接口错误的方法
2019/09/24 Javascript
vue点击Dashboard不同内容 跳转到同一表格的实例
2020/11/13 Javascript
python基础入门详解(文件输入/输出 内建类型 字典操作使用方法)
2013/12/08 Python
Python urllib、urllib2、httplib抓取网页代码实例
2015/05/09 Python
Python 编码规范(Google Python Style Guide)
2018/05/05 Python
将Python文件打包成.EXE可执行文件的方法
2019/08/11 Python
Python values()与itervalues()的用法详解
2019/11/27 Python
Python实现自动访问网页的例子
2020/02/21 Python
Python实现画图软件功能方法详解
2020/07/28 Python
python 爬取B站原视频的实例代码
2020/09/09 Python
伦敦一家非常流行的时尚精品店:Oxygen Boutique
2017/01/15 全球购物
美国校园市场:OCM
2017/06/08 全球购物
俄罗斯儿童和青少年服装、鞋子及配件的在线商店:Orby
2020/02/20 全球购物
介绍一下EJB的体系结构
2012/08/01 面试题
八一慰问活动方案
2014/02/07 职场文书
《雕塑之美》教学反思
2014/04/24 职场文书
材料专业大学毕业生自荐书
2014/07/02 职场文书
公司授权委托书范文
2014/09/21 职场文书
假如给我三天光明:舟逆水而行,人遇挫而达 
2019/10/29 职场文书
Python类方法总结讲解
2021/07/26 Python
Python Pygame实战之塔防游戏的实现
2022/03/17 Python
Python中npy和mat文件的保存与读取
2022/04/24 Python