Swift|Web Viewを使ってウェブの内容を表示する

この記事ではWebKit Viewを使って、ウェブのコンテンツをブラウザのようにiOSアプリ上で表示する方法を紹介します。

Single View Appプロジェクトを開始します。
Main.storyboardを開き、右上のObject Libraryをクリックします。

“webkit view”を検索して、viewの上にドラッグします。

Text FieldとButtonを配置します。

“Command + Option + Enter”でCode Editorを開きます。
WebKit Viewをcontrolを押しながらクリックし、Code Editorに向かってドラッグします。

同じように、Text AreaをIBOutletで、ButtonをIBActionでドラッグします。

import WebKitしないとエラーが出ますので、importを忘れないようにしてください。
この時点でコードは以下のようになります。


import UIKit
import WebKit

class ViewController: UIViewController {
    @IBOutlet weak var webview: WKWebView!
    @IBOutlet weak var TextAddress: UITextField!
    
    
    @IBAction func WebNavigate(_ sender: Any) {
    }
    
    
    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view.
    }

}

次にViewController.swiftを開きます。

viewDidLoad()に以下のコードを追加します。


    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view.
        let starturl = URL(string: "https://blog.codebook-10000.com")!
        webview.load(URLRequest(url: starturl))
    }

シミュレーターを実行してみましょう。

シミュレーター実行時に”Could not instantiate class named WKWebView because no class named WKWebView was found”のようなエラーが出る場合は、プロジェクトにライブラリを追加します。

Terminating app due to uncaught exception ‘NSInvalidUnarchiveOperationException’, reason: ‘Could not instantiate class named WKWebView because no class named WKWebView was found; the class needs to be defined in source code or linked in from a library (ensure the class is part of the correct target)’

プロジェクト名 – General – Linked Frameworks and Librariesで「+」をクリック

WebKit.frameworkを追加します。

シミュレーターを実行すると、ブラウザのようにウェブの内容を読み込めていることがわかります。

次にユーザーの入力を受け付けてウェブページを開けるようにします。

@IBAction func WebNavigate(_ sender: Any) {}に以下のコードを追加します。


    @IBAction func WebNavigate(_ sender: Any) {
        
        let address: String = TextAddress.text!
        if address == "" {
            let alertController = UIAlertController(title: "Invalid Entry",
                                                    message: "Please enter a valid URL.", preferredStyle: .alert)
            let okAction = UIAlertAction(title: "OK", style: .default)
            alertController.addAction(okAction)
            self.present(alertController, animated: true, completion: nil)
            return
        } else {
            let userurl = URL(string: address)!
            webview.load(URLRequest(url: userurl))
        }
        
        for textField in self.view.subviews where textField is UITextField {
            textField.resignFirstResponder()
        }
    }

Text FieldにURLを入力してボタンを押すと以下のようにウェブを開くことができます。

ソースコード全体は以下です。


import UIKit
import WebKit

class ViewController: UIViewController {
    @IBOutlet weak var webview: WKWebView!
    @IBOutlet weak var TextAddress: UITextField!
    
    
    @IBAction func WebNavigate(_ sender: Any) {
        
        let address: String = TextAddress.text!
        if address == "" {
            let alertController = UIAlertController(title: "Invalid Entry",
                                                    message: "Please enter a valid URL.", preferredStyle: .alert)
            let okAction = UIAlertAction(title: "OK", style: .default)
            alertController.addAction(okAction)
            self.present(alertController, animated: true, completion: nil)
            return
        } else {
            let userurl = URL(string: address)!
            webview.load(URLRequest(url: userurl))
        }
        
        for textField in self.view.subviews where textField is UITextField {
            textField.resignFirstResponder()
        }
    }
    
    
    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view.
        let starturl = URL(string: "https://blog.codebook-10000.com")!
        webview.load(URLRequest(url: starturl))
    }

}


コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です