Question

我想根据页面的上下文隐藏和显示应用栏操作按钮。可能需要将IconButton放在另一个小部件中，但是哪个小部件的属性类似于isHidden？

appBar: AppBar(
  title: Text("Work Order"),
  backgroundColor: Colors.black,
  actions: <Widget>[
    IconButton(
      onPressed: () {},
      icon: Icon(Icons.delete),
    ),
    IconButton(
      onPressed: () {},
      icon: Icon(Icons.add),
    ),
  ],
),

更新：

简单的方法是使用空的Container（）

appBar: AppBar(
  title: Text("Work Order"),
  backgroundColor: Colors.black,
  actions: <Widget>[
    _isDeleteMode ? IconButton(
      onPressed: () {},
      icon: Icon(Icons.delete) : Container(),
    ),
    IconButton(
      onPressed: () {},
      icon: Icon(Icons.add),
    ),
  ],
),

Answer 1

您可以使用布尔值标记从小部件树中完全删除图标，如下所示：

appBar: AppBar(
  title: Text("Work Order"),
  backgroundColor: Colors.black,
  actions: yourBoolean ? [
    IconButton(
      onPressed: () {},
      icon: Icon(Icons.delete),
    ),
    IconButton(
      onPressed: () {},
      icon: Icon(Icons.add),
    ),
  ] : [],
),

或者您也可以将图标包装在opacity小部件上。

Answer 2

我找到的最简单的方法是使用一个空的容器

appBar: AppBar(
    title: Text("Work Order"),
    backgroundColor: Colors.black,
    actions: <Widget>[
      _isDeleteMode ? IconButton(
        onPressed: () {},
        icon: Icon(Icons.delete) : Container(),
      ),
      IconButton(
        onPressed: () {},
        icon: Icon(Icons.add),
      ),
    ],
  ),

如何隐藏和显示应用栏操作按钮

2 个答案: