SwiftUI 點選打開連結的 Link 按鈕

點選按鈕打開連結幾乎是每個 App 都會看到的功能，比方打開網頁，地圖，App，電話等。在 iOS 14，SwiftUI 提供了方便的 Link 按鈕幫我們快速實現這樣的功能。

Apple Developer Documentation

點選文字打開網頁

Link("可不可以你也剛好喜歡我", destination: URL(string: "https://movies.yahoo.com.tw/movieinfo_main.html/id=10473")!)

點選後將打開 Safari App，看到 yahoo 的電影介紹頁面 。測試時記得要從模擬器或實機測試，無法從 preview 測試，因為 preview 無法打開 Safari App。

調整文字樣式

Link("可不可以你也剛好喜歡我", destination: URL(string: "https://movies.yahoo.com.tw/movieinfo_main.html/id=10473")!)
    .font(.largeTitle)
    .foregroundStyle(.purple)
    .rotationEffect(.degrees(45))

Link 的內容可以是任何 view

Link 不一定是文字，它可以顯示任何 view，例如以下包含圖文的 VStack。

Link(destination: URL(string: "https://movies.yahoo.com.tw/movieinfo_main.html/id=10473")!, label: {
    VStack {
         Text("可不可以你也剛好喜歡我")
         Image("movie")
             .resizable()
             .scaledToFit()
    }
})

點選文字打開地圖

當 URL 的網址開頭是 http://maps.apple.com 時，我們可以搭配參數 address 傳入地址，點選 Link 打開 Apple Map 顯示位址。

以下程式將打開彼得潘跟 Wendy 約會的地點華山。

Link("可不可以你也剛好喜歡我", destination: URL(string: "http://maps.apple.com/?address=臺北市中正區八德路一段1號")!)

關於 Apple Map 網址的相關參數，有興趣的朋友可參考以下連結。

Map Links

點選文字打電話

當網址開頭為 tel: 時，我們可在後面接電號號碼，點選後將播電話。

以下彼得潘鼓起勇氣輸入暗戀女生的電話 0932313520。

Link("可不可以你也剛好喜歡我", destination: URL(string: "tel:0932313520")!)

點選文字打開 App

• YouTube App

當網址開頭為 https://www.youtube.com/watch?v= 時，點選將打開 YouTube App。

Link("可不可以你也剛好喜歡我", destination: URL(string: "https://www.youtube.com/watch?v=oEslvAqAJME")!)

• LINE App

當網址開頭為 https://line.me/ 時，點選將打開 LINE App。

以下網址將打開 LINE App 的熱門貼圖畫面。

Link("LINE 熱門貼圖", destination: URL(string: "https://line.me/R/shop/sticker/hot")!)

關於 LINE 網址的相關細節，有興趣的朋友可參考以下連結。

Using LINE features with the LINE URL scheme