SwiftでWKWebViewを使って全面WebView画面を作る

SwiftでWKWebViewを使って全面WebView画面を作りました。

WKWebViewを使って全面WebView画面を作る

import UIKit
import WebKit

class WebViewController: UIViewController {
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
        view.backgroundColor = UIColor.white
        
        let webView = WKWebView()
        self.view.addSubview(webView)
        self.constrain(toEdges: webView) //WebViewを画面いっぱいに表示させる
        
        webView.load(URLRequest(url: URL(string: "https://blog.ch3cooh.jp/")!))
    }
}

特定のUIViewを画面全体に配置する

本記事のキモは、特定のUIViewを画面全体に貼り付ける処理です。

iOS 10.x以下で実行する場合には、safeAreaLayoutGuideが使えないので場合分けして記述する必要があります。

extension UIViewController {
    func constrain(toEdges subView: UIView) {

        subView.translatesAutoresizingMaskIntoConstraints = false

        if #available(iOS 11.0, *) {
            subView.topAnchor.constraint(equalTo: self.view.safeAreaLayoutGuide.topAnchor, constant: 0.0).isActive = true
            subView.bottomAnchor.constraint(equalTo: self.view.safeAreaLayoutGuide.bottomAnchor, constant: 0.0).isActive = true
            subView.leadingAnchor.constraint(equalTo: self.view.safeAreaLayoutGuide.leadingAnchor, constant: 0.0).isActive = true
            subView.trailingAnchor.constraint(equalTo: self.view.safeAreaLayoutGuide.trailingAnchor, constant: 0.0).isActive = true
        } else {
            subView.topAnchor.constraint(equalTo: self.view.topAnchor, constant: 0.0).isActive = true
            subView.bottomAnchor.constraint(equalTo: self.view.bottomAnchor, constant: 0.0).isActive = true
            subView.leadingAnchor.constraint(equalTo: self.view.leadingAnchor, constant: 0.0).isActive = true
            subView.trailingAnchor.constraint(equalTo: self.view.trailingAnchor, constant: 0.0).isActive = true
        }
    }
}