【Flutter 问题系列第 80 篇】TextField 输入框组件限制可输入的最大长度后,输入的内容中包含表情符号时,获取输入的内容数还是会超出限制的问题

这是【Flutter 问题系列第 80 篇】,如果觉得有用的话,欢迎关注专栏。

博文当前所用 Flutter SDK:3.10.5、Dart SDK:3.0.5

一:问题描述

在输入用户名称、简介等内容时,一般我们都会限制输入框内最大可输入数(通过 TextField 组件的 maxLength 属性),如下图限制简介最多10个字

在这里插入图片描述

正常输入汉字是没有问题的,我们的限制起到了作用。可当最后输入了一个表情符号时,我们获取输入内容的长度会超出限制,如下图所示

在这里插入图片描述

这肯定不是我们需要的,怎么处理这种情况呢?

二:解决方案

其实解决的话也很简单,不直接使用字符串的长度,而是使用字符串的字符长度,也就是字符串的 characters 属性的长度。

修改前

onChanged: (str) {if (str.length >= 10) {debugPrint("最多可输入10个字符");}// do something
},

修改后

onChanged: (str) {if (str.characters.length >= 10) {debugPrint("最多可输入10个字符");}// do something
},

修改后的效果如下图所示

在这里插入图片描述

String 内部用来存储的结果是一个 char 字符数组,Character 类用于对单个字符进行操作,是对 char 的封装。如果我们判断输入内容的长度是否大于限制的长度时,应该用的是字符长度,而不是字符串长度。

至此,关于 TextField 输入框组件限制可输入的最大长度后,输入的内容中包含表情符号时,获取输入的内容数还是会超出限制的问题便说到这里。

你的问题得到解决了吗?欢迎在评论区留言。

赠人玫瑰,手有余香,如果觉得文章不错,希望可以给个一键三连,感谢。


结束语

Google 的 Flutter 越来越火,截止 2024年1月17日 GitHub 标星已达 159K,Flutter 毅然是一种趋势,所以作为前端开发者,没有理由不趁早去学习。

无论你是 Flutter 新手还是已经入门了,不妨先点个关注,后续我会将 Flutter 中的常用组件(含有源码分析、组件的用法及注意事项)以及可能遇到的问题写到 CSDN 博客中,希望自己学习的同时,也可以帮助更多的人。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/629333.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

The Feast and the Bus

JebTrains的员工正在庆祝一年中的第256天!JebTrains有 n 名员工和 k 个团队。每个员工都是某个(恰好是一个)团队的成员。所有队伍的编号从 1 到 k。您将得到一个数字数组 t1、t2、…、tn,其中ti是第i个员工的团队编号。 JebTrains…

FFMPEG解码实时流,支持cpu、gpu解码

官网下载的ffmpeg目前只能下载到X64版本的库,具体编译请参考windows编译ffmpeg源码(32位库)_windows 32位ffmpeg动态库-CSDN博客 直接上代码 int VideoDecodeModule::Open(std::string strUrl) {AVFormatContext *pFormatCtx nullptr;AVCo…

Python 学习笔记——一认识Python

Python 简介 Python 是一种解释型、面向对象、动态数据类型的高级程序设计语言。 Python 由 Guido van Rossum 于 1989 年底发明,第一个公开发行版发行于 1991 年。 像 Perl 语言一样, Python 源代码同样遵循 GPL(GNU General Public License) 协议。 Python 特点 1…

电脑本地连接不见了怎么恢复?5个方法轻松解决问题!

“我在使用电脑时,突然发现我的本地连接不见了,这是怎么回事呢?有什么方法可以解决这个问题吗?” 电脑的本地连接是一种将电脑与局域网连接的方式。局域网是一种小型的网络,通常在建筑物内或地理位置相近的少量计算机之…

Python数据分析案例33——新闻文本主题多分类(Transformer, 组合模型) 模型保存

案例背景 对于海量的新闻,我们可能需要进行文本的分类。模型构建很重要,现在对于自然语言处理基本都是神经网络的方法了。 本次这里正好有一组质量特别高的新闻数据,涉及 教育 科技 社会 时政 财经 房产 家居 七大主题,基本涵盖…

Grafana(三)Grafana 免密登录-隐藏导航栏-主题变换

一. 免密登录 Grafana 的常用方式: 将配置好的Grafana图嵌入到系统页面中 为了实现可免登录访问,可以通过如下方式进行设置: 1. 修改Grafana配置文件 在Grafana的配置文件 /etc/grafana/grafana.ini 中,找到 [auth.anonymous] 配…

深度剖析 ThreadLocal 内存泄露问题及解决方案

引言 在多线程编程中,ThreadLocal 是一个常用的工具,用于在每个线程中维护独立的变量,避免了线程间的数据共享问题。然而,使用不当时,ThreadLocal 可能引发内存泄露,这是一个开发者们常常需要面对的难题。…

SaaS 与 AWS 云:协同创新的崭新时代

在云计算的潮流下,SaaS(Software as a Service)模型和AWS(Amazon Web Services)云平台的结合为企业带来了前所未有的灵活性、可扩展性和效率。这两者的协同作用开启了一场数字化时代的创新浪潮,重新定义着企…

记一次Log记录大对象导致的CPU异常和磁盘打满

代码里有个大对象Map,缓存了100M数据,在多线程任务中记录异常的任务时错误地记录了这个Map,导致JSON序列化时疯狂刷磁盘写入数据,导致磁盘被打满,CPU100%,机器拒绝访问。

P9842 [ICPC2021 Nanjing R] Klee in Solitary Confinement 题解(SPJ!!!)

[ICPC2021 Nanjing R] Klee in Solitary Confinement 题面翻译 给定 n , k n,k n,k 和一个长为 n n n 的序列,你可以选择对区间 [ l , r ] [l, r] [l,r] 的数整体加上 k k k,也可以不加。最大化众数出现次数并输出。 题目描述 Since the travele…

MySQL命令大全和实例

文章目录 1. 数据库管理2. 表操作3. 数据操作(CRUD)4. 条件查询与排序5. 聚合函数和分组6. 用户权限管理7. 其他操作8. 视图操作9. 索引操作10. 子查询与连接查询11. 插入多行数据12. 删除满足特定条件的表中所有数据13. 清空表(保留表结构&a…

rust跟我学五:是否安装双系统

图为RUST吉祥物 大家好,我是get_local_info作者带剑书生,这里用一篇文章讲解get_local_info是怎么得到检测双系统的。 首先,先要了解get_local_info是什么? get_local_info是一个获取linux系统信息的rust三方库,并提供一些常用功能,目前版本0.2.4。详细介绍地址:[我的Ru…

IOS-高德地图路径绘制显示交通状况-Swift

本文基于:高德地图路径绘制进行了路径绘制的优化,添加了根据交通信息(是否拥堵)来显示路况,效果如图: 图标资源: custtexture_bad custtexture_green custtexture_slow custtexture_serio…

关于C语言整型提升的讲解

目录 1.什么是整型提升 2.整型提升的意义 3.整型提升是怎么提升的 4.整型提升的实例 1.什么是整型提升 C语言中的整型算术运算总是以缺省(默认)整型类型的精度来进行的。为了获得这个精度,表达式中的字符和短整型操作数在使用之前会被转换…

Vue键盘按键别名/事件说明及案例

Vue中的按键别名(): 回车 > enter 删除 > delete (退格 、 删除 按键) 退出 > esc 空格 > space 换行 > tab (必须配合keydown去使用) 上 > up 下 > down 左 > …

ChatGPT和文心一言哪个好用?

#ChatGPT 和文心一言哪个更好用?# 在当今信息爆炸的时代,人们对于文本生成和创作工具的需求越来越高。在这个背景下,ChatGPT和文心一言作为备受瞩目的工具,各自拥有独特的功能和用途。在本文中,我们将深入探讨这两个工…

stm32 - GPIO高级用法

stm32 - GPIO高级用法 PWMPWM / LEDPWM / 电机 PWM PWM / LED PWM波通过改变占空比可以改变LED的亮度 PWM信号调节LED亮度时,信号频率保持不变,即一个周期时间不变,改变的是脉冲的高电平的时间,即LED的导通时间,占空比…

web练习2

需求 1.计算用户指定的数值内的奇数和。例如用户输入的是10则计算13579的和 <!doctype html> <html lang"en"> <head><meta charset"utf-8"><title>作业1</title></head> <body> <script>//计算用…

AIGC商用实例—大模型技术助力AI测谎仪,实现视频通话实施测谎!

大家好&#xff0c;我是千寻哥&#xff0c;最近一段时间&#xff0c;给大家分享了不少的AI绘画相关的项目教程&#xff0c;很多星友都反映真的不错&#xff0c;我自己也是感觉很有意义&#xff01; 哈哈哈&#xff0c;今天我在看到了一个项目柑感觉是一个不错的idea&#xff0…