読み込み中...

Swiftでのフォントサイズ指定のたった10選

Swift言語のロゴとテキストサイズ変更のイラスト Swift
この記事は約21分で読めます。

【サイト内のコードはご自由に個人利用・商用利用いただけます】

この記事では、プログラムの基礎知識を前提に話を進めています。

説明のためのコードや、サンプルコードもありますので、もちろん初心者でも理解できるように表現してあります。

本記事のサンプルコードを活用して機能追加、目的を達成できるように作ってありますので、是非ご活用ください。

※この記事は、一般的にプロフェッショナルの指標とされる『実務経験10,000時間以上』を満たす現役のプログラマチームによって監修されています。

※Japanシーモアは、常に解説内容のわかりやすさや記事の品質に注力しております。不具合、分かりにくい説明や不適切な表現、動かないコードなど気になることがございましたら、記事の品質向上の為にお問い合わせフォームにてご共有いただけますと幸いです。
(送信された情報は、プライバシーポリシーのもと、厳正に取扱い、処分させていただきます。)

はじめに

この記事を読めば、Swiftでのフォントサイズ指定がマスターできるようになります。

文字の大きさはアプリのユーザビリティやデザインに大きな影響を与えます。

Swiftを使用してアプリ開発をしている方、またはこれから学びたいと考えている初心者の方も、この記事を通してフォントサイズの指定方法やその応用技術を習得できるでしょう。

具体的なコードと共に、初心者でもわかりやすく解説していきます。

●Swiftとは

Swiftは、Appleが2014年に公開したプログラミング言語です。

iOS、macOS、watchOS、tvOSなどのAppleプラットフォーム向けのアプリケーション開発に使用されます。

Objective-Cに代わって、よりシンプルで強力な言語として誕生しました。

○Swiftの特徴と魅力

Swiftは、読みやすく、書きやすいことを重視したデザインがされています。

ここでは、Swiftの主な特徴を挙げてみます。

  1. モダンで安全:Swiftは現代のプログラミング言語の良さを取り入れながら、安全性を最優先に設計されています。例えば、初期化されていない変数やnull参照によるランタイムエラーを防ぐ機能が備わっています。
  2. 高速:SwiftはC言語やObjective-Cと比較しても高速に動作します。最適化されたコンパイラによって、効率的なコードが生成されます。
  3. 簡潔で明確:Swiftは、冗長なコードを減少させるための多くの構文を持っています。これにより、コードが読みやすく、メンテナンスも容易になります。
  4. 相互運用性:SwiftはObjective-Cとの相互運用性があり、既存のObjective-Cのライブラリやフレームワークをそのまま利用することができます。

●フォントサイズ指定の基本

Swiftを使用してアプリを開発する際、テキストのフォントサイズの調整は非常に重要です。

ユーザの視認性を確保するため、適切なフォントサイズの設定が求められます。

ここでは、Swiftでのフォントサイズ指定の基本について詳しく解説します。

○Swiftでのテキストの扱い

Swiftにおけるテキストは、主にUILabelやUITextViewといったクラスを使って表示されます。

これらのクラスはUIKitフレームワークに含まれており、テキストの表示や編集を担当します。

  • UILabel:テキストを表示するためのラベル。編集はできません。
  • UITextView:テキストを表示し、編集も可能なテキストビュー。

これらのクラスには、テキストのスタイルや属性を設定するためのプロパティが多数用意されており、その中で「font」というプロパティを使用してフォントサイズを指定することができます。

○フォントサイズの指定方法

Swiftでフォントサイズを指定するには、上述の「font」プロパティを利用します。

このプロパティにはUIFontのインスタンスをセットして、フォントの種類やサイズを設定することができます。

例として、UILabelのフォントサイズを20ptに設定する場合のコードを紹介します。

このコードではUIFontクラスを使ってフォントサイズを20ptにしています。

let label = UILabel()
label.text = "Swiftでのフォントサイズ指定"
label.font = UIFont.systemFont(ofSize: 20)

このコードを実行すると、表示される「Swiftでのフォントサイズ指定」というテキストのサイズが20ptになります。

また、特定のフォントを使用したい場合は、次のようにフォントの名前も指定できます。

この例では「Arial」のフォントを使用しています。

label.font = UIFont(name: "Arial", size: 20)

●フォントサイズの使い方

Swiftを利用してアプリケーションを開発する際、文字のフォントサイズの指定は非常に一般的な操作です。

適切なフォントサイズを設定することで、アプリのユーザビリティや視認性が向上します。

ここでは、Swiftでのフォントサイズの指定方法をいくつかのサンプルコードと共に詳しく紹介します。

○サンプルコード1:UILabelのフォントサイズを指定

UILabelはiOSアプリケーションでテキストを表示する基本的なコンポーネントです。

下記のコードは、UILabelのフォントサイズを24ptに指定する方法を表しています。

let myLabel = UILabel(frame: CGRect(x: 0, y: 0, width: 200, height: 50))
myLabel.text = "こんにちは、Swift!"
myLabel.font = UIFont.systemFont(ofSize: 24)

このコードではUIFont.systemFont(ofSize:)を使って、システムフォントのサイズを24ptに指定しています。

○サンプルコード2:UITextViewのフォントサイズを指定

UITextViewは編集可能なテキストを表示するコンポーネントです。

下記のコードは、UITextViewのフォントサイズを18ptに指定する方法を表しています。

let myTextView = UITextView(frame: CGRect(x: 0, y: 0, width: 300, height: 150))
myTextView.text = "これはUITextViewのサンプルテキストです。"
myTextView.font = UIFont.systemFont(ofSize: 18)

このコードでは、同様にUIFont.systemFont(ofSize:)を使用して、フォントサイズを18ptに指定しています。

実行すると、指定したテキストが18ptのサイズでUITextViewに表示されます。

○サンプルコード3:UIButtonのテキストフォントサイズを指定

UIButtonはiOSアプリでのボタンの生成や管理を担当する基本コンポーネントです。

ユーザーアクションを取得するための主要な要素として、その視認性やデザインは非常に重要です。

下記のコードは、UIButtonのテキストのフォントサイズを20ptに設定する方法を表しています。

let myButton = UIButton(type: .system)
myButton.frame = CGRect(x: 50, y: 50, width: 200, height: 50)
myButton.setTitle("ボタン", for: .normal)
myButton.titleLabel?.font = UIFont.systemFont(ofSize: 20)

このコードではsetTitle(_:for:)メソッドを利用してボタンのテキストを”ボタン”としています。

そして、titleLabel?.fontを使い、フォントサイズを20ptに指定しています。

このようにして指定したフォントサイズでボタンが表示されます。

○サンプルコード4:SwiftUIでのフォントサイズ指定

SwiftUIはAppleが提供する新しいUIフレームワークで、デクララティブな構文を用いてUIを作成できます。

SwiftUIを使用してフォントサイズを指定する方法は、UIKitとは異なります。

下記のコードは、SwiftUIでのText要素のフォントサイズを指定する例を表しています。

import SwiftUI

struct ContentView: View {
    var body: some View {
        Text("こんにちは、SwiftUI!")
            .font(.system(size: 25))
    }
}

このコードでは、SwiftUIのTextコンポーネントを使って文字列を表示しています。

.font(_:)モディファイアを使用して、フォントサイズを25ptに指定しています。

SwiftUIでは、このようにモディファイアをチェーンさせることで、様々なスタイルや属性を簡単に適用することができます。

●フォントサイズの応用例

Swiftでテキストのフォントサイズを指定するだけでなく、さまざまな応用的な使い方をすることも可能です。この章では、そのような高度な使い方をいくつかのサンプルコードを交えて詳しく説明します。

○サンプルコード5:動的にフォントサイズを変更する方法
特定の条件やユーザーのアクションに応じて、動的にフォントサイズを変更したい場合もあるでしょう。以下のコードは、スライダーの値に応じてUILabelのフォントサイズを動的に変更する例です。

import UIKit

class ViewController: UIViewController {
    let label = UILabel()
    let slider = UISlider()

    override func viewDidLoad() {
        super.viewDidLoad()

        label.text = "動的にサイズを変更"
        label.frame = CGRect(x: 20, y: 20, width: 280, height: 40)
        view.addSubview(label)

        slider.frame = CGRect(x: 20, y: 70, width: 280, height: 40)
        slider.addTarget(self, action: #selector(sliderValueChanged), for: .valueChanged)
        view.addSubview(slider)
    }

    @objc func sliderValueChanged() {
        let size = CGFloat(slider.value) * 30
        label.font = UIFont.systemFont(ofSize: size)
    }
}

このコードでは、スライダーの値に基づいてsliderValueChangedメソッドをトリガーしており、その中でUILabelのフォントサイズを変更しています。

○サンプルコード6:ユーザーの設定に基づいてフォントサイズを変更
ユーザーの視認性のニーズに応じて、システムの設定を利用してフォントサイズを調整することも考えられます。以下のコードは、ユーザーがiOSの「文字サイズを大きく」の設定を変更した場合、それに合わせてフォントサイズを調整する例を示しています。

import UIKit

class DynamicFontViewController: UIViewController {
    let label = UILabel()

    override func viewDidLoad() {
        super.viewDidLoad()

        label.text = "システム設定に合わせてサイズ変更"
        label.frame = CGRect(x: 20, y: 20, width: 280, height: 40)
        label.font = UIFont.preferredFont(forTextStyle: .body)
        label.adjustsFontForContentSizeCategory = true
        view.addSubview(label)
    }

    override func traitCollectionDidChange(_ previousTraitCollection: UITraitCollection?) {
        super.traitCollectionDidChange(previousTraitCollection)
        if traitCollection.hasDifferentColorAppearance(comparedTo: previousTraitCollection) {
            label.font = UIFont.preferredFont(forTextStyle: .body)
        }
    }
}

このコードは、システムの文字サイズ設定に応じてUILabelのフォントサイズを自動的に調整しています。

○サンプルコード7:異なるデバイスでのフォントサイズ調整
異なるデバイスや画面サイズでの表示を考慮して、適切なフォントサイズに調整することも大切です。以下のコードは、デバイスの画面サイズに応じてフォントサイズを変更する方法を示しています。

import UIKit

class ViewController: UIViewController {
    let label = UILabel()

    override func viewDidLoad() {
        super.viewDidLoad()

        label.text = "デバイスに応じたサイズ調整"
        label.frame = CGRect(x: 20, y: 20, width: 280, height: 40)

        let screenSize = UIScreen.main.bounds.size
        if screenSize.height < 570 {
            label.font = UIFont.systemFont(ofSize: 14)
        } else if screenSize.height < 680 {
            label.font = UIFont.systemFont(ofSize: 16)
        } else {
            label.font = UIFont.systemFont(ofSize: 18)
        }

        view.addSubview(label)
    }
}

このコードを実行すると、デバイスの画面サイズに基づいてUILabelのフォントサイズが変更されます。

●フォントサイズの応用例

Swiftでテキストのフォントサイズを指定するだけでなく、さまざまな応用的な使い方をすることも可能です。

ここでは、そのような高度な使い方をいくつかのサンプルコードを交えて詳しく説明します。

○サンプルコード5:動的にフォントサイズを変更する方法

特定の条件やユーザーのアクションに応じて、動的にフォントサイズを変更したい場合もあるでしょう。

下記のコードは、スライダーの値に応じてUILabelのフォントサイズを動的に変更する例です。

import UIKit

class ViewController: UIViewController {
    let label = UILabel()
    let slider = UISlider()

    override func viewDidLoad() {
        super.viewDidLoad()

        label.text = "動的にサイズを変更"
        label.frame = CGRect(x: 20, y: 20, width: 280, height: 40)
        view.addSubview(label)

        slider.frame = CGRect(x: 20, y: 70, width: 280, height: 40)
        slider.addTarget(self, action: #selector(sliderValueChanged), for: .valueChanged)
        view.addSubview(slider)
    }

    @objc func sliderValueChanged() {
        let size = CGFloat(slider.value) * 30
        label.font = UIFont.systemFont(ofSize: size)
    }
}

このコードでは、スライダーの値に基づいてsliderValueChangedメソッドをトリガーしており、その中でUILabelのフォントサイズを変更しています。

○サンプルコード6:ユーザーの設定に基づいてフォントサイズを変更

ユーザーの視認性のニーズに応じて、システムの設定を利用してフォントサイズを調整することも考えられます。

下記のコードは、ユーザーがiOSの「文字サイズを大きく」の設定を変更した場合、それに合わせてフォントサイズを調整する例を表しています。

import UIKit

class DynamicFontViewController: UIViewController {
    let label = UILabel()

    override func viewDidLoad() {
        super.viewDidLoad()

        label.text = "システム設定に合わせてサイズ変更"
        label.frame = CGRect(x: 20, y: 20, width: 280, height: 40)
        label.font = UIFont.preferredFont(forTextStyle: .body)
        label.adjustsFontForContentSizeCategory = true
        view.addSubview(label)
    }

    override func traitCollectionDidChange(_ previousTraitCollection: UITraitCollection?) {
        super.traitCollectionDidChange(previousTraitCollection)
        if traitCollection.hasDifferentColorAppearance(comparedTo: previousTraitCollection) {
            label.font = UIFont.preferredFont(forTextStyle: .body)
        }
    }
}

このコードは、システムの文字サイズ設定に応じてUILabelのフォントサイズを自動的に調整しています。

○サンプルコード7:異なるデバイスでのフォントサイズ調整

異なるデバイスや画面サイズでの表示を考慮して、適切なフォントサイズに調整することも大切です。

下記のコードは、デバイスの画面サイズに応じてフォントサイズを変更する方法を表しています。

import UIKit

class ViewController: UIViewController {
    let label = UILabel()

    override func viewDidLoad() {
        super.viewDidLoad()

        label.text = "デバイスに応じたサイズ調整"
        label.frame = CGRect(x: 20, y: 20, width: 280, height: 40)

        let screenSize = UIScreen.main.bounds.size
        if screenSize.height < 570 {
            label.font = UIFont.systemFont(ofSize: 14)
        } else if screenSize.height < 680 {
            label.font = UIFont.systemFont(ofSize: 16)
        } else {
            label.font = UIFont.systemFont(ofSize: 18)
        }

        view.addSubview(label)
    }
}

このコードを実行すると、デバイスの画面サイズに基づいてUILabelのフォントサイズが変更されます。

●注意点と対処法

Swiftでフォントサイズを指定する際には、いくつかの注意点と対処法を知っておくことが重要です。

ここでは、フォントサイズの選び方や特定のフォントが使用できない時の対処法について詳しく解説します。

○フォントサイズの選び方と見やすさ

テキストのフォントサイズは、読者の視認性に直接関わる要素です。

そのため、適切なサイズを選択することが必要です。

アプリケーションのユーザビリティを損なうことなく、情報を伝えるためには次の点に注意が必要です。

  1. コンテンツの重要度に合わせて調整:主要な見出しやキーポイントは、やや大きめのフォントサイズで表示すると、読者の注目を引きやすくなります。
  2. バランスを意識する:テキスト全体のバランスを取るため、極端に大きいサイズや小さいサイズを避けることが推奨されます。
  3. 背景色とのコントラスト:テキストの色と背景色とのコントラストが低い場合、大きなフォントサイズでも読みにくくなる可能性があります。

○特定のフォントが使用できない時の対処法

特定のフォントを使用したい場合、そのフォントがデバイスやOSにインストールされていない場合があります。

その際の対処法として次の方法が考えられます。

  1. システムフォントを利用:システムフォントは、ほとんどのデバイスやOSでサポートされています。そのため、特定のフォントが利用できない場合は、システムフォントをデフォルトとして設定することが一般的です。
let label = UILabel()
label.text = "これはシステムフォントです"
label.font = UIFont.systemFont(ofSize: 16)

このコードを実行すると、ラベルにシステムのデフォルトフォントが適用されます。

  1. カスタムフォントの組み込み:アプリケーションに直接カスタムフォントを組み込むことで、任意のフォントを使用することが可能になります。ただし、フォントのライセンスに注意が必要です。
let customFont = UIFont(name: "カスタムフォント名", size: 16)
label.font = customFont ?? UIFont.systemFont(ofSize: 16)

このコードでは、カスタムフォントを設定しようとしますが、もし利用できない場合はシステムフォントにフォールバックします。

  1. フォントのライセンスを確認:商用利用を前提とする場合やアプリケーションを公開する際には、使用するフォントのライセンスを確認してください。

Swiftでのフォントサイズ指定やフォント選択には注意が必要ですが、上記の方法を参考にして、アプリケーションのユーザビリティやデザインを向上させることができます。

●カスタマイズ方法

Swiftでのフォントサイズ指定には様々なカスタマイズ方法が存在します。

特定のデザインやユーザビリティの要求に応じて、これらのカスタマイズ方法を駆使することで、アプリケーションの見た目や機能性を向上させることが可能です。

○サンプルコード8:カスタムフォントを使用してフォントサイズ指定

カスタムフォントを使うことで、アプリケーションのブランディングやデザインを強化することができます。

下記の方法で、カスタムフォントを使用してフォントサイズを指定することができます。

let customFont = UIFont(name: "YourCustomFontName", size: 18) ?? UIFont.systemFont(ofSize: 18)
let label = UILabel()
label.font = customFont
label.text = "カスタムフォントを使用したテキスト"

このコードでは、”YourCustomFontName”という名前のカスタムフォントをサイズ18で指定しています。

もしカスタムフォントが読み込めない場合は、システムフォントがデフォルトとして使用されます。

○サンプルコード9:テキストのスタイルを組み合わせてフォントサイズ指定

Swiftでは、テキストのスタイルを組み合わせて、より洗練されたデザインを作成することも可能です。

let attributedString = NSMutableAttributedString(string: "スタイルを組み合わせたテキスト")
attributedString.addAttribute(.font, value: UIFont.boldSystemFont(ofSize: 20), range: NSRange(location: 0, length: 5))
attributedString.addAttribute(.font, value: UIFont.systemFont(ofSize: 16), range: NSRange(location: 6, length: 6))

let label = UILabel()
label.attributedText = attributedString

このコードでは、文字列の一部に異なるフォントサイズを適用しています。

最初の5文字にはサイズ20の太字、次の6文字にはサイズ16の通常文字として表示されます。

○サンプルコード10:アニメーションを使ったフォントサイズの変更

ユーザーの注目を引くために、テキストのフォントサイズをアニメーションで変更することもできます。

let label = UILabel()
label.text = "アニメーションでサイズ変更"
label.font = UIFont.systemFont(ofSize: 16)

UIView.animate(withDuration: 1.0) {
    label.font = UIFont.systemFont(ofSize: 24)
}

上記のコードを実行すると、ラベルのフォントサイズが1秒かけて16から24に変わります。

これにより、特定の情報を強調するなどの演出が可能になります。

まとめ

Swiftにおけるフォントサイズの指定やカスタマイズは、アプリケーションのデザインやユーザビリティを大きく左右する要素の一つです。

この記事を通じて、初心者から経験者まで、さまざまなレベルの開発者がフォントサイズの指定の基本から、カスタマイズの方法までを理解することができたことを願います。

具体的なサンプルコードとその詳細な説明を交えて、Swiftでのフォントサイズの指定方法やカスタマイズ方法を解説しました。

カスタムフォントの使用や、テキストのスタイルを組み合わせる方法、さらにはアニメーションを取り入れてフォントサイズを変更する方法など、多岐にわたるテクニックを取り上げました。

デザインやブランディングを強化するためのカスタムフォントの活用、特定の情報を強調するためのテキストスタイルの組み合わせ、ユーザーの注目を引くアニメーションなど、Swiftでのフォントサイズの指定やカスタマイズに関する知識は非常に幅広いです。

アプリケーションの見た目や操作性を向上させるためには、これらのテクニックを適切に活用することが必要です。

今後のアプリ開発において、この記事が皆さんの参考となることを心より願っています。