Flutter

Question

我正在编写一个 alertDialog，用户可以在其中键入名称。 alertDialog 有一个“OK”按钮和一个“Annulla”按钮。我希望在 textField 为空时禁用“确定”按钮，然后在用户键入内容时启用。

我正在使用 Whosebug 上一些答案推荐的 statefulBuilder，但显然我的实现不起作用。

  // Function to display a dialog to insert a new item to the list
  Future<void> _displayItemAddDialog(BuildContext context, provider) async {
    String itemName;

    // clear the textField and add the item to the list
    Future<void> onOKPressed() {
      _textFieldController.clear();
      Navigator.pop(context);
      provider.addItem(itemName);
    }

    showDialog(
        context: context,
        builder: (context) {
          return StatefulBuilder(
              builder: (BuildContext context, StateSetter setState) {
            // used to check if to enable the OK button
            bool okButtonEnabled = false;

            return AlertDialog(
              title: Text('Inserisci Nome Oggetto'),
              content: TextField(
                onChanged: (value) {
                  itemName = value;
                  print(value);
                  // if the TextField is not empty then enable the button
                  if (value != "") {
                    // not working :(
                    setState() => okButtonEnabled = true;
                  }
                },
                controller: _textFieldController,
                decoration: InputDecoration(hintText: 'Nome'),
              ),
              actions: <Widget>[
                TextButton(
                  onPressed: () {
                    _textFieldController.clear();
                    Navigator.pop(context);
                  },
                  child: Text('Annulla'),
                ),
                TextButton(
                    // if button enabled then I change the assigned function
                    onPressed: okButtonEnabled ? onOKPressed : null,
                    child: Text('OK')),
              ],
            );
          });
        });
  }

Answer 1

您应该将 okButtonEnabled 移到 StatefulBuilder 之外，就在它上面。

showDialog(
  context: context,
  builder: (context) {
    // Move okButtonEnabled here
    bool okButtonEnabled = false;

    return StatefulBuilder(
      builder: (BuildContext context, StateSetter setState) {
        return AlertDialog(
          title: Text('Inserisci Nome Oggetto'),
          content: TextField(
            onChanged: (value) {
              itemName = value;
              print(value);
              // if the TextField is not empty then enable the button
              if (value != "") {
                 setState(() => okButtonEnabled = true);
              }
            },
            controller: _textFieldController,
            decoration: InputDecoration(hintText: 'Nome'),
          ),
          actions: <Widget>[
            TextButton(
              onPressed: () {
                _textFieldController.clear();
                Navigator.pop(context);
              },
              child: Text('Annulla'),
            ),
            TextButton(
              // if button enabled then I change the assigned function
              onPressed: okButtonEnabled ? onOKPressed : null,
              child: Text('OK')),
          ],
        );
      },
    );
  },
);

Flutter - StatefulBuilder - 未引用声明 setState

Flutter - StatefulBuilder - The declaration setState isn't referenced

android

setstate

dart