現役エンジニアに悩みや疑問を30分間無料で質問し放題!

【Flutter】Centerの使い方|Widgetを中央に配置する

flutter Center

今回は「Center」の基本的な使い方について紹介します。

Centerを使えば指定したWidgetを中央に配置できます!

目次

Centerの基本プロパティ

Centerなし

Centerを使用しない場合、一つ前のWidgetの左下に表示されます。

//ソース
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text("Flutter"),
        ),
        body: Text("Hello World"),
      ),
    );
  }

Centerあり

childプロパティで指定したWidgetが中央表示されます。

//ソース
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text("Flutter"),
        ),
        body: Center(
          child: Text("Hello World"),
        ),
      ),
    );
  }

実装できるWidget:なんでもOK

以上です。

  • URLをコピーしました!
目次
閉じる