Flutter 消息应用程序 - 禁用图标按钮

Question

我有一个消息应用程序，您可以在其中从要与之交谈的用户列表中进行选择。应用栏上有一个图标按钮，您可以在其中确认要发送消息的用户组。现在，用户可以多次向图标按钮发送垃圾邮件。我想在按下一次图标按钮后禁用它。我有一个 bool iconEnabled 变量，但我不确定将它放在 onPressed 的什么位置。

return Scaffold(
      appBar: AppBar(
        title: Text("Users"),
        actions: <Widget>[
          new IconButton(
            icon: new Icon(Icons.check),
            onPressed: widget.isNew
                ? () async {
                    if (newUsers.length == 0) {
                      return;
                    }
                    widget.thread.users.addAll(newUsers);
                    widget.thread.userIds.addAll(widget.thread.users.map((user) => user.id).toList());
                    widget.thread.users = widget.thread.users;
                    // Call New Thread
                    var threadId = await Client.addThread(widget.thread);
                    widget.thread.id = threadId;
                    Navigator.pushReplacement(
                      context,
                      MaterialPageRoute(
                        settings: RouteSettings(name: "MessagePage"),
                        builder: (context) => MessagePage(
                          thread: widget.thread,
                        ),
                      ),
                    );
                  }
                : () {
                    if (newUsers.length == 0) {
                      return;
                    }
                    widget.thread.users.addAll(newUsers);
                    widget.thread.userIds.addAll(widget.thread.users.map((user) => user.id).toList());
                    widget.thread.users = widget.thread.users;
                    // Call users patch
                    Client.addUsers(widget.thread);
                    Navigator.pop(context);
                  },
          ),
        ],
      ),

Answer 1

如果您已经完成了何时启用/禁用按钮的逻辑，那么您已经完成了 99% 的工作。

如果 onPressed 传递为 null，则该按钮将被禁用。所以你可以对IconButton的创建做一点改动：

onPressed: !iconEnabled ? null : (widget.isNew // ... and put the closing parentheses after the onPressed callbacks

Answer 2

使用 AbsorbPointer 小部件包装 IconButton，如下所示：

AbsorbPointer(
          absorbing: buttonDisabled,
          child: IconButton(
          icon: Icon(Icons.check),
          onPressed: () { disableButton();}
        ),
      ),

对于这个例子，我声明了一个全局变量：

 bool buttonDisabled = false;

按下按钮时：

 void disableButton() {
    setState(() {
     buttonDisabled = true; 
    });
  }