如何在 flutter 中禁用 texformfield 输入？

Question

在我用 Flutter 编写的应用程序中，我需要一个图标按钮来 enable/disable 输入。我将向 TextFormField 保存信息的 bool 变量声明为 enabled/disabled。但是，它没有按预期工作。看起来它取决于键盘的类型，因此在使用所有字符键盘之前，它不会被验证。因此，如果我禁用仅允许数字键盘的字段，则在我切换到包含所有字符 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,
                    ),
                  ],
                ),
              ]),
        ),
      ),
    );
  }

`

Answer 1

当我们需要更新屏幕时 UI 我们需要调用 SetState()。所以在 onPressed 方法的代码中。

onPressed: () {
                      setState(() {
                             if (lockLoc == false) {
                                   lockLoc = true;
                                  } else {
                                    lockLoc = false;
                                  }
                              });
                           },

如何在 flutter 中禁用 texformfield 输入？

How can I disable texformfield input in flutter?

textfield

disabled-input

flutter