【ios】Swiftでwebkitを使用してフリックで進む・戻るに対応してみる

基本業務の合間にちょこちょこと触り続けているswift。
前回から大した進歩ではありませんが、

フリックで進む・戻るを実装してみたいと思います。

WebKitが良さげなのでそっちに移行

詳しい理由はわかりませんが、なんか良いらしいぞ!って事でWebKitを入れてみました。
フレームワークの実装方法はとても簡単。

【ios】Swiftでwebkitを使用してフリックで進む・戻るに対応してみる
Generalの下の方にLinked Frameworks and Librariesとありますので

「+」をクリックして、WebKitを選択、

あとは

import Webkit

でimportしてあげるだけです。

ステータスバーを隠そう

import UIKit
import WebKit

class ViewController: UIViewController, WKNavigationDelegate, WKUIDelegate {

var webView: WKWebView!

override func viewDidLoad() {
super.viewDidLoad()
webView = WKWebView(frame: self.view.bounds)
webView.navigationDelegate = self
webView.UIDelegate = self
self.view.addSubview(webView)
webView.allowsBackForwardNavigationGestures = true

}

override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
}

override func viewWillAppear(animated: Bool) {
super.viewWillAppear(animated)

let url = NSURL(string: "https://awe-some.net")
let request = NSURLRequest(URL: url!)
webView.loadRequest(request)
}
override func prefersStatusBarHidden() -> Bool {
return true
}
}

今回はこんな感じのコードで実装しました。

webView.allowsBackForwardNavigationGestures = true

の部分でフリックで戻る、進むの動作を実装する事ができます。
めっちゃ楽チンですね。
UIWebViewでしようとおもったら割と面倒だったのに。
そしてこのままビルドするとこんな感じに。

【ios】Swiftでwebkitを使用してフリックで進む・戻るに対応してみる

前回同様ステータスバーの下にViewが入り込んでいる形になります。
かぶっちゃうんですね。
改善方法としては

  • TOPにマージンを持たせる
  • ステータスバーを消しちゃう

のどちらかが考えられますが今回は消しちゃいます。

その消しちゃうコードがこちら

override func prefersStatusBarHidden() -> Bool {
return true
}

背景が黒すぎてわかりにくいですが、

しっかりとステータスバーが消えています。
これで、とりあえずはしたいことは実装できました。
次は何しようかなー。

PR

Instagram Feed

Load More
Something is wrong. Response takes too long or there is JS error. Press Ctrl+Shift+J or Cmd+Shift+J on a Mac.

Instagram

WEB DIRECTOR

マンノカズミチ

バンドマンを経て、台湾で日本語教師をしてましたが、2016年より株式会社AWESOMEにてWEB開発とコンテンツ制作を担当しております。SEO対策と記事執筆が得意分野です。こっそり台湾と日本のハーフです。

他の投稿を見る →