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 相关文章推荐
spring项目中切面及AOP的使用方法
Jun 26 Java/Android
深入理解java.lang.String类的不可变性
Jun 27 Java/Android
每日六道java新手入门面试题,通往自由的道路
Jun 30 Java/Android
Java Kafka 消费积压监控的示例代码
Jul 01 Java/Android
JUnit5常用注解的使用
Jul 02 Java/Android
新手初学Java网络编程
Jul 07 Java/Android
gateway与spring-boot-starter-web冲突问题的解决
Jul 16 Java/Android
java设计模式--建造者模式详解
Jul 21 Java/Android
利用Sharding-Jdbc进行分库分表的操作代码
Jan 22 Java/Android
关于Mybatis中SQL节点的深入解析
Mar 19 Java/Android
Spring Boot配合PageHelper优化大表查询数据分页
Apr 20 Java/Android
Java 轮询锁使用时遇到问题
May 11 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
为了这两部电子管收音机,买了6套全新电子管和10粒刻度盘灯泡
2021/03/02 无线电
PHP 5昨天隆重推出--PHP 5/Zend Engine 2.0新特性
2006/10/09 PHP
PHP 执行系统外部命令 system() exec() passthru()
2009/08/11 PHP
php中计算程序运行时间的类代码
2012/11/03 PHP
微信自定义分享php代码分析
2016/11/24 PHP
PHP面相对象中的重载与重写
2017/02/13 PHP
Ubuntu 16.04下安装PHP 7过程详解
2017/03/28 PHP
微信公众平台开发教程⑥ 微信开发集成类的使用图文详解
2019/04/10 PHP
prototype1.4中文手册
2006/09/22 Javascript
让浏览器非阻塞加载javascript的几种方法小结
2011/04/25 Javascript
js查找某元素中的所有图片地址的方法
2014/01/16 Javascript
3个可以改善用户体验的AngularJS指令介绍
2015/06/18 Javascript
js实现简洁大方的二级下拉菜单效果代码
2015/09/01 Javascript
JavaScript操作 url 中 search 部分方法函数
2016/06/15 Javascript
Node.js连接mongodb实例代码
2017/06/06 Javascript
webpack学习--webpack经典7分钟入门教程
2017/06/28 Javascript
代码详解Vuejs响应式原理
2017/12/20 Javascript
jQuery实现容器间的元素拖拽功能
2020/12/01 jQuery
Python中的choice()方法使用详解
2015/05/15 Python
深入理解python函数递归和生成器
2016/06/06 Python
python通过socket实现多个连接并实现ssh功能详解
2017/11/08 Python
基于Python的Post请求数据爬取的方法详解
2019/06/14 Python
python字典setdefault方法和get方法使用实例
2019/12/25 Python
微信小程序canvas实现水平、垂直居中效果
2020/02/05 HTML / CSS
罗马尼亚在线杂货店:Pilulka.ro
2019/09/28 全球购物
详解如何解决使用JSON.stringify时遇到的循环引用问题
2021/03/23 Javascript
办公室驾驶员岗位职责
2013/11/15 职场文书
《蚂蚁和蝈蝈》教学反思
2014/02/24 职场文书
2014最新房贷收入证明范本
2014/09/12 职场文书
2014年科室工作总结
2014/11/20 职场文书
2014年会计工作总结
2014/11/27 职场文书
2014年党员个人工作总结
2014/12/02 职场文书
党员民主生活会材料
2014/12/15 职场文书
《红领巾真好》教学反思
2016/02/16 职场文书
六年级语文教学反思
2016/03/03 职场文书
职场干货:简历中的自我评价应该这样写!
2019/05/06 职场文书