高校物理158886 views
高校化学2917196 views
高校日本史190117 views
LaTeX959099 views
ヒストリア286805 views
数学講師2867555 views
中学理科1628254 views
世界の国562102 views
Computer366393 views
小学社会309124 views

SwiftUI Text のフォント設定

Text のフォントは .font() モディファイアで設定します。SwiftUI にはあらかじめ用意されたテキストスタイルがあり、Dynamic Type にも自動対応してくれます。

システムテキストスタイル

Apple が推奨するテキストスタイルを使うと、ユーザーの設定に応じてサイズが自動調整されます。

VStack(alignment: .leading, spacing: 12) {
    Text("Large Title").font(.largeTitle)
    Text("Title").font(.title)
    Text("Title 2").font(.title2)
    Text("Title 3").font(.title3)
    Text("Headline").font(.headline)
    Text("Body").font(.body)
    Text("Callout").font(.callout)
    Text("Subheadline").font(.subheadline)
    Text("Footnote").font(.footnote)
    Text("Caption").font(.caption)
    Text("Caption 2").font(.caption2)
}

システムフォントでサイズを指定

具体的なサイズを指定したい場合は .system(size:) を使います。

Text("カスタムサイズ")
    .font(.system(size: 24))

ウェイトやデザインも指定できます。

Text("太字で丸みのあるフォント")
    .font(.system(size: 20, weight: .bold, design: .rounded))

design には .default.rounded.serif.monospaced があります。

カスタムフォント

アプリにバンドルしたフォントを使う場合は .custom() を使います。

Text("カスタムフォント")
    .font(.custom("Helvetica Neue", size: 18))

テキストスタイルに合わせて相対的なサイズ調整をしたい場合は、relativeTo: を指定します。

Text("相対サイズ")
    .font(.custom("Helvetica Neue", size: 18, relativeTo: .body))

こうすると Dynamic Type の設定に応じてサイズがスケールします。