Flutter PopupMenuButton-如何有条件地禁用它

时间:2019-04-19 18:47:29

标签: flutter

我在PopupMenuButton上有一个简单的appTitle实现。在这里:

PopupMenuItem<int> _buildMenuItem(int size) {
  return PopupMenuItem<int>(
    value: size,
    child: Text('${size}x$size'),
  );
}

return Scaffold(
  appBar: AppBar(
    title: Text('Some title'),
    actions: <Widget>[
      PopupMenuButton<int>(
        icon: Icon(Icons.refresh),
        onSelected: _canReplay()
            ? (int size) {
                // do something with the size
              }
            : null,
        itemBuilder: (BuildContext context) => <PopupMenuItem<int>>[
              _buildMenuItem(3),
              _buildMenuItem(4),
              _buildMenuItem(5),
            ],
      ),
    ],
  ),
  body: ...
);

已更新-我已经意识到我最初的问题可能不太清楚,所以我在下面重新表述:

我想实现的是根据应用条件禁用PopupMenuButton。使用上面的代码,我可以启用/禁用onSelected方法调用,但是图标外观不会改变。

总结-我希望通过将PopupMenuButton传递给其IconButton方法来禁用整个null及其图标,以同样的方式禁用onPressed 。这样,用户甚至无法按下按钮并调用菜单。

那可以实现吗?

2 个答案:

答案 0 :(得分:0)

您可以使用enabled小部件的PopupMenuItem属性。

  PopupMenuItem<int> _buildMenuItem(int size, bool enabled) {
    return PopupMenuItem<int>(
      value: size,
      child: Text('${size}x$size'),
      enabled: enabled,
    );
  }


      itemBuilder: (BuildContext context) => <PopupMenuItem<int>>[
        _buildMenuItem(3, true),
        _buildMenuItem(4, false),
        _buildMenuItem(5, true),
      ],

更多信息:https://docs.flutter.io/flutter/material/PopupMenuItem/enabled.html

更新

根据您提供给我们的有关问题的新信息,无法使用PopupMenuButton按钮来禁用按钮,但这是Flutter,因此您可以创建自己的窗口小部件。

我创建了一个自定义PopupMenuButton,您可以在其中使用enabled属性,看看:

https://gist.github.com/diegoveloper/a388dd42a01ffff04cd51ec026381fe3

用法:

    MyOwnPopupMenuButton<int>(
          enabled: _canReplay(),
          icon: Icon(
            Icons.refresh,
            color: _canReplay() ? Colors.black : Colors.black.withOpacity(0.4),
          ),
          onSelected: _canReplay()
              ? (int size) {
                  // do something with the size
                }
              : null,
          itemBuilder: (BuildContext context) => <PopupMenuItem<int>>[
                _buildMenuItem(3),
                _buildMenuItem(4),
                _buildMenuItem(5),
              ],
        )

答案 1 :(得分:0)

几个小时后,我得到了一个符合我要求的以下解决方案,并且无需任何复杂的自定义小部件即可实现该解决方案。在这里:

return Scaffold(
  appBar: AppBar(
    title: Text(allTranslations.text('Some title')),
    actions: <Widget>[
      _canReplay()
          ? PopupMenuButton<int>(
              icon: Icon(Icons.refresh),
              onSelected: (int size) {
                // do something with size
              },
              itemBuilder: (BuildContext context) => <PopupMenuItem<int>>[
                    _buildMenuItem(3),
                    _buildMenuItem(4),
                    _buildMenuItem(5),
                  ],
            )
          : IconButton(
              icon: Icon(Icons.refresh),
        onPressed: null,
            ),
    ],
  ),
  body: ...
);