Flutter控制某个TextField获取焦点及失去焦点

最新推荐文章于 2024-04-28 14:46:05 发布
最新推荐文章于 2024-04-28 14:46:05 发布
阅读量4.6k 收藏 1
点赞数 1
文章标签： 移动开发 c# 前端 ViewUI
原文链接：http://www.cnblogs.com/gxsyj/p/11156323.html
版权

在项目中有时需要点击某个地方的时候让一个文本框获取焦点以弹起键盘~~比如前端经常使用的input.focus()，但是在flutter中没有.focus()这个方法~~不过我们可以通过FocusScope.of(context).requestFocus()来实现这一操作

先看一下实现场景，点击某一条留言然后让文本框获取焦点弹出键盘：

 

要使用FocusScope.of(context).requestFocus()需要先定义一个FocusNode

FocusNode _commentFocus = FocusNode();

TextField(
  focusNode: _commentFocus,
),

　　

获取焦点

当点击时用FocusScope.of(context).requestFocus()获取焦点

FocusScope.of(context).requestFocus(_commentFocus);     // 获取焦点

　　

失去焦点

当发送留言之后

最低0.47元/天 解锁文章
weixin_30323631
关注
  • 1
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
flutter应用开发中文本输入框TextField的焦点获取控制篇
01-07
TextField 焦点获取控制篇《就是本文章了》 TextField 输入文本样式 TextStyle 篇《正在发文中》 TextField 输入文本 textAlign 对齐分析篇《正在发文中》 TextField 输入文本 decoration 配置边框样
Flutter控制某个TextField获取焦点以及失去焦点
Welcome To As.Kai 's Home
12-21 3808
Flutter控制某个TextField获取焦点以及失去焦点 首先交代一下使用场景 点击某个控件使文本框获取焦点 弹出输入法 我们可以直接使用FocusScope.of(context).requestFocus()来实现获取焦点 实现获取焦点首先需要先定义一个FocusNode FocusNode _commentFocus = FocusNode(); //在TextField中绑定 TextField( focusNode: _commentFocus, ), 获取焦点 获取焦点当点击时用
flutter文本框TextField光标问题解决,文本框输入完成后点击空白,光标跑到最左边
weixin_52082065的博客
10-17 1275
有2种解决方案,第一种是点击文本框光标直接定位到最右侧,第二种方案是手指点到光标哪里,光标就到哪里.下面我依次为大家说明并奉上代码。第二种方法只要在dispose里面销毁他就能做到光标点到哪就在哪。
flutter知识点-Focus
最新发布
u011489056的专栏
04-28 829
是一个重要的概念，用于管理用户输入焦点，特别是在处理文本输入、按钮点击等交互场景时。使用这些组件，你可以实现复杂的焦点逻辑，例如控制输入框何时获得焦点、管理焦点转移、响应焦点变化等。是一个Widget，用于将焦点能力赋予其包裹的Widget及其子Widget。: 这是一个单例类，负责整个应用的焦点管理，包括与原生系统（如软键盘的显示）的交互。的扩展，它为它的后代Widget创建了一个焦点作用域。是焦点管理的核心类，每个需要接收焦点的Widget都应该关联一个。以避免焦点转移到旧路由的Widget上。
Flutter 强制获取焦点的问题
kuanxu的专栏
12-21 2822
在用flutter框架实现Flutter TV app的过程中，光标切换是个大问题： 从主菜单到子菜单，从子菜单到目标选项，各个目标选项之间，都需要光标切换。而且在Tv上无法触摸，主要靠遥控器上的上、下、左、右键来实现。所以光标的各个方向移动有时候需要以下方法指定才能实现。 FocusScope.of(context).requestFocus(expectFocus); 但是这个方法有时候并不能得到想要的效果，譬如从menu1按右键光标正常会跳到menu2，但事实上却...
Flutter中的无名英雄—— Focus
Dream It Possible
09-13 1971
这里大致介绍一些Focus相关Widget及功能类，便于后面理解Focus Tree部分。本篇源码基于1.20.0-2.0.pre。
Flutter
调上调下的女生
07-09 102
父布局关闭键盘+返回键监听 GestureDetector( onTap: () { ///关闭弹框 FocusScope.of(context).requestFocus(FocusNode()); }, child: Scaffold( appBar: WidgetUtils.showAppar(context, '标题', onBackCall: () { _showExitDialog(); .
Flutter中在收起键盘时自动使TextField失去焦点
zhengxtDgxs的博客
05-20 5689
前言 最近在做公司flutter项目的时候，接到了一个需求，本质上就是实现收起键盘的时候让TextField组件失去焦点的功能。 这个需求乍一看很好解决，心想，就这！就这！就这！so easy！ 但是！但是！但是！万万没想到啊，实现时候却让我本来就很稀薄的头发雪上加霜，原因就是安卓手机第三方输入法有一个很蛋疼的地方，就是他会有一个收起键盘的按钮，如下图所示： image 问题就在，这！个！按！钮！他不属于原生键盘按钮，无法检测到键盘事件！并且不能够屏蔽！????真的要给搞崩溃了。下面就给兄弟萌说说我最后的解
flutter TextField换行自适应的实现
08-25
在Flutter开发中，TextField是用于用户输入文本的基本组件，它提供了丰富的自定义功能。本文将详细探讨如何在Flutter中实现TextField的换行自适应效果，包括自动调整高度以适应输入内容的增长，同时保持预设的内外...
flutter-autocomplete-textfield：用于flutter的自动完成文本字段
02-03
autocomplete_textfield 颤振的自动完成文本字段 拉取请求 随意提交请求请求以进行所需的更改/功能/错误修复...由于我不再频繁使用Flutter，这使此代码的维护变得更加容易。 酒吧包可以在找到 重大变化 默认情况下...
flutter 输入框组件TextField的实现代码
08-25
在上面的代码中，我们增加了 keyboardType 属性，把 keyboardType 设置为 TextInputType.number，这样当我们让 TextField 获得焦点的时候弹出的键盘就变成了数字优先了。然后我们为输入框做了一些其他的效果，如提示...
Flutter漂亮登陆界面，TextField回车光标、焦点跳转下个TextField，最后一个自动点击登陆，源码提供下载
05-28
flutter在开发登陆界面的时候，输入内容后回车光标要跳转到下个TextField，有时FocusScope.of(context).requestFocus，不起作用，经过多次查找资料，最后找到一个相对适应实际应用的方法，提供源码下载 ，请查阅！...
[Flutter]输入框获取焦点和失去焦点事件
weixin_39897287的博客
06-29 2576
FocusNode _focusNode = FocusNode(); @override void initState() { _focusNode.addListener(() { if (!_focusNode.hasFocus) { // TextField has lost focus //收回键盘 FocusScope.of(context).requestFocus(FocusNode()); } });
Flutter 弹出框， TextField会失去焦点
Care iOS技术团队
09-22 1540
最近在研究flutter IM UI 的开发，在聊天页面中，长按弹出弹出框。我用的是PopupRoute来做的。结果会让输入框失去焦点。 为了不让输入框失去焦点，我使用了TransitionRoute代替PopupRoute，这样就不会失去焦点。 记录一下，方便查询。 ...
Flutter点击空白处取消TextField焦点(收起软键盘)
栖木的博客
11-28 4945
Flutter点击空白处取消TextField焦点(收起软键盘) GestureDetector( behavior: HitTestBehavior.translucent, onTap: () { // 触摸收起键盘 FocusScope.of(context).requestFocus(FocusNode()); }, chil...
Flutter让键盘消失，但是TextField不丢失Focus
Care iOS技术团队
09-24 2512
让TextField autoFocus为true, 或者 FocusScope.of(context).autofocus(_focusNode);
Flutter关于TextField你能知道的一切
weixin_38170561的博客
07-15 841
前言 Hello，大家好这里是一个苦逼的前Android开发，本来Android干的开开心心，但是受到一些影响转行了
Flutter中10个必须掌握的widget（带详细API解释）
angel725的专栏
01-21 1312
1、文本及样式（Text） Text用于显示简单样式文本，它包含一些控制文本显示样式的一些属性 const Text( this.data, { Key key, this.style, this.strutStyle, this.textAlign, this.textDirection, this.locale, this.softWrap, this.overflow, this.textScaleFactor,
flutter textfield 获取焦点
08-09
在Flutter中，可以通过使用TextField组件来获取焦点。TextField组件是一个用于接收用户输入的文本框，它有一个focusNode属性可以用来控制焦点。 首先，我们需要在StatefulWidget的构建方法中创建一个FocusNode对象，并在TextField组件的focusNode属性中传入该对象。例如： ``` class MyWidget extends StatefulWidget { @override _MyWidgetState createState() => _MyWidgetState(); } class _MyWidgetState extends State<MyWidget> { FocusNode myFocusNode; @override void initState() { super.initState(); myFocusNode = FocusNode(); } @override void dispose() { myFocusNode.dispose(); super.dispose(); } @override Widget build(BuildContext context) { return TextField( focusNode: myFocusNode, // 其他TextField的属性... ); } } ``` 接下来，我们可以使用myFocusNode.requestFocus()方法在代码中的某个位置来获取焦点。例如，我们可以在按钮的点击事件中获取焦点： ``` RaisedButton( onPressed: () { myFocusNode.requestFocus(); }, child: Text("获取焦点"), ), ``` 当按钮被点击时，TextField将会获取焦点并弹出键盘供用户输入。 另外，通过myFocusNode.requestFocus方法获取焦点并不会触发键盘自动弹出的效果，如果需要自动弹出键盘，可以将myFocusNode传入TextField的autofocus属性中： ``` TextField( focusNode: myFocusNode, autofocus: true, // 其他TextField的属性... ); ``` 这样，在页面加载完成后，TextField组件将会自动获取焦点并弹出键盘。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值