上一篇開始用Swift開發(fā)iOS 10 - 20 使用Tab Bar Controller 和 拆分Storyboard學(xué)習(xí)了工具欄和Storyboard的拆分，這一篇學(xué)習(xí)怎么在app中顯示網(wǎng)頁內(nèi)容。由于原書中使用了的網(wǎng)站在國內(nèi)不好訪問，我就用了我的簡書、博客、Github代替??。
設(shè)計(jì)about view
下載圖片拖進(jìn)
Assets.xcasset。打開
about.storyboard，拖進(jìn)一個(gè)Image View到table view header，height為190，image為about-logo，content mode為Aspect fit。選擇table view cell，identifier為Cell，style為Basic。新建
AboutTableViewController繼承至UITableViewController，關(guān)聯(lián)about中的table view controller。-
在
AboutTableViewController，添加：var sectionTitles = ["Leave Feedback", "Follow Us"] var sectionContent = [["Rate us on App Store", "Tell us your feedback"], ["Jianshu", "Blog", "Github"]] var links = ["http://m.itdecent.cn/u/efce1a2a95ab", "http://andyron.com", "https://github.com/andyRon"]
table view的相關(guān)代理協(xié)議方法實(shí)現(xiàn)，這次使用倆個(gè)section，tableView(_:titleForHeaderInSection:)是獲取section的title方法。
override func numberOfSections(in tableView: UITableView) -> Int {
return sectionTitles.count
}
override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
// #warning Incomplete implementation, return the number of rows
return sectionContent[section].count
}
override func tableView(_ tableView: UITableView, titleForHeaderInSection section: Int) -> String? {
return sectionTitles[section]
}
override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let cell = tableView.dequeueReusableCell(withIdentifier: "Cell", for: indexPath)
cell.textLabel?.text = sectionContent[indexPath.section][indexPath.row]
return cell
}
-
移除Tableview下面分割線，在
viewDidLoad中添加：tableView.tableFooterView = UIView(frame: CGRect.zero)
用Mobile Safari打開Web
可直接給出網(wǎng)址，通過Mobile Safari打開網(wǎng)站，UIApplication.shared.open(_:options:completionHandler:)。
override func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
switch indexPath.section {
case 0:
if indexPath.row == 0 {
if let url = URL(string: "http://www.apple.com/itunes/charts/paid-apps/") {
UIApplication.shared.open(url, options: [:], completionHandler: nil)
}
}
default:
break
}
// 取消被選中狀態(tài)
tableView.deselectRow(at: indexPath, animated: false)
}
使用WKWebView載入Web
使用使用WKWebView載入Web的例子
if let url = URL(string: "http://andyron.com") {
let request = URLRequest(url: url)
webView.load(request)
}
直接載入本地html文件的例子：
let url = URL(fileURLWithPath: "about.html")
let request = URLRequest(url: url)
webView.load(request)
- 在
about.storyboard中拖進(jìn)一個(gè)新的View Controller，用來展示W(wǎng)eb內(nèi)容。使用ctrl-drag建立Show類型的segue，identifier為showWebView。
- 新建
WebViewController繼承至UIViewController，關(guān)聯(lián)上面的用來顯示W(wǎng)eb內(nèi)容的View Controller。 - 在
WebViewController.swift中添加import WebKit，變量var webView: WKWebView!。 - 更新
viewDidLoad：
override func viewDidLoad() {
super.viewDidLoad()
if let url = URL(string: "http://andyron.com") {
let request = URLRequest(url: url)
webView.load(request)
}
}
- 添加
loadView，這個(gè)方法會(huì)在viewDidLoad之前調(diào)用創(chuàng)建WKWebView。
override func loadView() {
webView = WKWebView()
view = webView
}
- 更新
AboutTableViewController中的tableView(_didSelectRowAtIndexPath:)：
override func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
switch indexPath.section {
case 0:
if indexPath.row == 0 {
if let url = URL(string: "http://www.apple.com/itunes/charts/paid-apps/") {
UIApplication.shared.open(url, options: [:], completionHandler: nil)
}
} else if indexPath.row == 1 {
performSegue(withIdentifier: "showWebView", sender: self)
}
default:
break
}
// 取消被選中狀態(tài)
tableView.deselectRow(at: indexPath, animated: false)
}
- 由于自從iOS 9之后，出于安全考慮，默認(rèn)只能訪問HTTPS的網(wǎng)站，如果需要訪問HTTP的網(wǎng)站，就需要在
plist文件中添加許可：
使用SFSafariViewController載入Web
在AboutTableViewController.swift中加入import SafariServices，然后更新tableView(_didSelectRowAtIndexPath:)，只用通過url創(chuàng)建一個(gè)SFSafariViewController對(duì)象，然后使用present方法展示就可以了。
override func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
switch indexPath.section {
case 0:
if indexPath.row == 0 {
if let url = URL(string: "http://www.apple.com/itunes/charts/paid-apps/") {
UIApplication.shared.open(url, options: [:], completionHandler: nil)
}
} else if indexPath.row == 1 {
performSegue(withIdentifier: "showWebView", sender: self)
}
case 1:
if let url = URL(string: links[indexPath.row]) {
let safariController = SFSafariViewController(url: url)
present(safariController, animated: true, completion: nil)
}
default:
break
}
// 取消被選中狀態(tài)
tableView.deselectRow(at: indexPath, animated: false)
}
代碼
Beginning-iOS-Programming-with-Swift
說明
此文是學(xué)習(xí)appcode網(wǎng)站出的一本書 《Beginning iOS 10 Programming with Swift》 的一篇記錄
系列文章目錄
- 開始用Swift開發(fā)iOS 10 - 1 前言
- 開始用Swift開發(fā)iOS 10 - 2 Hello World！第一個(gè)Swift APP
- 開始用Swift開發(fā)iOS 10 - 3 介紹Auto Layout
- 開始用Swift開發(fā)iOS 10 - 4 用Stack View設(shè)計(jì)UI
- [開始用Swift開發(fā)iOS 10 - 5 原型的介紹]
- 開始用Swift開發(fā)iOS 10 - 6 創(chuàng)建簡單的Table Based App
- 開始用Swift開發(fā)iOS 10 - 7 定制Table Views
- 開始用Swift開發(fā)iOS 10 - 8 Table View和UIAlertController的交互
- 開始用Swift開發(fā)iOS 10 - 9 Table Row的刪除, UITableViewRowAction和UIActivityViewController的使用
- 開始用Swift開發(fā)iOS 10 - 10 Navigation Controller的介紹和Segue
- 開始用Swift開發(fā)iOS 10 - 11 面向?qū)ο缶幊探榻B
- 開始用Swift開發(fā)iOS 10 - 12 豐富Detail View和定制化Navigation Bar
- 開始用Swift開發(fā)iOS 10 - 13 Self Sizing Cells and Dynamic Type
- 開始用Swift開發(fā)iOS 10 - 14 基礎(chǔ)動(dòng)畫，模糊效果和Unwind Segue
- 開始用Swift開發(fā)iOS 10 - 15 使用地圖
- 開始用Swift開發(fā)iOS 10 - 16 介紹靜態(tài)Table Views，UIImagePickerController和NSLayoutConstraint
- 開始用Swift開發(fā)iOS 10 - 17 使用Core Data
