Flutter升级后，FlatButton边距发生了变化

Question

我运行了Flutter升级，它导致了我的一个布局的回归。

这是代码：

      Row(
        mainAxisAlignment: MainAxisAlignment.spaceEvenly,
        children: [
          FlatButton(
            child: Icon(
              Icons.remove,
              color: Colors.black,
            ),
            onPressed: () {
              setState(() {
                if (_debitValue > 1) _debitValue--;
              });
            },
          ),

          Slider(
            value: _debitValue.toDouble(),
            min: 1.0,
            max: 100.0,
            onChanged: (double value) {
              setState(() {
                _debitValue = value.toInt();
              });
            },
          ),

          FlatButton(
            child: Icon(
              Icons.add,
              color: Colors.black,
            ),
            onPressed: () {
              setState(() {
                if (_debitValue <100) _debitValue++;
              });
            },
          ),
        ],
      ),

这是一行带有“ - ”按钮，然后是滑块，然后是“+”按钮。

它显示得很好。昨天我做了Flutter升级，它现在超过屏幕宽度8像素。它说：

I/flutter (13431): ══╡ EXCEPTION CAUGHT BY RENDERING LIBRARY ╞═════════════════════════════════════════════════════════
I/flutter (13431): The following message was thrown during layout:
I/flutter (13431): A RenderFlex overflowed by 8.0 pixels on the right.
I/flutter (13431): 
I/flutter (13431): The overflowing RenderFlex has an orientation of Axis.horizontal.
I/flutter (13431): The edge of the RenderFlex that is overflowing has been marked in the rendering with a yellow and
I/flutter (13431): black striped pattern. This is usually caused by the contents being too big for the RenderFlex.
I/flutter (13431): Consider applying a flex factor (e.g. using an Expanded widget) to force the children of the
I/flutter (13431): RenderFlex to fit within the available space instead of being sized to their natural size.
I/flutter (13431): This is considered an error condition because it indicates that there is content that cannot be
I/flutter (13431): seen. If the content is legitimately bigger than the available space, consider clipping it with a
I/flutter (13431): ClipRect widget before putting it in the flex, or using a scrollable container rather than a Flex,
I/flutter (13431): like a ListView.

我添加了一些颜色来查看FlatButtons使用的边距。它们看起来很大。我试图改变它们，但我没有成功。我试过了：

FlatButton(materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, ...)

我已经看到我可以使用Inkwell而不是FlatButton。它有效，但对按钮的影响是不同的，我想了解如何使用FlatButton。

谢谢你的建议

Answer 1

我没有测试过，但也许这样的东西可以工作吗？

Row(
  children: <Widget>[
    Expanded(
      child: FlatButton(
        ...,
      ),
      flex: 1,
    ),
    Expanded(
      child: Slider(
        ...,
      ),
      flex: 4, //maybe play with this value to see what looks best
    ),
    Expanded(
      child: FlatButton(
        ...,
      ),
      flex: 1,
    ),
  ],
),