Flutterにフォントを追加する方法


  1. フォントファイルの追加:

    • Flutterプロジェクトのルートディレクトリに「fonts」という名前のフォルダを作成します。
    • 追加したいフォントファイル(.ttfまたは.otf形式)を「fonts」フォルダにコピーします。
  2. pubspec.yamlファイルの編集:

    • Flutterプロジェクトのルートディレクトリにある「pubspec.yaml」ファイルを開きます。

    • 「pubspec.yaml」ファイルの「flutter」セクションに以下のコードを追加します:

      flutter:
      fonts:
       - family: フォントファミリー名
         fonts:
           - asset: fonts/フォントファイル名.ttf
             weight: フォントの太さ(例: 400, 700)
    • 上記のコードの「フォントファミリー名」は、追加したいフォントのファミリー名に置き換えます。

    • 「フォントファイル名.ttf」は、追加したいフォントのファイル名に置き換えます。

  3. フォントの適用:

    • 追加したフォントを使用したいウィジェットで、以下のコードを使用してフォントを適用します:

      Text(
      'テキスト',
      style: TextStyle(
       fontFamily: 'フォントファミリー名',
       fontWeight: FontWeight.normal,
      ),
      )
    • 上記のコードの「フォントファミリー名」は、追加したフォントのファミリー名に置き換えます。

以上の手順に従うと、Flutterプロジェクトにフォントを追加してカスタマイズすることができます。必要に応じて、複数のフォントを追加する場合は、上記の手順を繰り返してください。

また、フォントのスタイルや重さを変更するには、適用するウィジェットのTextStyleを調整することができます。さまざまなウェイトやスタイルのフォントを追加するには、pubspec.yamlファイルの「fonts」セクションに追加の項目を追記し、適用するウィジェットで適切なフォントスタイルを指定します。

以上が、Flutterにフォントを追加する方法の概要です。詳細な情報やさらなるカスタマイズの方法については、Flutter公式ドキュメントを参照してください。