Enviar búsqueda
Cargar
WKWebViewとUIWebView
•
65 recomendaciones
•
48,240 vistas
Yuki Hirai
Seguir
WKWebViewとUIWebViewの違いについて解説
Leer menos
Leer más
Móvil
Denunciar
Compartir
Denunciar
Compartir
1 de 61
Descargar ahora
Descargar para leer sin conexión
Recomendados
iOS WKWebViewの魔改造 - iOSDC 2018
iOS WKWebViewの魔改造 - iOSDC 2018
Shingo Fukuyama
AppiumのWebViewアプリテストの仕組みとハマりどころ
AppiumのWebViewアプリテストの仕組みとハマりどころ
Masayuki Wakizaka
Cinemachineで見下ろし視点のカメラを作る
Cinemachineで見下ろし視点のカメラを作る
Unity Technologies Japan K.K.
既存RailsアプリをSSO化して、本番環境で活用した話【WESEEK Tech Conf #12】
既存RailsアプリをSSO化して、本番環境で活用した話【WESEEK Tech Conf #12】
WESEEKWESEEK
iOS 15で通知はより見られなくなる
iOS 15で通知はより見られなくなる
Daiki Mogmet Ito
Git flowの活用事例
Git flowの活用事例
Hirohito Kato
Djangoのエントリポイントとアプリケーションの仕組み
Djangoのエントリポイントとアプリケーションの仕組み
Shinya Okano
WkWebViewのキャッシュについて調べた
WkWebViewのキャッシュについて調べた
firewood
Recomendados
iOS WKWebViewの魔改造 - iOSDC 2018
iOS WKWebViewの魔改造 - iOSDC 2018
Shingo Fukuyama
AppiumのWebViewアプリテストの仕組みとハマりどころ
AppiumのWebViewアプリテストの仕組みとハマりどころ
Masayuki Wakizaka
Cinemachineで見下ろし視点のカメラを作る
Cinemachineで見下ろし視点のカメラを作る
Unity Technologies Japan K.K.
既存RailsアプリをSSO化して、本番環境で活用した話【WESEEK Tech Conf #12】
既存RailsアプリをSSO化して、本番環境で活用した話【WESEEK Tech Conf #12】
WESEEKWESEEK
iOS 15で通知はより見られなくなる
iOS 15で通知はより見られなくなる
Daiki Mogmet Ito
Git flowの活用事例
Git flowの活用事例
Hirohito Kato
Djangoのエントリポイントとアプリケーションの仕組み
Djangoのエントリポイントとアプリケーションの仕組み
Shinya Okano
WkWebViewのキャッシュについて調べた
WkWebViewのキャッシュについて調べた
firewood
iOSDC 2018 動画をなめらかに動かす技術
iOSDC 2018 動画をなめらかに動かす技術
Yuji Hato
OpenID ConnectとAndroidアプリのログインサイクル
OpenID ConnectとAndroidアプリのログインサイクル
Masaru Kurahayashi
オブジェクト指向できていますか?
オブジェクト指向できていますか?
Moriharu Ohzu
MRTK V2.3 Spatial Awareness
MRTK V2.3 Spatial Awareness
Yuichi Ishii
GraphQLのsubscriptionで出来ること
GraphQLのsubscriptionで出来ること
Shingo Fukui
WebSocket / WebRTCの技術紹介
WebSocket / WebRTCの技術紹介
Yasuhiro Mawarimichi
M04_失敗しないための Azure Virtual Desktop 設計ガイド
M04_失敗しないための Azure Virtual Desktop 設計ガイド
日本マイクロソフト株式会社
CEDEC2021 Android iOS 実機上での自動テストをより楽に有意義にする為に ~端末管理・イメージ転送・動画記録等の周辺情報のノウハウ共有~
CEDEC2021 Android iOS 実機上での自動テストをより楽に有意義にする為に ~端末管理・イメージ転送・動画記録等の周辺情報のノウハウ共有~
SEGADevTech
Unityでパフォーマンスの良いUIを作る為のTips
Unityでパフォーマンスの良いUIを作る為のTips
Unity Technologies Japan K.K.
Obsidian Talk JP - Template & Daily notes - 2021-09-04
Obsidian Talk JP - Template & Daily notes - 2021-09-04
博文 斉藤
アプリの鍵が消える時_Droid kaigi2018
アプリの鍵が消える時_Droid kaigi2018
ak_shio_555
Docker入門-基礎編 いまから始めるDocker管理【2nd Edition】
Docker入門-基礎編 いまから始めるDocker管理【2nd Edition】
Masahito Zembutsu
Keycloak開発入門
Keycloak開発入門
Yuichi Nakamura
やはりお前らのMVCは間違っている
やはりお前らのMVCは間違っている
Koichi Tanaka
【Unite Tokyo 2019】Unity Test Runnerを活用して内部品質を向上しよう
【Unite Tokyo 2019】Unity Test Runnerを活用して内部品質を向上しよう
UnityTechnologiesJapan002
gitを使って、レポジトリの一部抽出forkしてみました
gitを使って、レポジトリの一部抽出forkしてみました
Takako Miyagawa
Practical migration from JSP to Thymeleaf
Practical migration from JSP to Thymeleaf
Toshiki Iga
JenkinsとDockerって何が良いの? 〜言うてるオレもわからんわ〜 #jenkinsstudy
JenkinsとDockerって何が良いの? 〜言うてるオレもわからんわ〜 #jenkinsstudy
Kazuhito Miura
【Unity】Scriptable object 入門と活用例
【Unity】Scriptable object 入門と活用例
Unity Technologies Japan K.K.
iOS WebView App
iOS WebView App
hagino 3000
iOS 9 Bootcamp #6 UIKit
iOS 9 Bootcamp #6 UIKit
Shingo Hiraya
サーバーからiOSアプリを変更する
サーバーからiOSアプリを変更する
toyship
Más contenido relacionado
La actualidad más candente
iOSDC 2018 動画をなめらかに動かす技術
iOSDC 2018 動画をなめらかに動かす技術
Yuji Hato
OpenID ConnectとAndroidアプリのログインサイクル
OpenID ConnectとAndroidアプリのログインサイクル
Masaru Kurahayashi
オブジェクト指向できていますか?
オブジェクト指向できていますか?
Moriharu Ohzu
MRTK V2.3 Spatial Awareness
MRTK V2.3 Spatial Awareness
Yuichi Ishii
GraphQLのsubscriptionで出来ること
GraphQLのsubscriptionで出来ること
Shingo Fukui
WebSocket / WebRTCの技術紹介
WebSocket / WebRTCの技術紹介
Yasuhiro Mawarimichi
M04_失敗しないための Azure Virtual Desktop 設計ガイド
M04_失敗しないための Azure Virtual Desktop 設計ガイド
日本マイクロソフト株式会社
CEDEC2021 Android iOS 実機上での自動テストをより楽に有意義にする為に ~端末管理・イメージ転送・動画記録等の周辺情報のノウハウ共有~
CEDEC2021 Android iOS 実機上での自動テストをより楽に有意義にする為に ~端末管理・イメージ転送・動画記録等の周辺情報のノウハウ共有~
SEGADevTech
Unityでパフォーマンスの良いUIを作る為のTips
Unityでパフォーマンスの良いUIを作る為のTips
Unity Technologies Japan K.K.
Obsidian Talk JP - Template & Daily notes - 2021-09-04
Obsidian Talk JP - Template & Daily notes - 2021-09-04
博文 斉藤
アプリの鍵が消える時_Droid kaigi2018
アプリの鍵が消える時_Droid kaigi2018
ak_shio_555
Docker入門-基礎編 いまから始めるDocker管理【2nd Edition】
Docker入門-基礎編 いまから始めるDocker管理【2nd Edition】
Masahito Zembutsu
Keycloak開発入門
Keycloak開発入門
Yuichi Nakamura
やはりお前らのMVCは間違っている
やはりお前らのMVCは間違っている
Koichi Tanaka
【Unite Tokyo 2019】Unity Test Runnerを活用して内部品質を向上しよう
【Unite Tokyo 2019】Unity Test Runnerを活用して内部品質を向上しよう
UnityTechnologiesJapan002
gitを使って、レポジトリの一部抽出forkしてみました
gitを使って、レポジトリの一部抽出forkしてみました
Takako Miyagawa
Practical migration from JSP to Thymeleaf
Practical migration from JSP to Thymeleaf
Toshiki Iga
JenkinsとDockerって何が良いの? 〜言うてるオレもわからんわ〜 #jenkinsstudy
JenkinsとDockerって何が良いの? 〜言うてるオレもわからんわ〜 #jenkinsstudy
Kazuhito Miura
【Unity】Scriptable object 入門と活用例
【Unity】Scriptable object 入門と活用例
Unity Technologies Japan K.K.
iOS WebView App
iOS WebView App
hagino 3000
La actualidad más candente
(20)
iOSDC 2018 動画をなめらかに動かす技術
iOSDC 2018 動画をなめらかに動かす技術
OpenID ConnectとAndroidアプリのログインサイクル
OpenID ConnectとAndroidアプリのログインサイクル
オブジェクト指向できていますか?
オブジェクト指向できていますか?
MRTK V2.3 Spatial Awareness
MRTK V2.3 Spatial Awareness
GraphQLのsubscriptionで出来ること
GraphQLのsubscriptionで出来ること
WebSocket / WebRTCの技術紹介
WebSocket / WebRTCの技術紹介
M04_失敗しないための Azure Virtual Desktop 設計ガイド
M04_失敗しないための Azure Virtual Desktop 設計ガイド
CEDEC2021 Android iOS 実機上での自動テストをより楽に有意義にする為に ~端末管理・イメージ転送・動画記録等の周辺情報のノウハウ共有~
CEDEC2021 Android iOS 実機上での自動テストをより楽に有意義にする為に ~端末管理・イメージ転送・動画記録等の周辺情報のノウハウ共有~
Unityでパフォーマンスの良いUIを作る為のTips
Unityでパフォーマンスの良いUIを作る為のTips
Obsidian Talk JP - Template & Daily notes - 2021-09-04
Obsidian Talk JP - Template & Daily notes - 2021-09-04
アプリの鍵が消える時_Droid kaigi2018
アプリの鍵が消える時_Droid kaigi2018
Docker入門-基礎編 いまから始めるDocker管理【2nd Edition】
Docker入門-基礎編 いまから始めるDocker管理【2nd Edition】
Keycloak開発入門
Keycloak開発入門
やはりお前らのMVCは間違っている
やはりお前らのMVCは間違っている
【Unite Tokyo 2019】Unity Test Runnerを活用して内部品質を向上しよう
【Unite Tokyo 2019】Unity Test Runnerを活用して内部品質を向上しよう
gitを使って、レポジトリの一部抽出forkしてみました
gitを使って、レポジトリの一部抽出forkしてみました
Practical migration from JSP to Thymeleaf
Practical migration from JSP to Thymeleaf
JenkinsとDockerって何が良いの? 〜言うてるオレもわからんわ〜 #jenkinsstudy
JenkinsとDockerって何が良いの? 〜言うてるオレもわからんわ〜 #jenkinsstudy
【Unity】Scriptable object 入門と活用例
【Unity】Scriptable object 入門と活用例
iOS WebView App
iOS WebView App
Similar a WKWebViewとUIWebView
iOS 9 Bootcamp #6 UIKit
iOS 9 Bootcamp #6 UIKit
Shingo Hiraya
サーバーからiOSアプリを変更する
サーバーからiOSアプリを変更する
toyship
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
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.
Angularreflex20141210
Angularreflex20141210
Shinichiro Takezaki
Enhancements with 3D Touch
Enhancements with 3D Touch
Satoshi Ohki
Similar a WKWebViewとUIWebView
(20)
iOS 9 Bootcamp #6 UIKit
iOS 9 Bootcamp #6 UIKit
サーバーからiOSアプリを変更する
サーバーからiOSアプリを変更する
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 を使ってみた
090821 Ruby Sapporo Night Ruby Cocoa
090821 Ruby Sapporo Night Ruby Cocoa
2021/03/19 パブリッククラウドを活かす運用プロセス自動化
2021/03/19 パブリッククラウドを活かす運用プロセス自動化
Reactのおさらい
Reactのおさらい
Angularreflex20141210
Angularreflex20141210
Enhancements with 3D Touch
Enhancements with 3D Touch
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
Descargar ahora