画面サイズに応じて、フォントサイズやレイアウトを変更するにはいくつか方法が考えられます。
その中で@Environmentを使用する方法を紹介します。
プログラム説明
以下のプログラムはフォントサイズの差が分かりやすいようにiPhoneの画面ではフォントサイズを0.1掛けとしています。実装する際は適切な値に変更してください。
import SwiftUI
struct FontSize: View {
//①Environmentを使用してhorizontalSizeClass、verticalSizeClassクラスから水平方向、垂直方向の情報を取得できるようにします。
@Environment(\.horizontalSizeClass) var horizontalSizeClass
@Environment(\.verticalSizeClass) var verticalSizeClass
let baseFontSize: CGFloat = 100.0
var body: some View {
Text("Hello, World!")
//③fontサイズに適用します。
.font(.system(size: fontSizeBasedOnScreen))
.padding()
}
//②取得した画面サイズに応じて、フォントサイズを変更する分岐を作成しています
var fontSizeBasedOnScreen: CGFloat {
if horizontalSizeClass == .compact && verticalSizeClass == .regular {
// iPhone Portrait (フォントサイズを0.1掛けにする)
return baseFontSize * 0.1
} else if horizontalSizeClass == .compact && verticalSizeClass == .compact {
// iPhone Landscape (フォントサイズを0.7掛けにする)
return baseFontSize * 0.7
} else if horizontalSizeClass == .regular && verticalSizeClass == .regular {
// iPad Portrait
return baseFontSize
} else if horizontalSizeClass == .regular && verticalSizeClass == .compact {
// iPhone Landscape (フォントサイズを1.2掛けにする)
return baseFontSize * 1.2
} else {
return baseFontSize
}
}
}
iPhone14でプレビュー

iPad10でプレビュー
horizontalSizeClass、verticalSizeClassについて
horizontalSizeClassには「.compact」、「.regular」といった情報を取得できます。これはおおまかな画面サイズでhorizontalSizeClassとverticalSizeClassの値の組み合わせでどのような画面が判別可能となっています。
| horizontalSizeClass | verticalSizeClass | 判別 |
|---|---|---|
| regular | regular | iPad |
| regular | compact | 横幅が広めのiPhone |
| compact | regular | iPhone縦 |
| compact | compact | iPhone横 |
詳細は以下のappleデベロッパーサイトのURLを参照してください。

レイアウト | Apple Developer Documentation
さまざまなコンテキストに適応する一貫したレイアウトを使用すると、アプリがより使いやすくなり、ユーザがお気に入りのアプリやゲームをどのデバイスでも楽しめるようになります。

