当前位置: 首页 > news >正文

flutter的TextField参数、案例整理(上)

TextField

概述

  • TextField 用于文本输入

构造函数

const TextField({Key key,this.controller, this.focusNode,this.decoration = const InputDecoration(),TextInputType keyboardType,this.textInputAction,this.textCapitalization = TextCapitalization.none,this.style, // 文本样式this.strutStyle,this.textAlign = TextAlign.start, // 文本水平方向对齐方式this.textAlignVertical, // 本文垂直方向对齐方式this.textDirection, // 文本方向this.readOnly = false, // 是否是只读ToolbarOptions toolbarOptions,this.showCursor,this.autofocus = false, //在widget创建的时候是否自动获取焦点this.obscureText = false,// 是否隐藏文本,常用于密码输入this.autocorrect = true,this.enableSuggestions = true,this.maxLines = 1,this.minLines,this.expands = false,this.maxLength,//当设置了maxLength后,右下角会出现字数统计this.maxLengthEnforced = true,this.onChanged, // 内容发生改变方法回调this.onEditingComplete, // 完成编辑方法回调,实现了这个方法,键盘不再会自动收起this.onSubmitted, // 提交方法回调this.inputFormatters,// 用于校验,较麻烦,能搭配正则等使用this.enabled,this.cursorWidth = 2.0, // 光标宽度this.cursorRadius, // 光标圆角this.cursorColor, // 光标颜色this.keyboardAppearance,this.scrollPadding = const EdgeInsets.all(20.0), this.dragStartBehavior = DragStartBehavior.start,this.enableInteractiveSelection = true,this.onTap, // 点击方法回调(开始编辑)this.buildCounter, // 搭配maxLength出现的字数统计,控制字数统计的显示样式this.scrollController, // 滚动this.scrollPhysics,})

示例代码

  • 使用 TextEditingController 对 TextField 输入进行监听
    • 别忘记了释放TextEditingController
    • 可以获取输入框的文本、设置光标位置、清空输入框等操作
/// 编辑框的控制器
TextEditingController textEditingController = TextEditingController();
/// 组件
TextField(maxLines: 1,maxLength: 50,textInputAction: TextInputAction.search,style: const TextStyle(fontSize: 12, color: Colors.black),controller: textEditingController,onEditingComplete: onSearch,decoration: InputDecoration(/// 关闭计数器counterText: '',contentPadding: const EdgeInsets.symmetric(horizontal: 10),hintText: "输入你想搜索的内容",hintStyle: TextStyle(fontSize: 12, color: Global.theme.light_gray_color),hintMaxLines: 1,/// 直接用border: BorderSide.none会有布局问题,需要包裹OutlineInputBorderborder: const OutlineInputBorder(// BorderSide(color: ) 设置边框颜色// borderRadius: const BorderRadius.all(Radius.circular(10.0)), 设置边框圆角borderSide: BorderSide.none),suffixIcon: EIcon(width: 20,height: 20,path: "assets/icon/icon_search.png",onTap: onSearch),),
)
/// 在页面里放上键盘监听
KeyboardVisibilityBuilder(builder: (context, isKeyboardVisible) {dLog(_tag, "keyboard visible: $isKeyboardVisible");return emptyWidget;}),
// 给全部添加一个GestureDetector,设置onTap方法
// 方法内部加入FocusScope.of(context).unfocus();可以实现点击其他位置的地方让编辑框弹出的键盘隐藏
// 本质是用了焦点来控制键盘的显隐

通过点击button控制键盘显隐

  • 搭配FocusNode
  • FocusNode,管理TextField的焦点
class _TestWidgetState extends State<TestWidget> {// focusNodefinal FocusNode _focusNode = FocusNode(debugLabel: "Button");@overridevoid initState() {super.initState();// 监听焦点_focusNode.addListener(() {if (_focusNode.hasFocus == true) {print("输入框获得焦点");} else {print("输入框失去焦点");}});}@overridevoid dispose() {_focusNode.dispose();super.dispose();}@overrideWidget build(BuildContext context) {return Container(padding: EdgeInsets.only(left: 20, right: 20),child: Column(children: <Widget>[Center(child: TextField(focusNode: _focusNode,),),FlatButton(onPressed: () {if (_focusNode.canRequestFocus) {FocusScope.of(context).requestFocus(_focusNode);}},child: Text('键盘弹出'),),MaterialButton(onPressed: () {_focusNode.unfocus();},child: Text('键盘消失'),)],),);}
}

相关文章:

flutter的TextField参数、案例整理(上)

TextField 概述 TextField 用于文本输入 构造函数 const TextField({Key key,this.controller, this.focusNode,this.decoration const InputDecoration(),TextInputType keyboardType,this.textInputAction,this.textCapitalization TextCapitalization.none,this.style…...

【Linux进阶之路】进程间通信

文章目录 一、原理二、方式1.管道1.1匿名管道1.1.1通信原理1.1.2接口使用 1.2命名管道 2.共享内存2.1原理2.2接口使用 3.消息队列原理 4.信号量引入原理 总结 一、原理 进程间的通信是什么&#xff1f;解释&#xff1a; 简单理解就是&#xff0c;不同进程之间进行数据的输入输出…...

深度学习框架配置

目录 1. 配置cuda环境 1.1. 安装cuda和cudnn 1.1.1. 显卡驱动配置 1.1.2. 下载安装cuda 1.1.3. 下载cudnn&#xff0c;将解压后文件复制到cuda目录下 1.2. 验证是否安装成功 2. 配置conda环境 2.1. 安装anaconda 2.2. conda换源 2.3. 创建conda环境 2.4. pip换源 3.…...

全局配置

1.全局配置文件及其配置项 1.1.小程序窗口 1.2 窗口节点 1.2.1 导航栏标题 标题&#xff1a; 标题颜色&#xff1a; 背景色&#xff1a;只支持16进制值 下拉刷新&#xff1a; 刷新背景色&#xff1a; 刷新样式&#xff1a; 触底距离&#xff1a;...

leetcode算法之字符串

目录 1.最长公共前缀2.最长回文子串3.二进制求和4.字符串相乘 1.最长公共前缀 最长公共前缀 class Solution { public:string longestCommonPrefix(vector<string>& strs) {//法一&#xff1a;两两比较string ret strs[0];for(int i1;i<strs.size();i){ret f…...

mongodb查询数据库集合的基础命令

基础命令 启动mongo服务 mongod -f /usr/local/mongodb/mongod.conf //注意配置文件路径停止mongo服务 关闭mongodb有三种方式&#xff1a; 一种是进入mongo后通过mongo的函数关闭&#xff1b; use admin db.shutdownServer()一种是通过mongod关闭&#xff1b; mongod --s…...

基于FactoryBean、实例工厂、静态工厂创建Spring中的复杂对象

&#x1f609;&#x1f609; 学习交流群&#xff1a; ✅✅1&#xff1a;这是孙哥suns给大家的福利&#xff01; ✨✨2&#xff1a;我们免费分享Netty、Dubbo、k8s、Mybatis、Spring...应用和源码级别的视频资料 &#x1f96d;&#x1f96d;3&#xff1a;QQ群&#xff1a;583783…...

Android 如何让路由器或者其他AP设备获取到主机名

问题原因: 连接到AP设备后,发现主机名在路由器或者其他AP设备都无法正常显示 抓取tcpdump log发现DHCP request option中没有携带host name(Option 12)字段 如下图所示 修改方法: 将config_dhcp_client_hostname配置true后,可以看到host name了 具体代码逻辑如下 pack…...

java三大集合类--List

List Set Map 一、List 几个小问题&#xff1a; 1、接口可以被继承吗&#xff1f;&#xff08;可以&#xff09; 2、接口可以被多个类实现吗&#xff1f;&#xff08;可以&#xff09; 3、以下两种写法有什么区别&#xff1f; //List list1new List();是错误的因为List()…...

机器人向前冲

欢迎来到程序小院 机器人向前冲 玩法&#xff1a;一直走动的机器人&#xff0c;点击鼠标左键进行跳跃&#xff0c;跳过不同的匝道&#xff0c;掉下去即为游戏接续&#xff0c; 碰到匝道铁钉游戏结束&#xff0c;一直往前冲吧^^。开始游戏https://www.ormcc.com/play/gameStart…...

jq——实现弹幕滚动(往左滚动+往右滚动)——基础积累

最近同事在写弹幕功能&#xff0c;下面记录以下代码&#xff1a; 1.html代码 <div id"scrollContainer"></div>2.引入jq <script src"./script/jquery-1.8.3.js" type"text/javascript"></script>3.jq代码——往左滚…...

深度学习第2天:RNN循环神经网络

☁️主页 Nowl &#x1f525;专栏《机器学习实战》 《机器学习》 &#x1f4d1;君子坐而论道&#xff0c;少年起而行之 文章目录 介绍 记忆功能对比展现 任务描述 导入库 处理数据 前馈神经网络 循环神经网络 编译与训练模型 模型预测 可能的问题 梯度消失 梯…...

深度学习之基于百度飞桨PaddleOCR图像字符检测识别系统

欢迎大家点赞、收藏、关注、评论啦 &#xff0c;由于篇幅有限&#xff0c;只展示了部分核心代码。 文章目录 一项目简介主要特点使用步骤 二、功能三、系统四. 总结 一项目简介 # Introduction to PaddleOCR Image Character Detection and Recognition System Based on Baidu…...

九、LuaTable(表)

文章目录 一、定义二、Table(表)的构造三、Table 操作&#xff08;一&#xff09;Table连接&#xff08;二&#xff09;插入和移除&#xff08;三&#xff09;Table 排序&#xff08;四&#xff09;Table 最大值 一、定义 table 是 Lua 的一种数据结构用来帮助我们创建不同的数…...

每日一题(LeetCode)----链表--链表最大孪生和

每日一题(LeetCode)----链表–链表最大孪生和 1.题目&#xff08;2130. 链表最大孪生和&#xff09; 在一个大小为 n 且 n 为 偶数 的链表中&#xff0c;对于 0 < i < (n / 2) - 1 的 i &#xff0c;第 i 个节点&#xff08;下标从 0 开始&#xff09;的孪生节点为第 (n…...

腾讯云轻量服务器通过Docker搭建外网可访问连接的redis5.x集群

原创/朱季谦 最近买了一台4核16的腾讯云轻量应用服务器,花了我快四百的大洋&#xff0c;打算搭建一堆docker组件集群&#xff0c;最先开始是通过docker搭建redis集群&#xff0c;计划使用三个端口&#xff0c;分别是7001,7002,7003。 腾讯云服务器有防火墙限制&#xff0c;故…...

C++学习之路(十一)C++ 用Qt5实现一个工具箱(增加一个进制转换器功能)- 示例代码拆分讲解

上篇文章&#xff0c;我们用 Qt5 实现了在小工具箱中添加了《时间戳转换功能》功能。为了继续丰富我们的工具箱&#xff0c;今天我们就再增加一个平时经常用到的功能吧&#xff0c;就是「 进制转换 」功能。下面我们就来看看如何来规划开发一个这样的小功能并且添加到我们的工具…...

C语言每日一题(40)栈实现队列

力扣232 用栈实现队列 题目描述 请你仅使用两个栈实现先入先出队列。队列应当支持一般队列支持的所有操作&#xff08;push、pop、peek、empty&#xff09;&#xff1a; 实现 MyQueue 类&#xff1a; void push(int x) 将元素 x 推到队列的末尾int pop() 从队列的开头移除并…...

Vue.js 的生命周期

Vue.js 的生命周期钩子函数是一组在 Vue 实例生命周期中执行的函数&#xff0c;它们允许你在特定阶段执行自定义逻辑。以下是 Vue.js 的生命周期钩子函数以及它们在生命周期中的执行时机&#xff1a; 1、beforeCreate: 在实例初始化之后&#xff0c;数据观测 (data observer)…...

SeaTunnel引擎下的SQL Server CDC解决方案:构建高效数据管道

在快速发展的数据驱动时代&#xff0c;实时数据处理已经成为企业决策和运营的关键因素。特别是在处理来自各种数据源的信息时&#xff0c;如何确保数据的及时、准确和高效同步变得尤为重要。本文着重介绍了如何利用 SqlServer CDC 源连接器在 SeaTunnel 框架下实现 SQL Server …...

Vim 调用外部命令学习笔记

Vim 外部命令集成完全指南 文章目录 Vim 外部命令集成完全指南核心概念理解命令语法解析语法对比 常用外部命令详解文本排序与去重文本筛选与搜索高级 grep 搜索技巧文本替换与编辑字符处理高级文本处理编程语言处理其他实用命令 范围操作示例指定行范围处理复合命令示例 实用技…...

SciencePlots——绘制论文中的图片

文章目录 安装一、风格二、1 资源 安装 # 安装最新版 pip install githttps://github.com/garrettj403/SciencePlots.git# 安装稳定版 pip install SciencePlots一、风格 简单好用的深度学习论文绘图专用工具包–Science Plot 二、 1 资源 论文绘图神器来了&#xff1a;一行…...

边缘计算医疗风险自查APP开发方案

核心目标:在便携设备(智能手表/家用检测仪)部署轻量化疾病预测模型,实现低延迟、隐私安全的实时健康风险评估。 一、技术架构设计 #mermaid-svg-iuNaeeLK2YoFKfao {font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:16px;fill:#333;}#mermaid-svg…...

Unit 1 深度强化学习简介

Deep RL Course ——Unit 1 Introduction 从理论和实践层面深入学习深度强化学习。学会使用知名的深度强化学习库&#xff0c;例如 Stable Baselines3、RL Baselines3 Zoo、Sample Factory 和 CleanRL。在独特的环境中训练智能体&#xff0c;比如 SnowballFight、Huggy the Do…...

vulnyx Blogger writeup

信息收集 arp-scan nmap 获取userFlag 上web看看 一个默认的页面&#xff0c;gobuster扫一下目录 可以看到扫出的目录中得到了一个有价值的目录/wordpress&#xff0c;说明目标所使用的cms是wordpress&#xff0c;访问http://192.168.43.213/wordpress/然后查看源码能看到 这…...

LangFlow技术架构分析

&#x1f527; LangFlow 的可视化技术栈 前端节点编辑器 底层框架&#xff1a;基于 &#xff08;一个现代化的 React 节点绘图库&#xff09; 功能&#xff1a; 拖拽式构建 LangGraph 状态机 实时连线定义节点依赖关系 可视化调试循环和分支逻辑 与 LangGraph 的深…...

用鸿蒙HarmonyOS5实现中国象棋小游戏的过程

下面是一个基于鸿蒙OS (HarmonyOS) 的中国象棋小游戏的实现代码。这个实现使用Java语言和鸿蒙的Ability框架。 1. 项目结构 /src/main/java/com/example/chinesechess/├── MainAbilitySlice.java // 主界面逻辑├── ChessView.java // 游戏视图和逻辑├──…...

消防一体化安全管控平台:构建消防“一张图”和APP统一管理

在城市的某个角落&#xff0c;一场突如其来的火灾打破了平静。熊熊烈火迅速蔓延&#xff0c;滚滚浓烟弥漫开来&#xff0c;周围群众的生命财产安全受到严重威胁。就在这千钧一发之际&#xff0c;消防救援队伍迅速行动&#xff0c;而豪越科技消防一体化安全管控平台构建的消防“…...

PydanticAI快速入门示例

参考链接&#xff1a;https://ai.pydantic.dev/#why-use-pydanticai 示例代码 from pydantic_ai import Agent from pydantic_ai.models.openai import OpenAIModel from pydantic_ai.providers.openai import OpenAIProvider# 配置使用阿里云通义千问模型 model OpenAIMode…...

生信服务器 | 做生信为什么推荐使用Linux服务器?

原文链接&#xff1a;生信服务器 | 做生信为什么推荐使用Linux服务器&#xff1f; 一、 做生信为什么推荐使用服务器&#xff1f; 大家好&#xff0c;我是小杜。在做生信分析的同学&#xff0c;或是将接触学习生信分析的同学&#xff0c;<font style"color:rgb(53, 1…...