web-dev-qa-db-ja.com

すべてのウィジェットのフラッターパディング?

カードウィジェットのテキストとアイコンの上部と下部にパディングを追加しようとしています。 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)
              ]
            )
          )
        )
      ]
    )
  )

そのため、私の列の子では、新しいコンテナを挿入することなく、上下にパディングを追加したいと思います。これは可能ですか?

26
Bram Vanbilsen

Paddingを使用できます。これは、非常に単純なWidgetで、別のWidgetchildおよびEdgeInsetsオブジェクトとして使用します。 paddingとして。

Flutterの「継承に対する構成」というこのアプローチは、非常に意図的なものです。 Flutterの長所と短所に関する最近の議論は、Flutterの Gitterチャネル にあります。

44
david.mihola

以下は、いくつかのコードを提供する補足的な回答です。受け入れられた答えが示すように、Paddingウィジェットを使用できます。 Flutterは、AndroidまたはiOSとは異なります。Paddingはプロパティではなくウィジェットであるためです(コンテナのプロパティですが、内部的にはまだウィジェットです)。

これは、パディングウィジェットでラップされたテキストウィジェットです。

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

私のより完全な答えを参照してください こちら

18
Suragch