android - Flutter，IconButton 在使用对齐或边距或填充时不起作用

Question

 appBar: new AppBar(
      leading: Stack(
        children: <Widget>[
          IconButton(
            icon: const Icon(Icons.arrow_forward),
            onPressed: () {
              _nextPage(1);
            },
            tooltip: 'Next',
            padding: EdgeInsets.only(left: 360.0),
          ),
          IconButton(
            icon: const Icon(Icons.arrow_back),
            onPressed: () {
              _nextPage(-1);
            },
            tooltip: 'Previous',
          ),
        ],
      ),
     ),

block 引用

The two IconButtons , the first one doesn't work but the second does , when you remove the padding it works fine , How should i do this ? , and using Containers wouldn't help as much because they take space too , so what to do ?

Answer 1

那里有很多错误。

首先 您正在使用 Stack , stack 会将你的小部件放在另一个上面，所以你必须使用 Positioned 指定位置或 Align .

第二 如果你查看源代码，你会发现 leading 有宽度限制。小工具。

if (leading != null) {
  leading = new ConstrainedBox(
    constraints: const BoxConstraints.tightFor(width: _kLeadingWidth),
    child: leading,
  );
}

where _kLeadingWidth = 56

第一个解决方案

替换你的 Stack小部件 Row小部件，如果你这样做，你会得到一个溢出异常，因为你的两个 IconButtons 的大小超过宽度 > 56。

最终解决方案(您可以找到更多)

删除您的 IconButton并使用 Icon由 InkWell 包裹(以便接收水龙头)

      return Scaffold(
        appBar: new AppBar(
          leading: Row(
            crossAxisAlignment: CrossAxisAlignment.stretch,
            children: <Widget>[
              InkWell(
                  onTap: () => print("1"),
                  child: Padding(
                      padding: EdgeInsets.all(2.0),
                      child: const Icon(Icons.arrow_forward))),
              InkWell(
                  onTap: () => print("2"),
                  child: Padding(
                      padding: EdgeInsets.all(2.0),
                      child: const Icon(Icons.arrow_back))),
            ],
          ),
        ),
      );