今回は「Padding」の基本的な使い方について紹介します。
Paddingを使えば指定したWidgetの内側に余白を作れます!
目次
Paddingの基本プロパティ
Paddingなし

Paddingがない場合、CardやContainerなどはchild Widgetの大きさと同じになります。
//ソース
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: Text("Flutter"),
),
body: const Center(
child: Card(
color: Colors.yellow,
child: Text("Hello World"),
),
),
),
);
}
Paddingあり

childプロパティで指定したWidgetに対し、paddingプロパティで余白のサイズを指定できます。
//ソース
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: Text("Flutter"),
),
body: const Center(
child: Card(
color: Colors.yellow,
child: Padding(
padding: EdgeInsets.all(30),
child: Text("Hello World"),
),
),
),
),
);
}
実装できるWidget:なんでもOK
あわせて読みたい


【Flutter】EdgeInsetsの使い方|余白のサイズ・側面を指定する
今回は「EdgeInsets」の基本的な使い方について紹介します。 EdgeInsetsを使えば、余白を作る側面・サイズを指定できます。 【EdgeInsetsの基本コンストラクタ】 EdgeIn...
以上です。