SwiftUIでのカスタムフォントの設定方法

iOS

手順

  1. カスタムフォントを用意
  2. カスタムフォントをプロジェクトに追加
  3. Info.plistに設定追加
  4. カスタムフォントを使用する実装を行う

カスタムフォントの用意

  • SwiftUIでは、 .ttf.otf ファイルをサポートしています
  • フォントはCreative Market に素敵なフォントが数多くあります
    • Creative Marketのフォントを商用利用する場合、結構高価です…。しかし、無料で提供されているフォントを入手することができるため、たまにサイトを覗いて気に入ったフォントを入手しておくと良いと思います

カスタムフォントをプロジェクトに追加

  • 用意したフォントをプロジェクトに追加しましょう
  • Add to targets にチェックをつけてコンパイルされるようにしておきます
    • チェックを付け忘れて追加した場合は、Build Phase → Copy Bundle Resources で対象のカスタムフォントを追加しましょう

カスタムフォントのプロジェクト追加

Info.plistの設定

  • key名 Fonts provided by application を追加
  • 配列のvalueに対象のカスタムフォントファイル名を記述します

カスタムフォントを使用する実装を行う

  • .customで対象カスタムフォント名を指定する
    • ここで指定する対象のカスタムフォント名 = カスタムフォントのファイル名ではないっぽいので、うまく反映されない場合は対象のカスタムフォントの .ttf or .otfファイルを開いて Font Book アプリケーションを起動し、Font Bookで表示されているフォント名を指定して見てください!規則性が明確にわかっていないですが、自分の場合はうまくいきました!(特にカスタムフォントのファイル名に空白が入っている場合だとうまく反映されないっぽいです)
// SwiftUIでの実装
Text("Hello, world!")
  .font(.custom("Costiera", size: 56))
  .padding()

UIFontDescriptor.SystemDesign を使用する実装

// SwiftUI
Text("Hello World")
    .font(.system(.title, design: .serif)) // New York font
最新情報をチェックしよう!