第 53 章
如何在 iOS App 中嵌入照片選擇器

從iOS 16開始，SwiftUI引入了一個名為PhotosPicker的本地照片選取器視圖。如果你的App需要訪問使用者的照片庫，PhotosPicker視圖可以無縫地管理照片選擇過程。這個內建視圖提供了非凡的簡單性，讓開發人員只需幾行程式碼就可以呈現選取器並處理圖像選擇。

當呈現PhotosPicker視圖時，它會在你的應用界面之上以一個獨立的頁面形式展示照片相冊。在iOS的早期版本中，你無法自定義或更改照片選取器視圖的外觀，以符合你的應用程序佈局。然而，蘋果在iOS 17中對PhotosPicker視圖進行了增強，使開發人員可以將其無縫嵌入應用程序中。此外，你可以使用標準的SwiftUI修飾器（如.frame和.padding）來修改其大小和佈局。

在本教學中，我將向你展示如何使用改進的PhotosPicker視圖實現內嵌的照片選取器。

重温 PhotosPicker

要使用 PhotosPicker 視圖，你可以首先聲明一個狀態變量來存儲照片選擇，然後通過將綁定傳遞給該狀態變量來實例化一個 PhotosPicker 視圖。以下是一個示例：

import SwiftUI
import PhotosUI

struct ContentView: View {

    @State private var selectedItem: PhotosPickerItem?

    var body: some View {
        PhotosPicker(selection: $selectedItem,
                     matching: .images) {
            Label("Select a photo", systemImage: "photo")
        }
    }
}

matching 參數允許你指定要顯示的資源類型。在這裡，我們只選擇顯示圖像。在閉包中，我們使用 Label 視圖創建一個簡單的按鈕。

在選擇一張照片後，照片選取器會自動關閉，並將所選的照片項存儲在 selectedItem 變數中，該變數的類型是 PhotosPickerItem。要從項目中加載圖像，可以使用 loadTransferable(type:completionHandler:) 方法。你可以附加 onChange 修飾器來監聽 selectedItem 變數的更新。每當有變化時，你可以調用 loadTransferable 方法來加載資源數據，像這樣：

想更深入學習SwiftUI和下載完整程式碼？你可以從 AppCoda網站購買《精通 SwiftUI》完整電子版。