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 相关文章推荐
JVM入门之类加载与字节码技术(类加载与类的加载器)
Jun 15 Java/Android
浅谈什么是SpringBoot异常处理自动配置的原理
Jun 21 Java/Android
Java中常用解析工具jackson及fastjson的使用
Jun 28 Java/Android
解决SpringBoot文件上传临时目录找不到的问题
Jul 01 Java/Android
java中用float时,数字后面加f,这样是为什么你知道吗
Sep 04 Java/Android
关于springboot配置druid数据源不生效问题(踩坑记)
Sep 25 Java/Android
SpringDataJPA在Entity中常用的注解介绍
Dec 06 Java/Android
spring注解 @PropertySource配置数据源全流程
Mar 25 Java/Android
Java虚拟机内存结构及编码实战分享
Apr 07 Java/Android
Spring Data JPA框架的核心概念和Repository接口
Apr 28 Java/Android
Android开发手册TextInputLayout样式使用示例
Jun 10 Java/Android
springboot创建的web项目整合Quartz框架的项目实践
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
Syphon 虹吸式咖啡壶冲煮–拨动法
2021/03/03 冲泡冲煮
新浪新闻小偷
2006/10/09 PHP
PHP OPCode缓存 APC详细介绍
2010/10/12 PHP
Smarty3配置及入门语法
2017/02/22 PHP
JavaScript Event学习第十一章 按键的检测
2010/02/10 Javascript
js中top、clientTop、scrollTop、offsetTop的区别 文字详细说明版
2011/01/08 Javascript
jquery focus(fn),blur(fn)方法实例代码
2011/12/16 Javascript
通过js动态操作table(新增,删除相关列信息)
2012/05/23 Javascript
jquery插件制作教程 txtHover
2012/08/17 Javascript
javascript+xml实现简单图片轮换(只支持IE)
2012/12/23 Javascript
IE下JS读取xml文件示例代码
2013/08/05 Javascript
基于JQuery和CSS3实现仿Apple TV海报背景视觉差特效源码分享
2015/09/21 Javascript
jQuery实用技巧必备(上)
2015/11/02 Javascript
微信小程序首页的分类功能和搜索功能的实现思路及代码详解
2018/09/11 Javascript
详解如何在vue项目中使用layui框架及采坑
2019/05/05 Javascript
轻松解决JavaScript定时器越走越快的问题
2019/05/13 Javascript
浅谈es6中的元编程
2020/12/01 Javascript
python动态加载变量示例分享
2014/02/17 Python
Python实现将json文件中向量写入Excel的方法
2018/03/26 Python
对python中类的继承与方法重写介绍
2019/01/20 Python
python实现七段数码管和倒计时效果
2019/11/23 Python
Python实现计算长方形面积(带参数函数demo)
2020/01/18 Python
CSS3+JavaScript实现炫酷呼吸效果的示例代码
2020/06/15 HTML / CSS
学校万圣节活动方案
2014/02/13 职场文书
1亿有多大教学反思
2014/05/01 职场文书
副校长竞聘演讲稿
2014/09/01 职场文书
个人向公司借款协议书
2014/10/09 职场文书
教师业务学习材料
2014/12/16 职场文书
2014年服务员个人工作总结
2014/12/23 职场文书
信仰纪录片观后感
2015/06/08 职场文书
个人收入证明范本
2015/06/12 职场文书
搞笑婚庆主持词
2015/06/29 职场文书
2019大学毕业晚会主持词
2019/06/21 职场文书
pytorch 两个GPU同时训练的解决方案
2021/06/01 Python
自动在Windows中运行Python脚本并定时触发功能实现
2021/09/04 Python
漫画「狩龙人拉格纳」公开TV动画预告图
2022/03/22 日漫