【Swift】UIKitとSwiftUIでカスタムフォントを使用する

Xcodeが標準で用意してくれているフォントは美しく素晴らしいものですが、たまには気分転換に違うフォントを使いたいという気持ちになる時が来ると思います。

その時がやってきた未来の自分の為にこの記事を残しておきます。10年後の自分へ、、、

環境

• Xcode 13.2.1

はじめに

このテキストのフォントを変更します。

フォントファイルを追加する

Xcodeに追加する作業はUIKitとSwiftUIで特に違いはありません。

Xcodeにフォントファイルを追加する

フォントファイルをプロジェクトに追加します。

今回はそのまま追加していますが、Font用のグループフォルダを作って、そこに保存する方法が望ましいでしょう。

ファイルを追加する際に、ダイアログが出てくるのですが、フォントファイルがアプリのターゲットメンバーであることを確認してください。チェックがされていないままFinishをしてしますと、フォントファイルがアプリの一部として配布されません。

Info.plistに記述する

Info.plistにFonts provided by applicationを追加して、その中のItemのvalueに今回追加したフォントファイルの名前を拡張子まで記述します。

ついにカスタムフォントを使用する準備が整いました！

UIKitで使用する

UIFont(name:, size:)のnameパラメーターに追加したフォントファイルのファイル名を渡すことでカスタムフォントを使用出来ます。

label.font = UIFont(name: "Caveat-Bold", size: 30)

アプリ内で頻繁に使用するカスタムフォントの場合は、extensionを作成すると便利ですね。

extension UIFont {

    static func boldCaveatFont(ofSize size: CGFloat) -> UIFont? {
        return UIFont(name: "Caveat-Bold", size: size)
    }
}

extensionで作成したメソッドを使用すると、このように毎回のフォント名の入力が無くなりました。

label.font = .boldCaveatFont(ofSize: 30)

結果

カスタムフォントが反映されました！

SwiftUIで使用する

ViewModifierのfontでカスタムフォントの宣言をする際に追加したフォントファイルのファイル名を渡すことで使用出来ます。

Text("How have you been?")
    .font(.custom("Caveat-Bold", size: 30))

SwiftUIでも頻繁に使用するカスタムフォントの場合は、extensionを作成すると便利ですね。

extension Font {

    static func boldCaveat(size: CGFloat) -> Font {
        return Font.custom("Caveat-Bold", size: size)
    }
}

extensionで作成したメソッドを使用する時はこのようになります。

Text("How have you been?")
    .font(.boldCaveat(size: 30))

おわりに

これでカスタムフォントを使えるようになりましたね。

10年後の自分へ、

元気にしていますか？

参考

Adding a Custom Font to Your App