iT邦幫忙

第 11 屆 iT 邦幫忙鐵人賽

DAY 22
0

讓我們在 APP 中開啟 Safari 吧~

? 隕石小故事

之前在接案的時期有碰到過一個案子,只是一個單純內嵌 WebView 的 APP,我就問他有什麼需求,結果他說:「 可以幫我們加上,回上一頁、下一頁、重整、回首頁的功能,這樣就好」,聽到當下真的是想說:「哇靠,還有這種需求,那就在用網頁程式 Safari 或其他瀏覽器 APP 不就好了嗎?」。但是最後他們還是想要用一個 APP 包裝起來,我就用 WKWebView 幫他們把網頁包到其中。

而在隕石開發期間,我們還碰到了某些需求也是要透過 WebView 開啟某個特定網頁,但因為該網頁上有使用到 WebGL,導致我們當時雙平台使用 webView 開啟都碰到了障礙,但是我們使用 Safari 或是瀏覽器 APP 都能夠正常開啟,導致我們一個頭兩個大。

Overview

在 iOS 中我們有幾個開啟瀏覽器的方式,第一種是透過 open url 方式,讓我們跳出原有的 APP,透過 Safari 瀏覽器來開啟該網頁,而另一種就是蠻常會使用到的 WebView,而因為 UIWebView 好像再不久就會被棄用了,加上我跟他有深仇大恨,這邊就不提了,而後來的 WKWebView 無論是性能上或是和 JS 交互上我覺得都比之前的 UIWebView 好多了,是一種能夠在 APP 中瀏覽網頁的方式。

但是在 iOS9 中,導入了一個 SFSafariViewController,我們除了可以讓使用者在 APP 中開啟它,同時它也享有與 Safari 瀏覽器相同的功能,所以在某些時候 WebView 無法開啟的網頁,如果 Safari 能夠正常運作,我們通常也能透過 SFSafariViewController 來開啟它。(假如 Safari 也打不開那就只能 QQ 了)

自從有了 SFSafariViewController 再也沒有 APP 中打不開的網站了?!


實作

|使用 SFSafariViewController

首先我們必須 import SafariServices 框架才能使用,接著讓我們的 ViewController 遵循 SFSafariViewControllerDelegate 我們之後會需要使用到一些 delegate 的方法:

接著就讓我們來建立 SFSafariViewController 來使用:

這邊你也可以透過 preferredBarTintColorpreferredControlTintColor 來更改 SFSafariViewController 整體的顏色(這邊硬要改成一個暗黑模式 xDD)。

沒錯,就是如此簡單就能夠使用,最後讓我們看看效果吧:


Summary

那我們這次 SFSafariViewController 介紹跟教學就到這邊,藉由這次教學可以了解到如何使用 SFSafariViewController,並且實作起來也是相當容易,也有基本的上/下一頁,重整,而且還能再用 Safari 再開啟一次 XDDD。希望透過這次教學,大家也能夠在自己的 APP 中試著加入 SFSafariViewController 看看吧!


上一篇
D21 - 在 CollectionView 中加一個會滑起來的滑塊吧!
下一篇
D23 - 還敢 Loading 啊~TableView!
系列文
諸神黃昏下的 iOS 工程師31

尚未有邦友留言

立即登入留言