【Flutter】AppBarの背景色、フォントサイズ・位置(左寄せ)の変更

【Flutter】AppBarの背景色、フォントサイズ・位置(左寄せ)の変更

AppBarの背景色や、テキストのフォントサイズ・位置を調整する方法です。

元々のデザインを→

このデザインに

以下のように、テキスト色、テキストのフォントサイズ、背景色、中央寄せor左寄せを設定できます。

appBar: AppBar(
    title: Text(
        "しおり",
        textAlign: TextAlign.left,
        style: TextStyle(
          color: Colors.black, // テキストの色
          fontSize: 25, // テキストのフォントサイズ
          fontWeight: FontWeight.bold, // font-weight
        ),
    ),
    backgroundColor: Colors.white,  // AppBarの背景色
    centerTitle: false,  // falseで左寄せ、trueだと中央寄せ
    bottom: TabBar(
        controller: _tabController,
        tabs: [
          Tab(
            text: 'すべて',
          ),
          Tab(text: 'お気に入り'),
          Tab(text: '共有'),
        ],
        labelColor: Colors.black,
    ),
),