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 相关文章推荐
解决Maven项目中 Invalid bound statement 无效的绑定问题
Jun 15 Java/Android
JVM钩子函数的使用场景详解
Aug 23 Java/Android
JAVA API 实用类 String详解
Oct 05 Java/Android
Java Spring 控制反转(IOC)容器详解
Oct 05 Java/Android
关于maven依赖 ${xxx.version}报错问题
Jan 18 Java/Android
Spring this调用当前类方法无法拦截的示例代码
Mar 20 Java/Android
SpringBoot2零基础到精通之数据库专项精讲
Mar 22 Java/Android
Netty客户端接入流程NioSocketChannel创建解析
Mar 25 Java/Android
Java Spring Lifecycle的使用
May 06 Java/Android
Ubuntu18.04下QT开发Android无法连接设备问题解决实现
Jun 01 Java/Android
Android RecyclerView实现九宫格效果
Jun 28 Java/Android
springboot+rabbitmq实现智能家居实例详解
Jul 23 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中的循环while、do...while、for、foreach四种循环
2016/11/05 PHP
微信开发之php表单微信中自动提交两次问题解决办法
2017/01/08 PHP
php+redis在实际项目中HTTP 500: Internal Server Error故障排除
2017/02/05 PHP
PHP7中I/O模型内核剖析详解
2019/04/14 PHP
jquery 表单进行客户端验证demo
2009/08/24 Javascript
jquery仿搜索自动联想功能代码
2014/05/23 Javascript
JavaScript使用addEventListener添加事件监听用法实例
2015/06/01 Javascript
JQuery实现鼠标移动图片显示描述层的方法
2015/06/25 Javascript
js实现自动图片轮播代码
2017/03/22 Javascript
详解Angular 自定义结构指令
2017/06/21 Javascript
Angular 2父子组件数据传递之局部变量获取子组件其他成员
2017/07/04 Javascript
纯js封装的ajax功能函数与用法示例
2018/05/14 Javascript
[00:43]DOTA2小紫本全民票选福利PA至宝全方位展示
2014/11/25 DOTA
Python实现八大排序算法
2016/08/13 Python
浅谈Python由__dict__和dir()引发的一些思考
2017/10/30 Python
Python Flask基础教程示例代码
2018/02/07 Python
Python Learning 列表的更多操作及示例代码
2018/08/22 Python
解决python线程卡死的问题
2019/02/18 Python
python找出因数与质因数的方法
2019/07/25 Python
Python字符编码转码之GBK,UTF8互转
2020/02/09 Python
Python 基于jwt实现认证机制流程解析
2020/06/22 Python
python中reload重载实例用法
2020/12/15 Python
解决Pycharm 运行后没有输出的问题
2021/02/05 Python
利用CSS3实现平移动画效果示例代码
2016/10/12 HTML / CSS
详解通过变换矩阵实现canvas的缩放功能
2019/01/14 HTML / CSS
Vision Directa智利眼镜网:框架眼镜、隐形眼镜和名牌太阳眼镜
2016/11/23 全球购物
Omio美国:全欧洲低价大巴、火车和航班搜索和比价
2017/11/08 全球购物
String和StringBuffer的区别
2015/08/13 面试题
家庭教育先进个人事迹材料
2014/01/24 职场文书
大学生求职信范文
2014/05/24 职场文书
创先争优承诺书
2015/01/20 职场文书
工作证明格式范文
2015/06/15 职场文书
部门主管竞聘书
2015/09/15 职场文书
Python中tkinter的用户登录管理的实现
2021/04/22 Python
sql中mod()函数取余数的用法
2021/05/29 SQL Server
漫画「古见同学有交流障碍症」第25卷封面公开
2022/03/21 日漫