为什么我无法在Flutter ButtonBar中增加按钮的宽度？

Question

7 浏览2023年1月6日

匿名的 2023年1月6日

0 Comments

我试图增加按钮栏按钮的宽度，所以我使用了buttonMinWidth，但不知何故它不起作用，这是我的代码：\nButtonBar(\n children: [\n TextButton.icon(\n onPressed: null,\n icon: const Icon(\n Icons.replay,\n color: Colors.red,\n ),\n label: const Text(\n \"重试\",\n style: TextStyle(color: Colors.red),\n ),\n ),\n TextButton.icon(\n onPressed: null,\n icon: const Icon(\n Icons.replay,\n color: Colors.green,\n ),\n label: const Text(\n \"继续\",\n style: TextStyle(color: Colors.green),\n ),\n ),\n ],\n buttonMinWidth: 100,\n),\n\n可能很简单，但我找不到问题所在。

0

1 答案

匿名的 · Answer 1 · 2023-09-21T11:46:37+00:00

为什么无法在Flutter的ButtonBar中增加按钮宽度？

问题原因：Flutter的ButtonBar是一个水平排列的按钮组件，它的宽度通常是根据按钮的数量和内容自动调整的。然而，有些情况下我们需要手动设置ButtonBar的宽度，但是默认情况下无法直接设置宽度。

解决方法：可以使用SizedBox组件将ButtonBar包裹起来，并设置SizedBox的宽度属性来间接控制ButtonBar的宽度。下面是一个示例代码：


SizedBox(
  width: 300,
  child: ButtonBar(
    children: [
      TextButton.icon(
        onPressed: null,
        icon: const Icon(
          Icons.replay,
          color: Colors.red,
        ),
        label: const Text(
          "Retry",
          style: TextStyle(color: Colors.red),
        ),
      ),
      TextButton.icon(
        onPressed: null,
        icon: const Icon(
          Icons.replay,
          color: Colors.green,
        ),
        label: const Text(
          "Continue",
          style: TextStyle(color: Colors.green),
        ),
      ),
    ],
  ),
),

通过将ButtonBar包裹在SizedBox中，并设置SizedBox的宽度为300，可以实现手动设置ButtonBar的宽度。这样就可以解决无法直接设置ButtonBar宽度的问题。注意，这只是一种解决方法，并不一定是最佳解决方案。