SwiftUIでカスタムフォントを使う
2021年03月09日
![](/images/category//swiftui.png)
使用したいフォントをプロジェクトに設定する事で様々なフォントを使用する事が出来るようになります。
設定を行った後は以下のように記述します
Text("Hello, World!")
.font(.custom("font-name", size: font-size))
// ex:
Text("Hello, World!")
.font(.custom("Selima", size: 60))
![Textをカスタムフォントを使って表示する](/article-images/use-custom-font-with-swiftui/01.png)
フォントの設定方法
フォントファイルをプロジェクトに紐付ける
![フォントファイルをドラッグ・アンド・ドロップ](/article-images/use-custom-font-with-swiftui/02.png)
![Add to targetsにチェックを付ける](/article-images/use-custom-font-with-swiftui/03.png)
info.plistでフォントの設定を行う
「info.plist」に Fonts provided by application
を追加
![Fonts provided by application を追加](/article-images/use-custom-font-with-swiftui/04.png)
プロジェクトで使用する
Mac内のフォントを管理するアプリ「Font Book」を使用しPostScript名
を調べます。
![PostScript名を調べる](/article-images/use-custom-font-with-swiftui/05.png)
PostScript名 をSwiftUI上で指定します
Text("SwiftUI")
.font(.custom("Selima", size: 60))
Text("custom font sample")
.font(.custom("Ayres", size: 40))
![SwiftUIでカスタムフォントを使った時のサンプル](/article-images/use-custom-font-with-swiftui/06.png)
extensionを使う
extensionを使うとフォント名を毎回指定しなくて済み便利です
extension Font {
static func mainFont(size: CGFloat) -> Font {
return Font.custom("Selima", size: size)
}
}
Text("Hello, World!")
.font(Font.mainFont(size: 60))