让不懂编程的人爱上iPhone开发(2018秋iOS12+Swift4.2+Xcode10版)-15
使用web view替代 text view
关于界面的内容还可以继续优化。
现在我们可以尝试用web view（网页视图）来替代text view（文本视图）。
在Xcode中切换到Main.storyboard，然后选中关于界面中的文本视图，用delete键删掉它。然后拖一个WebKit view到刚才的位置，并让它占据刚才Text view所填充的空间。需要注意的是，之前的版本我们用的是Web View，但它即将被淘汰，因此现在通常用WebKit View。
WebKit view（网页视图）顾名思义，可以用来显示网页。我们要做的就是给它一个到某个具体网站的URL网址。WebKit View对象的名称是WKWebView。当然，这里我们会先让它来显示一个准备好的HTML页面。这样就无需联机下载才能看到内容。
在Xcode左侧的Project Navigator（项目导航）点击项目名称，然后选中Add Files，把我们准备好的BullsEye.html文件添加到项目中。这是一个HTML5文档，当然你也完全可以创建自己的HTML5文档添加进去。
从文件选择器中选择BullsEye.html，这是一个包含了游戏说明的HTML5文件。
记得一定要选中Copy items if needed，以及Add to targets那边要勾选BullsEye。
点击Add就把它添加进去了。
最后在Xcode中切换到AboutViewController.swift，为webkit view添加一个outlet变量。
class AboutViewController: UIViewController {
@IBOutlet weak var webView: WKWebView!
…
}
}
此时你很快会看到Xcode的红色错误提示，
这是什么意思？
Xcode用这种方式告诉你，它根本不认识这个什么WKWebView，但是我们明明是从Xcde的对象库里面拖出来的好不？
那问题出在哪里呢？
如果仔细看代码，会发现最顶部有这么一行代码：
import UIKit
这行代码的意思是我们希望使用包含在UIKit框架里的对象，UIKit提供了iOS开发所需要的几乎所有UI组件。
然后UIKit不包含WKWebView，为什么？在此前的版本中，我们使用的是WebView，它包含在UIKit中。然而最新的WKWebView则包含在另一个名为WebKit的框架中。
所以，我们需要在AboutViewController.swift的顶部再添加一行代码：
import WebKit
这样一来，一切恢复正常了~
在storyboard文件中将UIWebView视觉元素和这个新的outlet变量之间创建关联。最简单的方式当然是按住Ctrl键，从About View Controller拖一条线到Web View。
如果你反过来拖线的话会很失望的，不信试试看~
接下来回到AboutViewController.swift，添加viewDidLoad()方法：
override func viewDidLoad() {
super.viewDidLoad()
//添加网页视图
if let url = Bundle.main.url(forResource: "BullsEye", withExtension: "html"){
let request = URLRequest(url: url)
webView.load(request)
}
}
这一堆代码看起来又很恐怖，不过还是那句话，别恐慌。Don’t panic!
我们先大概解释下它的作用。它的主要作用是把本地的HTML文件加载到网页视图控件中。首先我们在应用束中找到BullsEye.html文件，然后我们把它加载到一个request对象中，最后我们让网页视图显示request对象中的具体内容。
点击运行游戏，然后触碰(i)按钮，就会看到类似下面的界面。
看到这里，我们对刚才的这段代码应该有了更深的理解。
首先，我们创建了一个url对象，让它保存BullsEye.html在文件系统中的路径。
紧接着，我们创建了一个request对象。
最后，我们让网页视图加载具体的网页内容。
好了，假如我们这里不想用固定的网页，而是想直接显示自己的个人网站内容怎么办？很简单，用下面的这段代码代替就好：
override func viewDidLoad() {
super.viewDidLoad()
//添加网页视图
// if let url = Bundle.main.url(forResource: "BullsEye", withExtension: "html"){
// let request = URLRequest(url: url)
// webView.load(request)
// }
//使用真实世界的网页
if let url = URL.init(string: "http://www.apple.com"){
let request = URLRequest(url: url)
webView.load(request)
}
// Do any additional setup after loading the view.
}
我们注释了之前使用本地文件加载网页视图的代码，而使用真实的网址来替代。你可以试着使用Option键来查看帮助文档，来仔细研究下这段代码的具体含义。如果看不懂也没关系。
点击Run看看效果：
好了，该休息一下了~
本人联系方式：
微信：iseedo
邮件： ofollow,noindex" target="_blank">[email protected]
QQ讨论群： 375143733
示例项目： https:// github.com/eseedo/iOSCo urse
如有疑问，请先发送邮件到我的邮箱： [email protected]
我会在收到邮件后尽早答复。
也可以加微信，但可能不是很合适的答疑途径。
另外，为了节省大家的宝贵时间，提高沟通效率，请在提问的时候尽量附上 项目源代码以及以下信息 ：
1.开发环境（系统版本，Xcode和iOS版本）
2.问题描述及重现（想实现什么效果，结果是怎样的，具体涉及到什么操作）
3.为解决问题所做的努力（做了哪些尝试，分别是怎样的结果）
4.具体对应的是哪一课的内容
