SwiftUI Text 與 Label 教學

Text 是 SwiftUI 中最基礎也最常用的元件，用於在畫面上顯示一行或多行唯讀文字。雖然它看起來簡單，但透過 Modifier，你可以將它變得很華麗。

基礎用法

最簡單的用法就是直接傳入一個字串：

Text("Hello, SwiftUI!")

常用的文字修飾符 (Text Modifiers)

你可以透過鏈式調用來改變文字的樣式：

Text("設計你的文字")
    .font(.title)           // 設定字型大小 (使用動態字體標準)
    .fontWeight(.bold)      // 設定字重 (粗體)
    .foregroundColor(.blue) // 設定顏色
    .italic()               // 斜體
    .underline()            // 底線
    .strikethrough()        // 刪除線

字型與大小 (Font)

SwiftUI 推薦使用動態字體 (Dynamic Type) 樣式，例如 .largeTitle, .title, .headline, .body, .caption 等。這樣做的好處是，當使用者在 iOS 系統設定中調整字體大小時，你的 App 也會自動跟著縮放，符合無障礙設計 (Accessibility) 的要求。

如果你必須使用固定大小或自定義字體：

Text("固定大小文字")
    .font(.system(size: 24)) // 系統字體，大小 24

Text("自定義字體")
    .font(.custom("HelveticaNeue", size: 20)) // 指定字體名稱

多行文字與截斷

預設情況下，Text 會盡量顯示所有內容。如果空間不足，它會自動換行。你可以控制這些行為：

Text("這是一段非常非常長的文字，可能會佔用很多行空間。")
    .lineLimit(2)           // 限制最多顯示 2 行
    .multilineTextAlignment(.center) // 多行對齊方式 (置中)
    .truncationMode(.tail)  // 截斷模式 (省略號在尾端: ...xyz)

Markdown 支援 (iOS 15+)

SwiftUI 的 Text 直接支援部分的 Markdown 語法！這讓你可以輕鬆地在一段文字中混合樣式，而不需要拆成多個 Text。

Text("這是一段 **粗體** 和 *斜體* 的文字，還可以加上 [連結](https://www.fooish.com)。")

這樣寫，"粗體" 會自動變粗，"斜體" 會變斜，"連結" 則會變成可點擊的藍色文字。

Label (標籤)

Label 是一個結合了「圖示 (Icon)」與「文字 (Text)」的元件，非常常用於列表 (List) 或選單 (Menu) 中。

Label("設定", systemImage: "gear")

這段程式碼會顯示一個齒輪圖示旁邊跟著 "設定" 兩個字。systemImage 使用的是 Apple 的 SF Symbols 圖示庫。

自定義 Label 樣式

你可以透過 .labelStyle 修改圖示與文字的相對位置：

Label("喜歡", systemImage: "heart.fill")
    .labelStyle(.iconOnly)  // 只顯示圖示
    .labelStyle(.titleOnly) // 只顯示文字
    // 預設是 .titleAndIcon (兩者都顯示)

掌握了 Text 和 Label，你已經可以處理 App 中大部分的資訊顯示需求了。接下來，我們看看如何處理圖片。