Submit Search
Upload
WKWebViewとUIWebView
•
65 likes
•
48,238 views
Yuki Hirai
Follow
WKWebViewとUIWebViewの違いについて解説
Read less
Read more
Mobile
Report
Share
Report
Share
1 of 61
Download now
Download to read offline
Recommended
WkWebViewのキャッシュについて調べた
WkWebViewのキャッシュについて調べた
firewood
イミュータブルデータモデル(世代編)
イミュータブルデータモデル(世代編)
Yoshitaka Kawashima
Amazon DynamoDB Advanced Design Pattern
Amazon DynamoDB Advanced Design Pattern
Amazon Web Services Japan
イミュータブルデータモデル(入門編)
イミュータブルデータモデル(入門編)
Yoshitaka Kawashima
Webアプリを並行開発する際のマイグレーション戦略
Webアプリを並行開発する際のマイグレーション戦略
Takayuki Shimizukawa
なぜ、いま リレーショナルモデルなのか(理論から学ぶデータベース実践入門読書会スペシャル)
なぜ、いま リレーショナルモデルなのか(理論から学ぶデータベース実践入門読書会スペシャル)
Mikiya Okuno
ゆるやかにBigQuery(データ基盤)を安定活用するプラクティス集 #bq_sushi
ゆるやかにBigQuery(データ基盤)を安定活用するプラクティス集 #bq_sushi
@yuzutas0 Yokoyama
숨겨진 마이크로서비스: 초고속 응답과 고가용성을 위한 캐시 서비스 디자인
숨겨진 마이크로서비스: 초고속 응답과 고가용성을 위한 캐시 서비스 디자인
VMware Tanzu Korea
Recommended
WkWebViewのキャッシュについて調べた
WkWebViewのキャッシュについて調べた
firewood
イミュータブルデータモデル(世代編)
イミュータブルデータモデル(世代編)
Yoshitaka Kawashima
Amazon DynamoDB Advanced Design Pattern
Amazon DynamoDB Advanced Design Pattern
Amazon Web Services Japan
イミュータブルデータモデル(入門編)
イミュータブルデータモデル(入門編)
Yoshitaka Kawashima
Webアプリを並行開発する際のマイグレーション戦略
Webアプリを並行開発する際のマイグレーション戦略
Takayuki Shimizukawa
なぜ、いま リレーショナルモデルなのか(理論から学ぶデータベース実践入門読書会スペシャル)
なぜ、いま リレーショナルモデルなのか(理論から学ぶデータベース実践入門読書会スペシャル)
Mikiya Okuno
ゆるやかにBigQuery(データ基盤)を安定活用するプラクティス集 #bq_sushi
ゆるやかにBigQuery(データ基盤)を安定活用するプラクティス集 #bq_sushi
@yuzutas0 Yokoyama
숨겨진 마이크로서비스: 초고속 응답과 고가용성을 위한 캐시 서비스 디자인
숨겨진 마이크로서비스: 초고속 응답과 고가용성을 위한 캐시 서비스 디자인
VMware Tanzu Korea
async/await のしくみ
async/await のしくみ
信之 岩永
今さら聞けないDiとspring
今さら聞けないDiとspring
土岐 孝平
Device Farm を使ったスマホアプリの自動テスト
Device Farm を使ったスマホアプリの自動テスト
健一 辰濱
並列クエリを実行するPostgreSQLのアーキテクチャ
並列クエリを実行するPostgreSQLのアーキテクチャ
Kohei KaiGai
Usb接続するアプリを開発した時に試行錯誤した事
Usb接続するアプリを開発した時に試行錯誤した事
Masataka Kono
Spring Boot + Doma + AngularJSで作るERP #jjug_ccc #ccc_r12
Spring Boot + Doma + AngularJSで作るERP #jjug_ccc #ccc_r12
学 松崎
2日間Fabricを触った俺が 色々解説してみる
2日間Fabricを触った俺が 色々解説してみる
airtoxin Ishii
iOS WKWebViewの魔改造 - iOSDC 2018
iOS WKWebViewの魔改造 - iOSDC 2018
Shingo Fukuyama
ネットワーク ゲームにおけるTCPとUDPの使い分け
ネットワーク ゲームにおけるTCPとUDPの使い分け
モノビット エンジン
実践 NestJS
実践 NestJS
Ayumi Goto
MVCになぞらえて理解するReact
MVCになぞらえて理解するReact
iPride Co., Ltd.
強いて言えば「集約どう実装するのかな、を考える」な話
強いて言えば「集約どう実装するのかな、を考える」な話
Yoshitaka Kawashima
Spring bootでweb バリデート編
Spring bootでweb バリデート編
なべ
最強オブジェクト指向言語 JavaScript 再入門!
最強オブジェクト指向言語 JavaScript 再入門!
Yuji Nojima
境界付けられたコンテキスト 概念編 (ドメイン駆動設計用語解説シリーズ)
境界付けられたコンテキスト 概念編 (ドメイン駆動設計用語解説シリーズ)
Koichiro Matsuoka
GoによるWebアプリ開発のキホン
GoによるWebアプリ開発のキホン
Akihiko Horiuchi
Github codespaces すごく良い。もうこれで 十分なんじゃという話
Github codespaces すごく良い。もうこれで 十分なんじゃという話
xiidec
Spark + S3 + R3를 이용한 데이터 분석 시스템 만들기
Spark + S3 + R3를 이용한 데이터 분석 시스템 만들기
AWSKRUG - AWS한국사용자모임
Pythonによる黒魔術入門
Pythonによる黒魔術入門
大樹 小倉
SpringBootTest入門
SpringBootTest入門
Yahoo!デベロッパーネットワーク
iOS 9 Bootcamp #6 UIKit
iOS 9 Bootcamp #6 UIKit
Shingo Hiraya
サーバーからiOSアプリを変更する
サーバーからiOSアプリを変更する
toyship
More Related Content
What's hot
async/await のしくみ
async/await のしくみ
信之 岩永
今さら聞けないDiとspring
今さら聞けないDiとspring
土岐 孝平
Device Farm を使ったスマホアプリの自動テスト
Device Farm を使ったスマホアプリの自動テスト
健一 辰濱
並列クエリを実行するPostgreSQLのアーキテクチャ
並列クエリを実行するPostgreSQLのアーキテクチャ
Kohei KaiGai
Usb接続するアプリを開発した時に試行錯誤した事
Usb接続するアプリを開発した時に試行錯誤した事
Masataka Kono
Spring Boot + Doma + AngularJSで作るERP #jjug_ccc #ccc_r12
Spring Boot + Doma + AngularJSで作るERP #jjug_ccc #ccc_r12
学 松崎
2日間Fabricを触った俺が 色々解説してみる
2日間Fabricを触った俺が 色々解説してみる
airtoxin Ishii
iOS WKWebViewの魔改造 - iOSDC 2018
iOS WKWebViewの魔改造 - iOSDC 2018
Shingo Fukuyama
ネットワーク ゲームにおけるTCPとUDPの使い分け
ネットワーク ゲームにおけるTCPとUDPの使い分け
モノビット エンジン
実践 NestJS
実践 NestJS
Ayumi Goto
MVCになぞらえて理解するReact
MVCになぞらえて理解するReact
iPride Co., Ltd.
強いて言えば「集約どう実装するのかな、を考える」な話
強いて言えば「集約どう実装するのかな、を考える」な話
Yoshitaka Kawashima
Spring bootでweb バリデート編
Spring bootでweb バリデート編
なべ
最強オブジェクト指向言語 JavaScript 再入門!
最強オブジェクト指向言語 JavaScript 再入門!
Yuji Nojima
境界付けられたコンテキスト 概念編 (ドメイン駆動設計用語解説シリーズ)
境界付けられたコンテキスト 概念編 (ドメイン駆動設計用語解説シリーズ)
Koichiro Matsuoka
GoによるWebアプリ開発のキホン
GoによるWebアプリ開発のキホン
Akihiko Horiuchi
Github codespaces すごく良い。もうこれで 十分なんじゃという話
Github codespaces すごく良い。もうこれで 十分なんじゃという話
xiidec
Spark + S3 + R3를 이용한 데이터 분석 시스템 만들기
Spark + S3 + R3를 이용한 데이터 분석 시스템 만들기
AWSKRUG - AWS한국사용자모임
Pythonによる黒魔術入門
Pythonによる黒魔術入門
大樹 小倉
SpringBootTest入門
SpringBootTest入門
Yahoo!デベロッパーネットワーク
What's hot
(20)
async/await のしくみ
async/await のしくみ
今さら聞けないDiとspring
今さら聞けないDiとspring
Device Farm を使ったスマホアプリの自動テスト
Device Farm を使ったスマホアプリの自動テスト
並列クエリを実行するPostgreSQLのアーキテクチャ
並列クエリを実行するPostgreSQLのアーキテクチャ
Usb接続するアプリを開発した時に試行錯誤した事
Usb接続するアプリを開発した時に試行錯誤した事
Spring Boot + Doma + AngularJSで作るERP #jjug_ccc #ccc_r12
Spring Boot + Doma + AngularJSで作るERP #jjug_ccc #ccc_r12
2日間Fabricを触った俺が 色々解説してみる
2日間Fabricを触った俺が 色々解説してみる
iOS WKWebViewの魔改造 - iOSDC 2018
iOS WKWebViewの魔改造 - iOSDC 2018
ネットワーク ゲームにおけるTCPとUDPの使い分け
ネットワーク ゲームにおけるTCPとUDPの使い分け
実践 NestJS
実践 NestJS
MVCになぞらえて理解するReact
MVCになぞらえて理解するReact
強いて言えば「集約どう実装するのかな、を考える」な話
強いて言えば「集約どう実装するのかな、を考える」な話
Spring bootでweb バリデート編
Spring bootでweb バリデート編
最強オブジェクト指向言語 JavaScript 再入門!
最強オブジェクト指向言語 JavaScript 再入門!
境界付けられたコンテキスト 概念編 (ドメイン駆動設計用語解説シリーズ)
境界付けられたコンテキスト 概念編 (ドメイン駆動設計用語解説シリーズ)
GoによるWebアプリ開発のキホン
GoによるWebアプリ開発のキホン
Github codespaces すごく良い。もうこれで 十分なんじゃという話
Github codespaces すごく良い。もうこれで 十分なんじゃという話
Spark + S3 + R3를 이용한 데이터 분석 시스템 만들기
Spark + S3 + R3를 이용한 데이터 분석 시스템 만들기
Pythonによる黒魔術入門
Pythonによる黒魔術入門
SpringBootTest入門
SpringBootTest入門
Similar to WKWebViewとUIWebView
iOS 9 Bootcamp #6 UIKit
iOS 9 Bootcamp #6 UIKit
Shingo Hiraya
サーバーからiOSアプリを変更する
サーバーからiOSアプリを変更する
toyship
iOS WebView App
iOS WebView App
hagino 3000
cordova/electronの構造を知る
cordova/electronの構造を知る
Yasuharu Seki
DOO-003_Jenkins 作者が語る、Docker コンテナによる継続的デリバリのオススメと新機能のご紹介
DOO-003_Jenkins 作者が語る、Docker コンテナによる継続的デリバリのオススメと新機能のご紹介
decode2016
about miruzo
about miruzo
eastfujiwara
VSCodeで始めるAzure Static Web Apps開発
VSCodeで始めるAzure Static Web Apps開発
Yuta Matsumura
[公開用]Netラボ2012年2月勉強会 asp.netmvc4 beta新機能の紹介
[公開用]Netラボ2012年2月勉強会 asp.netmvc4 beta新機能の紹介
david9142
[JavaOne Tokyo 2012] JavaFX and Web Integration
[JavaOne Tokyo 2012] JavaFX and Web Integration
Kazuchika Sekiya
2012 05-19第44回cocoa勉強会発表資料
2012 05-19第44回cocoa勉強会発表資料
OCHI Shuji
Kubernetes Meetup Tokyo #23 kubebuilder-v2
Kubernetes Meetup Tokyo #23 kubebuilder-v2
Kazuhito Matsuda
Featuring Project Silk & Liike: 楽しい "モダン" Web 開発のちょっとディープなお話
Featuring Project Silk & Liike: 楽しい "モダン" Web 開発のちょっとディープなお話
Akira Inoue
let UIWebView as WKWebView
let UIWebView as WKWebView
Taketo Sano
Firefox OS and Web server
Firefox OS and Web server
Tomoaki Konno
はじめよう Backbone.js
はじめよう Backbone.js
Hiroki Toyokawa
Xamarin で ReactiveUI を使ってみた
Xamarin で ReactiveUI を使ってみた
Hironov OKUYAMA
AppiumのWebViewアプリテストの仕組みとハマりどころ
AppiumのWebViewアプリテストの仕組みとハマりどころ
Masayuki Wakizaka
090821 Ruby Sapporo Night Ruby Cocoa
090821 Ruby Sapporo Night Ruby Cocoa
Tomoki Maeda
2021/03/19 パブリッククラウドを活かす運用プロセス自動化
2021/03/19 パブリッククラウドを活かす運用プロセス自動化
Issei Hiraoka
Reactのおさらい
Reactのおさらい
iPride Co., Ltd.
Similar to WKWebViewとUIWebView
(20)
iOS 9 Bootcamp #6 UIKit
iOS 9 Bootcamp #6 UIKit
サーバーからiOSアプリを変更する
サーバーからiOSアプリを変更する
iOS WebView App
iOS WebView App
cordova/electronの構造を知る
cordova/electronの構造を知る
DOO-003_Jenkins 作者が語る、Docker コンテナによる継続的デリバリのオススメと新機能のご紹介
DOO-003_Jenkins 作者が語る、Docker コンテナによる継続的デリバリのオススメと新機能のご紹介
about miruzo
about miruzo
VSCodeで始めるAzure Static Web Apps開発
VSCodeで始めるAzure Static Web Apps開発
[公開用]Netラボ2012年2月勉強会 asp.netmvc4 beta新機能の紹介
[公開用]Netラボ2012年2月勉強会 asp.netmvc4 beta新機能の紹介
[JavaOne Tokyo 2012] JavaFX and Web Integration
[JavaOne Tokyo 2012] JavaFX and Web Integration
2012 05-19第44回cocoa勉強会発表資料
2012 05-19第44回cocoa勉強会発表資料
Kubernetes Meetup Tokyo #23 kubebuilder-v2
Kubernetes Meetup Tokyo #23 kubebuilder-v2
Featuring Project Silk & Liike: 楽しい "モダン" Web 開発のちょっとディープなお話
Featuring Project Silk & Liike: 楽しい "モダン" Web 開発のちょっとディープなお話
let UIWebView as WKWebView
let UIWebView as WKWebView
Firefox OS and Web server
Firefox OS and Web server
はじめよう Backbone.js
はじめよう Backbone.js
Xamarin で ReactiveUI を使ってみた
Xamarin で ReactiveUI を使ってみた
AppiumのWebViewアプリテストの仕組みとハマりどころ
AppiumのWebViewアプリテストの仕組みとハマりどころ
090821 Ruby Sapporo Night Ruby Cocoa
090821 Ruby Sapporo Night Ruby Cocoa
2021/03/19 パブリッククラウドを活かす運用プロセス自動化
2021/03/19 パブリッククラウドを活かす運用プロセス自動化
Reactのおさらい
Reactのおさらい
WKWebViewとUIWebView
1.
WKWebViewとUIWebView Copylight ©
Classmethod, Inc. Classmethod, Inc.! 平井 祐樹 1
2.
自己紹介 • 平井 祐樹!
• クラスメソッド株式会社! • iPhoneアプリサービス事業部! • iOSアプリ開発歴2年半ぐらい Copylight © Classmethod, Inc. 2
3.
Copylight © Classmethod,
Inc. アジェンダ • WKWebView とは?! • WKWebViewとUIWebViewの違い! • WKWebViewを利用したアプリ内ブラウザ の作り方 3
4.
WKWebView とは? •
UIWebViewの強化版! • UIWebViewとほとんど同じように使える! • 実行速度、安定性の向上された! • WebKit Frameworkに含まれる(≧iOS 8) Copylight © Classmethod, Inc. 4
5.
UIWebViewとWKWebView UIWebView WKWebView
- (void)loadRequest:(NSURLRequest *)request; - (WKNavigation *)loadRequest:(NSURLRequest Copylight © Classmethod, Inc. 5 *)request; - (void)loadHTMLString:(NSString *)string baseURL:(NSURL *)baseURL; - (WKNavigation *)loadHTMLString:(NSString *)string baseURL:(NSURL *)baseURL; - (void)reload; - (WKNavigation *)reload; - (void)stopLoading; - (void)stopLoading; - (void)goBack; - (WKNavigation *)goBack; - (void)goForward; - (WKNavigation *)goForward; ほとんど同じ!
6.
WKWebViewとUIWebViewの違い Copylight ©
Classmethod, Inc. 6
7.
WKWebViewとUIWebViewの違い プログレスの取得! タイトル・URLの取得!
Safariのような閲覧履歴! エッジスワイプでの戻る/進む操作! プロパティのKVO対応! JavaScriptとの連携強化 Copylight © Classmethod, Inc. 7
8.
Copylight © Classmethod,
Inc. プログレスの取得 8
9.
Copylight © Classmethod,
Inc. 9
10.
UIWebView • プログレスを取得するインターフェース
が用意されていない! • 自前で実装するかOSSを利用 Copylight © Classmethod, Inc. 10 プログレスの取得
11.
Copylight © Classmethod,
Inc. WKWebView プログレスを取得できるようになった!! • estimatedProgressプロパティが追加! • (double)0.0~1.0でプログレスを表す 11 プログレスの取得 UIは自分で実装 しなきゃダメ!!
12.
タイトル・URLの取得 Copylight ©
Classmethod, Inc. 12
13.
Copylight © Classmethod,
Inc. 13
14.
タイトル・URLの取得 Copylight ©
Classmethod, Inc. UIWebView • 表示中のページのタイトルやURLを取得できる インターフェースがない! • 「- webViewDidFinishLoad:」メソッドとかで以 下のようにして取得するしかない 14 NSString *title = [webView stringByEvaluatingJavaScriptFromString:@"document.title"]; ! NSString *url = [webView stringByEvaluatingJavaScriptFromString:@"document.URL"]; Objective-C
15.
Objective-C Copylight ©
Classmethod, Inc. WKWebView 表示中のタイトルやURLが取得できるよう になった!! • title/URLプロパティが追加 15 タイトル・URLの取得 @property (nonatomic, readonly, copy) NSString *title; @property (nonatomic, readonly, copy) NSURL *URL;
16.
Safariのような閲覧履歴 Copylight ©
Classmethod, Inc. 16
17.
Copylight © Classmethod,
Inc. 17
18.
UIWebView • 閲覧履歴は自分で管理するしかない!
• 一応、進む/戻るはある Copylight © Classmethod, Inc. 18 Safariのような閲覧履歴
19.
Copylight © Classmethod,
Inc. WKWebView 閲覧履歴が管理されるようになった!! • backForwardListプロパティが追加! • WebView内の閲覧履歴を勝手に管理 してくれる 19 Safariのような閲覧履歴 UIは自分で実装 しなきゃダメ!!
20.
Copylight © Classmethod,
Inc. エッジスワイプでの! 戻る/進む操作 20
21.
Copylight © Classmethod,
Inc. 21
22.
エッジスワイプでの戻る/進む操作 UIWebView •
UISwipeGestureなどで自分で実装するし かない Copylight © Classmethod, Inc. 22
23.
エッジスワイプでの戻る/進む操作 Copylight ©
Classmethod, Inc. WKWebView プロパティの設定だけで簡単にできるように なった!! • allowsBackForwardNavigationGestures がプロパティ追加 23
24.
プロパティのKVO対応 Copylight ©
Classmethod, Inc. 24
25.
プロパティのKVO対応 UIWebView •
プロパティはKVOに対応していない Copylight © Classmethod, Inc. 25
26.
Copylight © Classmethod,
Inc. WKWebView 以下のプロパティがKVOに対応した!! – title! – URL! – loading! – estimatedProgress! – hasOnlySecureContent! – canGoBack! – canGoForward 26 プロパティのKVO対応
27.
JavaScriptとの連携強化 Copylight ©
Classmethod, Inc. 27
28.
JavaScript ← Native
Copylight © Classmethod, Inc. 28
29.
! - (NSString
*)stringByEvaluatingJavaScriptFromString:(NSString *)script; Copylight © Classmethod, Inc. UIWebView • ロード済みのコンテンツに対して、以下のメソッ ドでJavaScriptのコードを実行できる 29 JavaScript ← Native Objective-C
30.
Objective-C Copylight ©
Classmethod, Inc. WKWebView • ロード済みのコンテンツに対して、以下のメソッ ドでJavaScriptのコードを実行できる! ! ! 30 JavaScript ← Native ! - (void)evaluateJavaScript:(NSString *)javaScriptString completionHandler:(void (^)(id, NSError *))completionHandler; • User Scripts(←New!!)
31.
Copylight © Classmethod,
Inc. User Scripts • 読み込み開始/終了時に実行する JavaScriptを注入することができる!! – 広告を削除! – コメントを非表示! – 文字列の置換 31 JavaScript ← Native
32.
例:Webページの背景を変更する // ページの背景を赤(#F00)にする
JavaScript コード NSString *source = @"document.body.style.background = "#F00""; // ドキュメントの読み込みが完了したタイミングで、JavaScriptコードを実行する WKUserScript *userScript = [[WKUserScript alloc] WKUserContentController *userContentController = [WKUserContentController new]; [userContentController addUserScript:userScript]; ! WKWebViewConfiguration *configuration = [WKWebViewConfiguration new]; configuration.userContentController = userContentController; ! // WKWebView インスタンスの生成 self.webView = [[WKWebView alloc] initWithFrame:self.view.bounds Copylight © Classmethod, Inc. initWithSource:source injectionTime:WKUserScriptInjectionTimeAtDocumentEnd forMainFrameOnly:YES]; configuration:configuration]; 32 JavaScript ← Native Objective-C
33.
JavaScript → Native
Copylight © Classmethod, Inc. 33
34.
Objective-C Copylight ©
Classmethod, Inc. UIWebView • 以下のデリゲートをフック 34 JavaScript ← Native ! - (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType;
35.
UIWebView JavaScript ←
Native JavaScript function executeNativeCode() { // 任意のschemeをで呼び出す open("native://some”); Objective-C Copylight © Classmethod, Inc. 35 } -(BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType { if ([request.URL.scheme isEqualToString:@"native"]) { // Nativeの処理・・・ return NO; } else { return YES; } } めんどくさい・・・
36.
Copylight © Classmethod,
Inc. WKWebView • Message Handlers(←New!!) 36 JavaScript ← Native
37.
Message Handlers •
JavaScriptからNativeコードに対してメッ セージを送信できる! ! window.webkit.messageHandlers.{NAME}.postMessage() Copylight © Classmethod, Inc. 37 JavaScript ← Native JavaScript
38.
例:JavaScriptから受け取った文字列 Objective-C WKUserContentController
*userContentController = [WKUserContentController new]; [userContentController addScriptMessageHandler:self name:@"log"]; WKWebViewConfiguration *configuration = [WKWebViewConfiguration new]; configuration.userContentController = userContentController; self.webView = [[WKWebView alloc] initWithFrame:self.view.bounds ・・・ ! - (void)userContentController:(WKUserContentController *)userContentController didReceiveScriptMessage:(WKScriptMessage *)message Copylight © Classmethod, Inc. をNSLogに表示する configuration:configuration]; 38 { if ([message.name isEqualToString:@"log"]) { NSLog(@"%@", message.body); } }
39.
例:JavaScriptから受け取った文字列 をNSLogに表示する JavaScript
! window.webkit.messageHandlers.log.postMessage(”コンソールに文字を表 示!”); Copylight © Classmethod, Inc. 39
40.
Copylight © Classmethod,
Inc. WKWebView で! たくさん機能が強化された!! 40
41.
せっかくなので WKWebView を!
Copylight © Classmethod, Inc. 使ってみよう! 41
42.
WKWebViewを利用したアプリ内ブ Copylight ©
Classmethod, Inc. ラウザの作り方 42
43.
https://github.com/hirai-yuki/ WebBrowserSample Copylight
© Classmethod, Inc. 43
44.
Copylight © Classmethod,
Inc. デモ 44
45.
KVOを利用すると超簡単! Copylight ©
Classmethod, Inc. 45
46.
Copylight © Classmethod,
Inc. プログレス表示 46
47.
Copylight © Classmethod,
Inc. プログレス表示 • estimatedProgressの変更を監視(KVO)! • UIは自分で用意! - SGNavigationProgressを利用 47
48.
Objective-C // WKWebView
インスタンスのプロパティの変更を監視する [self.webView addObserver:self forKeyPath:@"estimatedProgress" options:NSKeyValueObservingOptionNew context:nil]; ! ・・・ ! - (void)observeValueForKeyPath:(NSString *)keyPath Copylight © Classmethod, Inc. プログレス表示 ofObject:(id)object change:(NSDictionary *)change context:(void *)context 48 { if ([keyPath isEqualToString:@"estimatedProgress"]) { // estimatedProgressが変更されたら、プログレスバーを更新する CGFloat progressPercentage = self.webView.estimatedProgress * 100.0f; [self.navigationController setSGProgressPercentage:progressPercentage]; } }
49.
ネットワークインジケータの表示 Copylight ©
Classmethod, Inc. 49
50.
ネットワークインジケータの表示 • loadingの変更を監視(KVO)
Copylight © Classmethod, Inc. 50
51.
ネットワークインジケータの表示 Objective-C //
WKWebView インスタンスのプロパティの変更を監視する Copylight © Classmethod, Inc. 51 [self.webView addObserver:self forKeyPath:@"loading" options:NSKeyValueObservingOptionNew context:nil]; ! ・・・ ! - (void)observeValueForKeyPath:(NSString *)keyPath ofObject:(id)object change:(NSDictionary *)change context:(void *)context { if ([keyPath isEqualToString:@"loading"]) { // loadingが変更されたら、ステータスバーのインジケーターの表示・非表示を切り替える UIApplication *app = [UIApplication sharedApplication]; app.networkActivityIndicatorVisible = self.webView.loading; } }
52.
Copylight © Classmethod,
Inc. 表示中のタイトル 52
53.
Copylight © Classmethod,
Inc. 表示中のタイトル • titleの変更を監視(KVO) 53
54.
Objective-C // WKWebView
インスタンスのプロパティの変更を監視する Copylight © Classmethod, Inc. 表示中のタイトル 54 [self.webView addObserver:self forKeyPath:@"title" options:NSKeyValueObservingOptionNew context:nil]; ! ・・・ ! - (void)observeValueForKeyPath:(NSString *)keyPath ofObject:(id)object change:(NSDictionary *)change context:(void *)context { if ([keyPath isEqualToString:@"title"]) { // titleが変更されたら、ナビゲーションバーのタイトルを設定する self.title = self.webView.title; } }
55.
Copylight © Classmethod,
Inc. 戻る/進むボタン 55
56.
Copylight © Classmethod,
Inc. 戻る/進むボタン • canGoBack、canGoForwardの変更を監視 (KVO) 56
57.
Objective-C // WKWebView
インスタンスのプロパティの変更を監視する [self.webView addObserver:self forKeyPath:@"canGoBack" options:NSKeyValueObservingOptionNew context:nil]; ! ・・・ ! - (void)observeValueForKeyPath:(NSString *)keyPath ofObject:(id)object change:(NSDictionary *)change context:(void *)context Copylight © Classmethod, Inc. 57 { if ([keyPath isEqualToString:@"title"]) { // canGoBackが変更されたら、「<」ボタンの有効・無効を切り替える self.backButton.enabled = self.webView.canGoBack; } } 戻る/進むボタン
58.
Copylight © Classmethod,
Inc. まとめ • WKWebViewで高機能なアプリ内ブラウザ が簡単につくれる! • JavaScriptとの連携は使い方次第でかなり 強力になる可能性大 58
59.
ご清聴ありがとうございました Copylight ©
Classmethod, Inc. 59
Download now