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 相关文章推荐
springboot @ConfigurationProperties和@PropertySource的区别
Jun 11 Java/Android
Java实战之用Swing实现通讯录管理系统
Jun 13 Java/Android
教你用Java在个人电脑上实现微信扫码支付
Jun 13 Java/Android
Java 数组内置函数toArray详解
Jun 28 Java/Android
JUnit5常用注解的使用
Jul 02 Java/Android
Spring Cloud Gateway去掉url前缀
Jul 15 Java/Android
JVM之方法返回地址详解
Feb 28 Java/Android
Java虚拟机内存结构及编码实战分享
Apr 07 Java/Android
Android开发之WECHAT微信小程序路由跳转的两种形式
Apr 12 Java/Android
Java处理延时任务的常用几种解决方案
Jun 01 Java/Android
SpringBoot使用AOP实现统计全局接口访问次数详解
Jun 16 Java/Android
Android学习之BottomSheetDialog组件的使用
Jun 21 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 cookie 作用范围?不要在当前页面使用你的cookie
2009/03/24 PHP
php常用的安全过滤函数集锦
2014/10/09 PHP
php中http与https跨域共享session的解决方法
2014/12/20 PHP
PHP如何将XML转成数组
2016/04/04 PHP
PHP+Ajax实现验证码的实时验证
2016/07/20 PHP
PHP 无限级分类
2017/05/04 PHP
起点页面传值js,有空研究学习下
2010/01/25 Javascript
ExtJs默认的字体大小改变的几种方法(自己整理)
2013/04/18 Javascript
js隐式全局变量造成的bug示例代码
2014/04/22 Javascript
JavaScript控制按钮可用或不可用的方法
2015/04/03 Javascript
JQuery球队选择实例
2015/05/18 Javascript
js中scrollTop()方法和scroll()方法用法示例
2016/10/03 Javascript
JS实现图片放大缩小的方法
2017/02/15 Javascript
js模仿微信朋友圈计算时间显示几天/几小时/几分钟/几秒之前
2017/04/27 Javascript
canvas简单快速的实现知乎登录页背景效果
2017/05/08 Javascript
vue2.0 兄弟组件(平级)通讯的实现代码
2018/01/15 Javascript
vue自定义指令directive的使用方法
2019/04/07 Javascript
微信小程序报错: thirdScriptError的错误问题
2020/06/19 Javascript
vue将data恢复到初始状态 &amp;&amp; 重新渲染组件实例
2020/09/04 Javascript
[19:26]TNC vs EG (BO3)
2018/06/07 DOTA
python实现爬虫统计学校BBS男女比例之数据处理(三)
2015/12/31 Python
Python编程实现的简单神经网络算法示例
2018/01/26 Python
python绘制圆柱体的方法
2018/07/02 Python
使用Python制作自动推送微信消息提醒的备忘录功能
2018/09/06 Python
Python中collections模块的基本使用教程
2018/12/07 Python
python画图的函数用法以及技巧
2019/06/28 Python
python 类的继承 实例方法.静态方法.类方法的代码解析
2019/08/23 Python
Python基于模块Paramiko实现SSHv2协议
2020/04/28 Python
深入解析HTML5 Canvas控制图形矩阵变换的方法
2016/03/24 HTML / CSS
前端使用canvas生成盲水印的加密解密的实现
2020/12/16 HTML / CSS
鱼油专家:Omegavia
2016/10/10 全球购物
新学期校长寄语
2014/01/18 职场文书
就业协议书的作用
2014/04/11 职场文书
保密工作责任书
2014/04/16 职场文书
小学二年级评语
2014/04/21 职场文书
CSS使用伪类控制边框长度的方法
2022/01/18 HTML / CSS