[Flutter]フォントを変更する

広告Flutter
2024年2月21日

Flutter の Android で日本語が旧字体になってしまうため、フォントを変更しました。

環境
  • Flutter 3.16.5

フォントをダウンロード

使いたいフォントファイルをダウンロードします。 今回は Noto Sans JP を使います。

Noto Sans JP https://fonts.google.com/noto/specimen/Noto+Sans+JP?query=noto

ダウンロードしたファイルを<プロジェクト>/fonts配下に保存します。

pubspec.yaml に fonts 設定追加

pubspec.yaml に fonts の記述を追加します。 今回はfonts/NotoSansJP-Regular.ttfを使います

pubspec.yaml
flutter:
  uses-material-design: true
 ・・・
  fonts:
    - family: Noto Sans JP
      fonts:
        - asset: fonts/NotoSansJP-Regular.ttf

main.dart の MaterialApp の fontFamily を変更

MaterialApp theme にフォントファミリー設定を追加します。

main.dart
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Mochoto Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
        fontFamily: "Noto Sans JP", // <-- 追加
      ),
      home: MyHomePage(),
    );
  }
}
変更前/変更後
変更前/変更後