【お知らせ】みんプロ式Flutter講座は2026年4月末をもって新規販売を終了いたしました。詳しくはこちら →

[Flutter]AppBarThemeを使ってAppBarをカスタマイズする場合はフォントの再設定(AppBarTheme.titleTextStyle)が必要な場合あり

このページには広告が含まれる場合があります。

 

Flutterのプロジェクトは、デフォルトでは以下のような外観(テーマ)になっていますが、

 

MaterialApp.themeプロパティ内でThemeDataクラスを使ってアプリ全体の外観をカスタマイズすることができます(以下の例ではダークテーマに変更)。

Defines the configuration of the overall visual Theme for a MaterialApp or a widget subtree within the app.

 

また、画面上部のアプリバー(AppBar)も、ThemeData.appBarTheme属性を設定することで、アプリ全体に統一的なアプリバーのカスタマイズができます。

 

アプリ起動中にテーマの切り替えを行わない場合は問題ないのですが、以下のような仕組みを使ってアプリ起動中にテーマの切り替えを行い、

かつアプリバーのカスタマイズも行っている場合、テーマの切り替えを行った際にアプリバー(AppBar)のフォントが小さくなってしまう場合があります。

 

これはFlutter公式のissueにも上がっていてSDKでの手当てがまだ無いようなのですが、アプリバー(AppBar)のデフォルトのフォントが「TextTheme.headline6」となっていて、

If this property is null, then AppBarTheme.titleTextStyle of ThemeData.appBarTheme is used. If that is also null, the default value is a copy of the overall theme’s TextTheme.headline6 TextStyle, with color set to the app bar’s foregroundColor.

 

「TextTheme.headline6」のフォントサイズは「20(ロジカルピクセル)」のようなので、

AppBarのフォントを変えたくない場合は、以下のような感じで、AppBarTheme.titleTextStyle属性で、フォントサイズを設定してやる必要があります。

(詳しくは、以下の動画で解説していますので、よろしければご覧下さい)

こんな記事も読まれています

GAMBO(願望) 願望実現・目標達成の
17秒 / 68秒ワーク
GAMBO(願望) 引き寄せ難民だったぼくの挫折経験から生まれた誰でもできる願望実現サポートアプリ。かの有名な17秒/68秒ワークを独自の視覚化メソッドで簡単実践。
App Store / Google Play 詳しく見る →
Meiso(瞑想) 鐘音と自然音で
5分からのマインドフルネス
Meiso(瞑想) 初心者でも“迷わず続けられる”ことにこだわった、完全無料の瞑想アプリ。画面のガイドに従うだけで呼吸のリズムが整い、最短5分から瞑想を実践できます。
App Store / Google Play 詳しく見る →
小学生からの英検®単語 A ふりがな・音声付き
英検単語1日5分トレーニング
小学生からの英検®単語 ありそうでなかった!ふりがな付き英検®単語トレーニングアプリ!1日たった5分!スキマ時間を活用して、英検®頻出単語を効率的に習得。お子様の一人学習にも安心設計。
App Store / Google Play 詳しく見る →
オボエルンジャー レトロゲームで
nバック脳トレ
オボエルンジャー 科学的脳力開発法「Nバック課題」をファミコン風8bitレトロゲームにアレンジした新感覚脳トレアプリ。記憶力・感情コントロール力・集中力の向上に。
App Store / Google Play 詳しく見る →
ゴイコイコイ 超高速フラッシュカードで
語彙習得
ゴイコイコイ 日常語1400語を視覚的に学べる、高速読み上げフラッシュカード式の語彙トレーニングアプリ。知育教室で行われるフラッシュカード学習を、家庭で“手軽に・安価に・正確に”再現。
App Store / Google Play 詳しく見る →

TOP