如何在颤动中禁用 texformfield 输入?
Posted
技术标签:
【中文标题】如何在颤动中禁用 texformfield 输入?【英文标题】:How can I disable texformfield input in flutter? 【发布时间】:2019-04-09 05:54:47 【问题描述】:在我用 Flutter 编写的应用程序中,我需要一个图标按钮来启用/禁用对其的输入。我声明了要启用/禁用向 TextFormField 保存信息的 bool 变量。但是,它没有按预期工作。看起来它取决于键盘的类型,因此在使用所有字符键盘之前,它不会被验证。因此,如果我禁用仅允许数字键盘的字段,则在切换到包含所有字符 kexboard 的字段之前,不会禁用字段输入。那么,如何立即禁用 TextFomField 的输入?
`import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:aisscanning/data/database_helper.dart';
import 'package:aisscanning/data/inventoryitem.dart';
import 'package:aisscanning/data/masteritem.dart';
class InventoryScanning extends StatefulWidget
InventoryScanning(Key key, this.title) : super(key: key);
final String title;
@override
_InventoryScanningState createState() => new _InventoryScanningState();
class _InventoryScanningState extends State<InventoryScanning>
static GlobalKey<FormState> _formKey = new GlobalKey<FormState>();
final TextEditingController teSku = TextEditingController();
final TextEditingController teDesc = TextEditingController();
final TextEditingController teLoc = TextEditingController();
final TextEditingController teSubLoc = TextEditingController();
final TextEditingController teQty = TextEditingController();
final TextEditingController tePrice = TextEditingController();
bool lockLoc = true;
bool lockSubLoc = true;
bool lockQty = true;
@override
Widget build(BuildContext context)
return new Scaffold(
appBar: new AppBar(
title: new Text("Item Scanning"),
backgroundColor: Colors.black,
),
resizeToAvoidBottomPadding: false,
body: Padding(
padding: const EdgeInsets.only(top: 12.0),
child: new Form(
key: _formKey,
autovalidate: true,
child: new ListView(
// padding: const EdgeInsets.symmetric(horizontal: 16.0),
padding: new EdgeInsets.all(8.0),
itemExtent: 60.0,
children: <Widget>[
new Row(
// Location
mainAxisSize: MainAxisSize.min,
children: <Widget>[
IconButton(
icon: const Icon(
Icons.lock,
color: const Color(0xFF167F67),
size: 25.0,
),
onPressed: ()
if (lockLoc == false)
lockLoc = true;
else
lockLoc = false;
,
),
Expanded(
child: TextFormField(
controller: teLoc,
keyboardType: TextInputType.number,
enabled: lockLoc,
style: new TextStyle(
color: const Color(0xFF0f2638),
fontFamily: 'ProximaNova',
fontStyle: FontStyle.normal,
fontSize: 20.0,
),
decoration: new InputDecoration(
hintText: 'Enter Location or press Search Icon',
labelText: 'Location',
fillColor: Colors.white,
contentPadding: new EdgeInsets.symmetric(
vertical: 15.0, horizontal: 10.0),
border: new OutlineInputBorder(
borderRadius: new BorderRadius.circular(25.0),
borderSide: new BorderSide(),
),
labelStyle: TextStyle(
color: Colors.black,
fontWeight: FontWeight.w600,
fontSize: 20.0,
),
),
),
),
IconButton(
icon: const Icon(
Icons.search,
color: const Color(0xFF167F67),
size: 25.0,
),
onPressed: () ,
),
],
),
new Row(
// SubLocation
mainAxisSize: MainAxisSize.min,
children: <Widget>[
IconButton(
icon: const Icon(
Icons.lock,
color: const Color(0xFF167F67),
size: 25.0,
),
onPressed: ()
if (lockSubLoc == false)
lockSubLoc = true;
else
lockSubLoc = false;
,
),
Expanded(
child: TextFormField(
controller: teSubLoc,
enabled: lockSubLoc,
style: new TextStyle(
color: const Color(0xFF0f2638),
fontFamily: 'ProximaNova',
fontStyle: FontStyle.normal,
fontSize: 20.0,
),
decoration: new InputDecoration(
hintText: 'Enter SubLocation',
labelText: 'SubLocation',
contentPadding: new EdgeInsets.symmetric(
vertical: 15.0, horizontal: 10.0),
fillColor: Colors.white,
border: OutlineInputBorder(
borderRadius: new BorderRadius.circular(25.0),
borderSide: new BorderSide(),
),
//fillColor: Colors.green
labelStyle: TextStyle(
color: Colors.black,
fontWeight: FontWeight.w600,
fontSize: 16.0,
),
),
),
),
IconButton(
icon: const Icon(
Icons.search,
color: const Color(0xFF167F67),
size: 25.0,
),
onPressed: () ,
),
],
),
new Row(
// QTY
mainAxisSize: MainAxisSize.min,
children: <Widget>[
IconButton(
icon: const Icon(
Icons.lock,
color: const Color(0xFF167F67),
size: 25.0,
),
onPressed: ()
if (lockQty == false)
lockQty = true;
else
lockQty = false;
,
),
Expanded(
child: TextFormField(
controller: teQty,
textAlign: TextAlign.right,
keyboardType: TextInputType.number,
enabled: lockQty,
style: new TextStyle(
color: const Color(0xFF0f2638),
fontFamily: 'ProximaNova',
fontStyle: FontStyle.normal,
fontSize: 18.0,
),
decoration: new InputDecoration(
hintText: 'Enter Quantity',
labelText: 'Quantity',
contentPadding: new EdgeInsets.symmetric(
vertical: 15.0, horizontal: 10.0),
border: new OutlineInputBorder(
borderRadius: new BorderRadius.circular(30.0),
borderSide: new BorderSide(),
),
labelStyle: TextStyle(
color: Colors.black,
fontWeight: FontWeight.w600,
fontSize: 20.0,
),
),
),
),
],
),
new Row(
// Buttons
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: <Widget>[
new RaisedButton(
child: new Text("Save"),
onPressed: ()
addRecord();
,
shape: new RoundedRectangleBorder(
borderRadius: new BorderRadius.circular(30.0)),
color: Colors.green,
elevation: 4.0,
),
new RaisedButton(
child: new Text("Cancel"),
onPressed: () ,
shape: new RoundedRectangleBorder(
borderRadius: new BorderRadius.circular(30.0)),
color: Colors.red,
elevation: 4.0,
),
],
),
]),
),
),
);
`
【问题讨论】:
也许我不够清楚:对于 TexFormField 我有一个 IconButton,onPressed 我更改或响应 bool 变量的状态。 TexFormField 已启用:propery。但是,直到更改键盘类型,TextFormField 的状态才会与其对应。因此,如果我有许多使用键盘类型的 TexFormField:TextInputType.number,则不会引发启用,除非我使用普通键盘将焦点放在 TexFormField 上。 您没有在 onPressed 函数中调用 setstate。调用 setState() 拜托,你能给我一个方法吗?我的 onPressed 是这样的: () if (lockLoc == false) lockLoc = true; 否则 lockLoc = false; 代码已添加...! 【参考方案1】:当我们需要更新屏幕 UI 时,我们需要调用 SetState()。所以在你的代码中的 onPressed 方法中。
onPressed: ()
setState(()
if (lockLoc == false)
lockLoc = true;
else
lockLoc = false;
);
,
【讨论】:
谢谢,这正是我需要的。以上是关于如何在颤动中禁用 texformfield 输入?的主要内容,如果未能解决你的问题,请参考以下文章