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 相关文章推荐
Java框架入门之简单介绍SpringBoot框架
Jun 18 Java/Android
Java Optional<Foo>转换成List<Bar>的实例方法
Jun 20 Java/Android
如何给HttpServletRequest增加消息头
Jun 30 Java/Android
logback如何自定义日志存储
Aug 30 Java/Android
Java实现房屋出租系统详解
Oct 05 Java/Android
SpringDataJPA在Entity中常用的注解介绍
Dec 06 Java/Android
深入浅出讲解Java8函数式编程
Jan 18 Java/Android
Java工作中实用的代码优化技巧分享
Apr 21 Java/Android
Android存储中最基本的文件存储方式
Apr 30 Java/Android
多线程Spring通过@Scheduled实现定时任务
May 25 Java/Android
Android基础入门之dataBinding的简单使用教程
Jun 21 Java/Android
springboot读取resources下文件的方式详解
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设计模式 Builder(建造者模式)
2011/06/26 PHP
php 无法加载mysql的module的时候的配置的解决方案引发的思考
2012/01/27 PHP
php 删除一个数组中的某个值.兼容多维数组!
2012/02/18 PHP
从零开始学YII2框架(一)通过Composer安装Yii2框架
2014/08/20 PHP
PHP实现多维数组转字符串和多维数组转一维数组的方法
2015/08/08 PHP
innerText和innerHTML 一些问题分析
2009/05/18 Javascript
Jsonp 跨域的原理以及Jquery的解决方案
2010/05/18 Javascript
JS事件Event元素(兼容IE,Firefox,Chorme)
2012/11/01 Javascript
jQuery 1.9.1源码分析系列(十)事件系统之主动触发事件和模拟冒泡处理
2015/11/24 Javascript
Validform+layer实现漂亮的表单验证特效
2016/01/17 Javascript
jQuery实现右键菜单、遮罩等效果代码
2016/09/27 Javascript
jQuery简单自定义图片轮播插件及用法示例
2016/11/21 Javascript
基于jQuery实现文字打印动态效果
2017/04/21 jQuery
解决vue 格式化银行卡(信用卡)每4位一个符号隔断的问题
2018/09/14 Javascript
vue微信分享出来的链接点开是首页问题的解决方法
2018/11/28 Javascript
js实现点赞效果
2020/03/16 Javascript
解决elementui表格操作列自适应列宽
2020/12/28 Javascript
[43:33]EG vs Spirit Supermajor 败者组 BO3 第一场 6.4
2018/06/05 DOTA
python socket 超时设置 errno 10054
2014/07/01 Python
Python中用sleep()方法操作时间的教程
2015/05/22 Python
Python使用win32com实现的模拟浏览器功能示例
2017/07/13 Python
Python批量发送post请求的实现代码
2018/05/05 Python
django之跨表查询及添加记录的示例代码
2018/10/16 Python
python 消费 kafka 数据教程
2019/12/21 Python
Python使用Socket实现简单聊天程序
2020/02/28 Python
深入浅析css3 中display box使用方法
2015/11/25 HTML / CSS
自我鉴定范文300字
2013/10/01 职场文书
求职简历自荐信范文
2013/10/21 职场文书
和谐家庭演讲稿
2014/05/24 职场文书
学校献爱心活动总结
2014/07/08 职场文书
2014年维修电工工作总结
2014/11/20 职场文书
开票员岗位职责
2015/02/12 职场文书
2015年教师党员承诺书
2015/04/27 职场文书
怎样写家长意见
2015/06/04 职场文书
考教师资格证不要错过的4个最佳时机
2019/07/17 职场文书
python库Tsmoothie模块数据平滑化异常点抓取
2022/06/10 Python