SwiftUIでアプリを作る際、画面に文字を表示するにはTextビューを使います。この記事では、Textのフォントサイズやフォントの太さ（font weight）の設定方法を、初心者向けにわかりやすく解説します。
Textの基本の使い方
フォントサイズの変更
フォントサイズを変えるには、.font()を使います
フォントサイズの変更
フォントサイズを変えるには、.font()を使います。
Text("大きな文字")
.font(.largeTitle)
例
フォントサイズの様々なサイズ
| 設定 | 説明 |
|---|---|
.largeTitle |
一番大きな見出し文字 |
.title |
見出し |
.title2 |
少し小さめの見出し |
.title3 |
さらに小さい見出し |
.headline |
強調された小見出し |
.subheadline |
小さなサブ見出し |
.body |
通常の本文 |
.callout |
補足的な内容 |
.footnote |
脚注などの小さい文字 |
.caption |
さらに小さな文字 |
.caption2 |
一番小さい文字 |
フォントの太さを変える（font weight）
Text("これはタイトル")
.font(.title)
Text("これは本文")
.font(.body)
例
フォントの太さを変える（font weight）
文字の太さを変えるには、.fontWeight()を使います。
Text("太い文字")
.fontWeight(.bold)
様々なフォントの太さの種類
| 設定 | 見た目の太さ |
|---|---|
.ultraLight |
とても細い |
.thin |
細い |
.light |
やや細い |
.regular |
標準 |
.medium |
少し太め |
.semibold |
やや太い |
.bold |
太い |
.heavy |
さらに太い |
.black |
一番太い |
例
Text("普通の文字")
.fontWeight(.regular)
Text("強調した文字")
.fontWeight(.semibold)
フォントサイズと太さを両方設定する
Text("大きくて太い文字")
.font(.title)
.fontWeight(.bold)
例
カスタムサイズを使いたいとき
もっと細かくサイズを調整したい！という場合は、.font(.system(size:))が便利です。
Text("カスタムサイズ")
.font(.system(size: 24)) // 24ポイントの文字
Text("カスタムサイズで太い文字")
.font(.system(size: 24, weight: .bold))
例
まとめ
| やりたいこと | コード例 |
|---|---|
| フォントサイズを変える | .font(.title) |
| フォントの太さを変える | .fontWeight(.semibold) |
| サイズと太さをカスタム | .font(.system(size: 20, weight: .bold)) |
おわりに
TextはSwiftUIの中でもよく使う要素なので、まずはこの基本をしっかり押さえておきましょう！
SwiftUIのTextの使い方：フォントサイズや太さの設定方法をまとめてみましたぜひ参考に！🙌