禁用颤振中的文本编辑字段
Posted
技术标签:
【中文标题】禁用颤振中的文本编辑字段【英文标题】：Disable a text edit field in flutter 【发布时间】：2017-11-13 09:49:40 【问题描述】：我偶尔需要禁用 TextFormField。我在小部件中找不到标志，或者在控制器中找不到简单地使其只读或禁用的标志。 最好的方法是什么？
【问题讨论】：
归档github.com/flutter/flutter/issues/10645 对于来自 google 的人，您现在可以在小部件上添加标志，请参阅我的回答。 @Arash 你能把接受的答案改成最近的答案吗，因为框架现在支持这个 【参考方案1】：还有另一种方法可以实现，它也不会导致this issue。希望这可能对某人有所帮助。
创建AlwaysDisabledFocusNode 并将其传递给TextField 的focusNode 属性。
class AlwaysDisabledFocusNode extends FocusNode
@override
bool get hasFocus => false;
然后
new TextField(
enableInteractiveSelection: false, // will disable paste operation
focusNode: new AlwaysDisabledFocusNode(),
...
...
)
更新：
TextField 现在有 enabled 属性。您可以在其中禁用 TextField 之类的
new TextField(
enabled: false,
...
...
)
注意：这也会禁用与文本输入相关的图标。
【讨论】：
是的，你可以有一个 TextFormatter 忽略任何输入（通过粘贴），但返回源以避免这种行为:) 我找到了一个更简单的方法，在我的情况下，我使用了您的解决方案，只是忽略了弹出窗口以提示使用enableInteractiveSelection: false 粘贴 TextField ;)
启用=假；不调度 onTap() 事件。我希望它被禁用且不可聚焦，但我不希望它死掉。我想控制它。如果设置，它仍应触发 onTap()。即使将其包装在 GestureDetector 中也不行。伙计，这种颤动有时会令人失望……
@Dpedrinha 为什么不使用我的第一个解决方案AlwaysDisabledFocusNode？
@HemanthRaj 我也试过了。我现在不记得这个问题了，但它也阻止了一些期望的行为。【参考方案2】：
TextFormField(
readOnly: true,
)
【讨论】：
为了创建更可靠的答案，您应该添加一些代码正在执行的上下文。如需更多帮助，请参阅how to answer。 这是我要找的，已启用：false 使后缀图标按钮禁用（我使用 content_copy 图标进行复制）。但这一个有效 readOnly:true 有问题 - 当用户选择此控件时 - 出现蓝色边框 - 这基本上是说它允许将焦点放在控件上。【参考方案3】：TextField 和 TextFormField 都有一个名为 enabled 的参数。您可以使用布尔变量来控制它。 enabled=true 表示它将充当编辑文本字段，而 enabled=false 将禁用 TextField。
【讨论】：
这是真正的答案。 这取决于您的需求。两者都解决了这个问题，但 Hemanth Raj 解决方案不会禁用与文本输入相关的图标（在您的 accentColor 主题上放置一些灰色），这可能会告诉用户他没有什么可完成的（也许您希望用户单击模式和使用默认值完成该字段）。对于只是禁用输入 Vikas Pandey 答案应该是可接受的。 这才是真正的答案！enabled=false 阻止错误消息出现的问题
enabled=false 不做任何事情【参考方案4】：
类似于 html 中的 readonly
TextField(
enableInteractiveSelection: false,
focusNode: FocusNode(),
)
这可以响应onTap。
类似于 html 中的禁用
TextField(
enable: false
)
这无法响应 onTap。
【讨论】：
这正是我在日历输入中所需要的。谢谢！【参考方案5】：这不是框架当前提供的功能，但您可以使用FocusScope 来防止TextFormField 请求焦点。
这是禁用时的样子。
（带有提示文本）
（具有只读值）
这是启用后的样子。
（有焦点）
（没有焦点）
代码如下：
import 'package:flutter/material.dart';
void main()
runApp(new MaterialApp(
home: new HomePage(),
));
class HomePage extends StatefulWidget
HomePageState createState() => new HomePageState();
class HomePageState extends State<HomePage>
TextEditingController _controller = new TextEditingController();
bool _enabled = false;
@override
Widget build(BuildContext context)
ThemeData theme = Theme.of(context);
return new Scaffold(
appBar: new AppBar(
title: new Text('Disabled Text'),
),
floatingActionButton: new FloatingActionButton(
child: new Icon(Icons.free_breakfast),
onPressed: ()
setState(()
_enabled = !_enabled;
);
),
body: new Center(
child: new Container(
margin: const EdgeInsets.all(10.0),
child: _enabled ?
new TextFormField(controller: _controller) :
new FocusScope(
node: new FocusScopeNode(),
child: new TextFormField(
controller: _controller,
style: theme.textTheme.subhead.copyWith(
color: theme.disabledColor,
),
decoration: new InputDecoration(
hintText: _enabled ? 'Type something' : 'You cannot focus me',
),
),
),
),
),
);
【讨论】：
不需要添加这个吗？FocusScopeNode(canRequestFocus: _enabled, child: .....【参考方案6】：
这是以某种方式禁用TextField 但保留其功能的另一种方法。我的意思是onTap 用法
TextField(
enableInteractiveSelection: false,
onTap: () FocusScope.of(context).requestFocus(new FocusNode()); ,
)
enableInteractiveSelection
将禁用TextField的内容选择
FocusScope.of(context).requestFocus(new FocusNode());
将焦点更改为未使用的焦点节点
使用这种方式，您仍然可以触摸TextField，但无法输入或选择其内容。相信我，它有时会很有用（日期选择器，时间选择器，...）:)
【讨论】：
这正是我想要的。谢谢 不需要。有readOnly 属性【参考方案7】：
使用readOnly:true 是正确的。但是，如果您仍想关注此文本字段，您可以按照以下代码进行操作：
TextFormField(
showCursor: true,//add this line
readOnly: true
)
如果你想隐藏文本指针（光标），你需要将enableInteractiveSelection设置为false。
【讨论】：
【参考方案8】：现在有一种方法可以禁用 TextField 和 TextFormField。见githubhere。
像这样使用它：
TextField(enabled: false)
【讨论】：
可能是最佳答案，我想知道为什么它没有投票【参考方案9】：我使用了 readOnly 和 enableInteractiveSelection 属性的组合来在 TextField 上实现所需的行为。
TextField(
readOnly: true,
enableInteractiveSelection: true,
onTap: ()
do_something(),
,
)
enableInteractiveSelection 设置为 true，它将允许 onTap() 正常工作。
【讨论】：
这是最好的答案！非常感谢！ 在 onTap 函数中尝试使用 FocusScope.of(context).unfocus();它将禁用写入模式【参考方案10】：我尝试使用 FocuseNode()，启用 = false 但无法正常工作， 取而代之的是，我使用了一个名为 AbsorbPointer 的 widget。它用于防止小部件触摸或点击，我将 TextFormField 或其他小部件包装在 AbsordPointer 小部件中，并提供一个参数以禁用触摸
示例
AbsorbPointer(
absorbing: true, //To disable from touch use false while **true** for otherwise
child: Your WidgetsName
);
【讨论】：
这对我有用。absorbing 参数将默认为 true 所以你省略
谢谢【参考方案11】：
它有enabled 键，这对我来说很好。
TextFormField(
enabled: false,
)
【讨论】：
【参考方案12】：使用readOnly: true
TextField(
readOnly: true,
controller: controller,
obscureText: obscureText,
onChanged: (value)
onValueChange();
,
style: TextStyle(
color: ColorResource.COLOR_292828,
fontFamily: Font.AvenirLTProMedium.value,
fontSize: ScreenUtil().setHeight(Size.FOURTEEN)),
decoration: InputDecoration(
border: InputBorder.none,
hintText: hint,
hintStyle: TextStyle(
fontSize: ScreenUtil().setHeight(Size.FOURTEEN),
color: ColorResource.COLOR_HINT,
fontFamily: Font.AvenirLTProBook.value)),
),
【讨论】：
【参考方案13】：删除本机键盘，然后以编程方式聚焦 TextField（例如，单击表情符号按钮后）：
FocusScope.of(context).requestFocus(titleFocusNode);
titleFocusNode.consumeKeyboardToken();
【讨论】：
【参考方案14】：它对我有用
TextField(
readOnly: true,
onChanged: (value) ,
)
【讨论】：
以上是关于禁用颤振中的文本编辑字段的主要内容，如果未能解决你的问题，请参考以下文章