所有小部件的颤动填充？

Question

我正在尝试在 Card 小部件中的某些文本和图标的顶部和底部添加一些填充。我发现 flutter 有一种简单的方法可以对容器执行此操作，但似乎找不到对其他小部件执行此操作的方法（除了将它们包装在容器中）。这是我目前得到的代码：

  body: new Container(
    padding: new EdgeInsets.all(10.0),
    child: new Column(
      crossAxisAlignment: CrossAxisAlignment.stretch,
      children: <Widget> [
        new Card(
          color: Colors.white70,
          child: new Container(
            padding: new EdgeInsets.all(10.0),
            child: new Column(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              crossAxisAlignment: CrossAxisAlignment.center,
              children: <Widget> [ //Padding between these please
                new Text("I love Flutter", style: new TextStyle(fontSize: 20.0, fontWeight: FontWeight.bold)),
                new Icon(Icons.favorite, color: Colors.redAccent, size: 50.0)
              ]
            )
          )
        )
      ]
    )
  )

所以在我的子列中，我想在顶部和底部添加一些填充，而不必插入新的容器。这可能吗？

Answer 1

您可以使用 Padding，这是一个非常简单的 Widget，只需将另一个 Widget 作为 child 和一个 EdgeInsets 对象，例如您已经在使用的 padding.

Flutter中"composition over inheritance"的这种做法是非常有意的。您可以在 Flutter 的 Gitter channel.

上找到最近关于优缺点的讨论

Answer 2

这是一个补充答案，提供了一些代码。正如接受的答案所述，您可以使用 Padding 小部件。 Flutter 与 Android 或 iOS 不同，因为 Padding 是一个 widget 而不是属性。（它是一个属性的Container，但在内部它仍然是一个widget。）

这是一个用填充小部件包裹的文本小部件。

Padding(
  padding: const EdgeInsets.all(8.0),
  child: Text("text"),
);

查看我更完整的回答。

Answer 3

如果您使用的是 Visual Studio 代码，请突出显示您的小部件，单击灯泡，然后从菜单中选择 select 使用填充包裹。

正如您在图片中看到的，它自动将小部件包裹在 Padding 小部件周围。

@override
  Widget build(BuildContext context) {

    return Container(child: Padding(
      padding: const EdgeInsets.all(8.0),
      child: TextField(
        decoration: InputDecoration(border: InputBorder.none, hintText: 'Enter a text'),
      ),
    ));
  }

Answer 4

More information - Flutter Padding

使用填充小部件。

下面的代码只是将填充添加到文本小部件，如图所示。使用 Flutter Inspector 查看 padding 的布局。

Padding(
          padding: const EdgeInsets.all(50.0),
          child: Text('Text Widget'),
        ),

所有小部件的颤动填充？

Flutter padding for all widgets?

android

ios

flutter