(作业)WKWebView实现简单的浏览器

又是一周一次的作业时间，我们直接看要求和最终的效果图吧

可以看出，最下面一块是一个网页，上面的第一行分别是回退按钮，前进按钮和刷新按钮，第二行是一个输入框和一个搜索按钮，这次作业要求不难，基本的功能框架里面已经有现成的方法了，所以我们只需要调用即可。那接下来开始实现部分。

首先，我们需要定义两个属性，一个WKWebView和一个UITextField(使用UIWebView也可以，不过WKWebView更加快捷、内存占用也比较少)
要使用WKWebView，我们需要在开头引入WebKit框架

import WebKit

然后声明两个属性

var webView: WKWebView!
var textField: UITextField!

到这里，我们还需要自己定义一个加载网页的方法，用于webView加载网页

func loadURL(path: String) {
    let url: URL?
    if path.hasPrefix("http://") {
        url = URL(string: path)
    } else {
        url = URL(string: "http://\(path)")
    }
    if url != nil {
        let request = URLRequest(url: url!)
        webView.load(request)
    }
}

我们在方法中，首先判断输入的网址是否含有”http://”字符串，如果没有，需要拼接上去，不然webView无法load该网址，因为使用的是http协议，苹果默认只支持https的协议，所以需要在info.plist文件中添加App Transport Security Settings下的Allow Arbitrary Loads字段，并且设置值为YES。
在拼接好字符串之后，使用该字符串生成URL和URLRequest，并使用WKWebView的load方法加载该request即可加载网页了。

到这里，准备工作就完成了，现在我们就开始往界面上添加我们的控件
首先设置根视图的背景颜色，然后获取屏幕的宽度和高度，并设置按钮的宽度和高度

self.view.backgroundColor = UIColor.white

let width = self.view.frame.width
let height = self.view.frame.height
let buttonHeight: CGFloat = 40
let buttonWidth: CGFloat = width / 5

然后我们开始初始化我们的webView，并默认加载百度网页

webView = WKWebView(frame: CGRect(x: 0, y: (buttonHeight + 10) * 2, width: width, height: height - (buttonHeight + 10) * 2))
self.view.addSubview(webView)
loadURL(path: "www.baidu.com")

接下来我们添加文本输入框，并设置默认的占位符为百度的网址

textField = UITextField(frame: CGRect(x: 10, y: buttonHeight + 20, width: width / 5 * 4, height: buttonHeight))
textField.placeholder = "www.baidu.com"
textField.layer.borderWidth = 1
textField.delegate = self
textField.returnKeyType = .done
self.view.addSubview(textField)

最后就是添加那几个按钮了

let goBtn = UIButton(frame: CGRect(x: buttonWidth * 4 + 10, y: buttonHeight + 20, width: buttonWidth - 10, height: buttonHeight))
goBtn.setTitle("GO", for: .normal)
goBtn.setTitleColor(UIColor.cyan, for: .normal)
goBtn.setTitleColor(UIColor.brown, for: .highlighted)
goBtn.addTarget(self, action: #selector(goWeb), for: .touchUpInside)
self.view.addSubview(goBtn)

let backBtn = UIButton(frame: CGRect(x: 10, y: 20, width: buttonWidth, height: buttonHeight))
backBtn.setTitle("<", for: .normal)
backBtn.setTitleColor(UIColor.cyan, for: .normal)
backBtn.setTitleColor(UIColor.brown, for: .highlighted)
backBtn.addTarget(self, action: #selector(backWeb), for: .touchUpInside)
self.view.addSubview(backBtn)

let forwardBtn = UIButton(frame: CGRect(x: 20 + buttonWidth, y: 20, width: buttonWidth, height: buttonHeight))
forwardBtn.setTitle(">", for: .normal)
forwardBtn.setTitleColor(UIColor.cyan, for: .normal)
forwardBtn.setTitleColor(UIColor.brown, for: .highlighted)
forwardBtn.addTarget(self, action: #selector(forwardWeb), for: .touchUpInside)
self.view.addSubview(forwardBtn)

let freshBtn = UIButton(frame: CGRect(x: 30 + buttonWidth * 2, y: 20, width: buttonWidth, height: buttonHeight))
freshBtn.setTitle("⟳", for: .normal)
freshBtn.setTitleColor(UIColor.cyan, for: .normal)
freshBtn.setTitleColor(UIColor.brown, for: .highlighted)
freshBtn.addTarget(self, action: #selector(freshWeb), for: .touchUpInside)
self.view.addSubview(freshBtn)

最后再实现按钮相应的功能即可

@objc func freshWeb() {
    webView.reload()
}

@objc func forwardWeb() {
    webView.goForward()
}

@objc func backWeb() {
    webView.goBack()
}

@objc func goWeb() {
    let path = textField.text ?? ""
    loadURL(path: path)
}

哦哦，，，博主还忘记一件事，还要实现点击键盘的done按钮之后关闭键盘呢！

func textFieldShouldReturn(_ textField: UITextField) -> Bool {
    textField.resignFirstResponder()
    return true
}

我们需要使ViewController遵循UITextFieldDelegate协议，并将textField的代理设置为self(ViewController)。这样就可以在点击done时回收键盘了。

所有的代码如下

import UIKit
import WebKit

class ViewController: UIViewController, UITextFieldDelegate {

    var webView: WKWebView!
    var textField: UITextField!

    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.

        self.view.backgroundColor = UIColor.white

        let width = self.view.frame.width
        let height = self.view.frame.height
        let buttonHeight: CGFloat = 40
        let buttonWidth: CGFloat = width / 5

        webView = WKWebView(frame: CGRect(x: 0, y: (buttonHeight + 10) * 2, width: width, height: height - (buttonHeight + 10) * 2))
        self.view.addSubview(webView)
        loadURL(path: "www.baidu.com")

        textField = UITextField(frame: CGRect(x: 10, y: buttonHeight + 20, width: width / 5 * 4, height: buttonHeight))
        textField.placeholder = "www.baidu.com"
        textField.layer.borderWidth = 1
        textField.delegate = self
        textField.returnKeyType = .done
        self.view.addSubview(textField)

        let goBtn = UIButton(frame: CGRect(x: buttonWidth * 4 + 10, y: buttonHeight + 20, width: buttonWidth - 10, height: buttonHeight))
        goBtn.setTitle("GO", for: .normal)
        goBtn.setTitleColor(UIColor.cyan, for: .normal)
        goBtn.setTitleColor(UIColor.brown, for: .highlighted)
        goBtn.addTarget(self, action: #selector(goWeb), for: .touchUpInside)
        self.view.addSubview(goBtn)

        let backBtn = UIButton(frame: CGRect(x: 10, y: 20, width: buttonWidth, height: buttonHeight))
        backBtn.setTitle("<", for: .normal)
        backBtn.setTitleColor(UIColor.cyan, for: .normal)
        backBtn.setTitleColor(UIColor.brown, for: .highlighted)
        backBtn.addTarget(self, action: #selector(backWeb), for: .touchUpInside)
        self.view.addSubview(backBtn)

        let forwardBtn = UIButton(frame: CGRect(x: 20 + buttonWidth, y: 20, width: buttonWidth, height: buttonHeight))
        forwardBtn.setTitle(">", for: .normal)
        forwardBtn.setTitleColor(UIColor.cyan, for: .normal)
        forwardBtn.setTitleColor(UIColor.brown, for: .highlighted)
        forwardBtn.addTarget(self, action: #selector(forwardWeb), for: .touchUpInside)
        self.view.addSubview(forwardBtn)

        let freshBtn = UIButton(frame: CGRect(x: 30 + buttonWidth * 2, y: 20, width: buttonWidth, height: buttonHeight))
        freshBtn.setTitle("⟳", for: .normal)
        freshBtn.setTitleColor(UIColor.cyan, for: .normal)
        freshBtn.setTitleColor(UIColor.brown, for: .highlighted)
        freshBtn.addTarget(self, action: #selector(freshWeb), for: .touchUpInside)
        self.view.addSubview(freshBtn)
    }

    func textFieldShouldReturn(_ textField: UITextField) -> Bool {
        textField.resignFirstResponder()
        return true
    }

    @objc func freshWeb() {
        webView.reload()
    }

    @objc func forwardWeb() {
        webView.goForward()
    }

    @objc func backWeb() {
        webView.goBack()
    }

    @objc func goWeb() {
        let path = textField.text ?? ""
        loadURL(path: path)
    }

    func loadURL(path: String) {
        let url: URL?
        if path.hasPrefix("http://") {
            url = URL(string: path)
        } else {
            url = URL(string: "http://\(path)")
        }
        if url != nil {
            let request = URLRequest(url: url!)
            webView.load(request)
        }
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }
}