WKWebView的新特性與使用

在WWDC2014中怯屉,蘋果推出了最新的iOS8系統(tǒng)衫冻,其中也伴隨著很多控件的更新與升級(jí)澎胡。其中全新的WebKit庫讓人很是興奮述暂。本文也將講解到WebKit中更新的WKWebView控件的新特性與使用方法,它很好的解決了UIWebView存在的內(nèi)存责球、加載速度等諸多問題焦履。

環(huán)境信息:

Mac OS X 10.10.1

Xcode 6.1.1

iOS 8.1

正文:

一、WKWebView新特性

在性能雏逾、穩(wěn)定性嘉裤、功能方面有很大提升(最直觀的體現(xiàn)就是加載網(wǎng)頁是占用的內(nèi)存,模擬器加載百度與開源中國網(wǎng)站時(shí)栖博,WKWebView占用23M屑宠,而UIWebView占用85M);
允許JavaScript的Nitro庫加載并使用(UIWebView中限制)仇让;
支持了更多的HTML5特性典奉;
高達(dá)60fps的滾動(dòng)刷新率以及內(nèi)置手勢;
將UIWebViewDelegate與UIWebView重構(gòu)成了14類與3個(gè)協(xié)議(查看蘋果官方文檔)丧叽;
二卫玖、初始化

1.首先需要引入WebKit庫

#import <WebKit/WebKit.h>
// 默認(rèn)初始化
- (instancetype)initWithFrame:(CGRect)frame;

// 根據(jù)對(duì)webview的相關(guān)配置,進(jìn)行初始化
- (instancetype)initWithFrame:(CGRect)frame configuration:(WKWebViewConfiguration *)configuration NS_DESIGNATED_INITIALIZER;

3.加載網(wǎng)頁與HTML代碼的方式與UIWebView相同踊淳,代碼如下:

WKWebView *webView = [[WKWebView alloc] initWithFrame:self.view.bounds];
[webView loadRequest:[NSURLRequest requestWithURL:[NSURL URLWithString:@"http://www.baidu.com"]]];
[self.view addSubview:webView];

三假瞬、 WKWebView的代理方法

1. WKNavigationDelegate

該代理提供的方法,可以用來追蹤加載過程(頁面開始加載迂尝、加載完成脱茉、加載失敗)垄开、決定是否執(zhí)行跳轉(zhuǎn)琴许。

// 頁面開始加載時(shí)調(diào)用
- (void)webView:(WKWebView *)webView didStartProvisionalNavigation:(WKNavigation *)navigation;
// 當(dāng)內(nèi)容開始返回時(shí)調(diào)用
- (void)webView:(WKWebView *)webView didCommitNavigation:(WKNavigation *)navigation;
// 頁面加載完成之后調(diào)用
- (void)webView:(WKWebView *)webView didFinishNavigation:(WKNavigation *)navigation;
// 頁面加載失敗時(shí)調(diào)用
- (void)webView:(WKWebView *)webView didFailProvisionalNavigation:(WKNavigation *)navigation;

頁面跳轉(zhuǎn)的代理方法有三種,分為(收到跳轉(zhuǎn)與決定是否跳轉(zhuǎn)兩種)

// 接收到服務(wù)器跳轉(zhuǎn)請(qǐng)求之后調(diào)用
- (void)webView:(WKWebView *)webView didReceiveServerRedirectForProvisionalNavigation:(WKNavigation *)navigation;
// 在收到響應(yīng)后溉躲,決定是否跳轉(zhuǎn)
- (void)webView:(WKWebView *)webView decidePolicyForNavigationResponse:(WKNavigationResponse *)navigationResponse decisionHandler:(void (^)(WKNavigationResponsePolicy))decisionHandler;
// 在發(fā)送請(qǐng)求之前榜田,決定是否跳轉(zhuǎn)
- (void)webView:(WKWebView *)webView decidePolicyForNavigationAction:(WKNavigationAction *)navigationAction decisionHandler:(void (^)(WKNavigationActionPolicy))decisionHandler;
2. WKUIDelegate

// 創(chuàng)建一個(gè)新的WebView
- (WKWebView *)webView:(WKWebView *)webView createWebViewWithConfiguration:(WKWebViewConfiguration *)configuration forNavigationAction:(WKNavigationAction *)navigationAction windowFeatures:(WKWindowFeatures *)windowFeatures;

剩下三個(gè)代理方法全都是與界面彈出提示框相關(guān)的,針對(duì)于web界面的三種提示框(警告框锻梳、確認(rèn)框箭券、輸入框)分別對(duì)應(yīng)三種代理方法。下面只舉了警告框的例子唱蒸。

/**
 *  web界面中有彈出警告框時(shí)調(diào)用
 *
 *  @param webView           實(shí)現(xiàn)該代理的webview
 *  @param message           警告框中的內(nèi)容
 *  @param frame             主窗口
 *  @param completionHandler 警告框消失調(diào)用
 */
- (void)webView:(WKWebView *)webView runJavaScriptAlertPanelWithMessage:(NSString *)message initiatedByFrame:(void (^)())completionHandler;
3. WKScriptMessageHandler

這個(gè)協(xié)議中包含一個(gè)必須實(shí)現(xiàn)的方法邦鲫,這個(gè)方法是提高App與web端交互的關(guān)鍵灸叼,它可以直接將接收到的JS腳本轉(zhuǎn)為OC或Swift對(duì)象神汹。(當(dāng)然庆捺,在UIWebView也可以通過“曲線救國”的方式與web進(jìn)行交互,著名的Cordova框架就是這種機(jī)制)


// 從web界面中接收到一個(gè)腳本時(shí)調(diào)用
- (void)userContentController:(WKUserContentController *)userContentController didReceiveScriptMessage:(WKScriptMessage *)message;
四屁魏、WKWebView加載JS
// 圖片縮放的js代碼
NSString *js = @"var count = document.images.length;for (var i = 0; i < count; i++) {var image = document.images[i];image.style.width=320;};window.alert('找到' + count + '張圖');"; // 根據(jù)JS字符串初始化WKUserScript對(duì)象 WKUserScript *script = [[WKUserScript alloc] initWithSource:js injectionTime:WKUserScriptInjectionTimeAtDocumentEnd forMainFrameOnly:YES]; // 根據(jù)生成的WKUserScript對(duì)象滔以,初始化WKWebViewConfiguration WKWebViewConfiguration *config = [[WKWebViewConfiguration alloc] init]; [config.userContentController addUserScript:script]; _webView = [[WKWebView alloc] initWithFrame:self.view.bounds configuration:config]; [_webView loadHTMLString:@"<head></head>![](http://upload-images.jianshu.io/upload_images/2478541-f20963ca887dbb33.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)"baseURL:nil];
[self.view addSubview:_webView];
五、本文Demo下載

?https://github.com/saitjr/WKWebViewSimpleDemo.git

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末氓拼,一起剝皮案震驚了整個(gè)濱河市你画,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌桃漾,老刑警劉巖坏匪,帶你破解...
    沈念sama閱讀 218,755評(píng)論 6 507
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異撬统,居然都是意外死亡适滓,警方通過查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,305評(píng)論 3 395
  • 文/潘曉璐 我一進(jìn)店門恋追,熙熙樓的掌柜王于貴愁眉苦臉地迎上來凭迹,“玉大人,你說我怎么就攤上這事苦囱⌒岢瘢” “怎么了?”我有些...
    開封第一講書人閱讀 165,138評(píng)論 0 355
  • 文/不壞的土叔 我叫張陵撕彤,是天一觀的道長鱼鸠。 經(jīng)常有香客問我,道長喉刘,這世上最難降的妖魔是什么瞧柔? 我笑而不...
    開封第一講書人閱讀 58,791評(píng)論 1 295
  • 正文 為了忘掉前任,我火速辦了婚禮睦裳,結(jié)果婚禮上造锅,老公的妹妹穿的比我還像新娘。我一直安慰自己廉邑,他們只是感情好哥蔚,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,794評(píng)論 6 392
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著蛛蒙,像睡著了一般糙箍。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上牵祟,一...
    開封第一講書人閱讀 51,631評(píng)論 1 305
  • 那天深夯,我揣著相機(jī)與錄音,去河邊找鬼。 笑死咕晋,一個(gè)胖子當(dāng)著我的面吹牛雹拄,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播掌呜,決...
    沈念sama閱讀 40,362評(píng)論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼滓玖,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了质蕉?” 一聲冷哼從身側(cè)響起势篡,我...
    開封第一講書人閱讀 39,264評(píng)論 0 276
  • 序言:老撾萬榮一對(duì)情侶失蹤,失蹤者是張志新(化名)和其女友劉穎模暗,沒想到半個(gè)月后禁悠,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 45,724評(píng)論 1 315
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡兑宇,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,900評(píng)論 3 336
  • 正文 我和宋清朗相戀三年绷蹲,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片顾孽。...
    茶點(diǎn)故事閱讀 40,040評(píng)論 1 350
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡祝钢,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出若厚,到底是詐尸還是另有隱情拦英,我是刑警寧澤,帶...
    沈念sama閱讀 35,742評(píng)論 5 346
  • 正文 年R本政府宣布测秸,位于F島的核電站疤估,受9級(jí)特大地震影響,放射性物質(zhì)發(fā)生泄漏霎冯。R本人自食惡果不足惜铃拇,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,364評(píng)論 3 330
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望沈撞。 院中可真熱鬧慷荔,春花似錦、人聲如沸缠俺。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,944評(píng)論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽壹士。三九已至磷雇,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間躏救,已是汗流浹背唯笙。 一陣腳步聲響...
    開封第一講書人閱讀 33,060評(píng)論 1 270
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人崩掘。 一個(gè)月前我還...
    沈念sama閱讀 48,247評(píng)論 3 371
  • 正文 我出身青樓尿庐,卻偏偏與公主長得像,于是被迫代替她去往敵國和親呢堰。 傳聞我的和親對(duì)象是個(gè)殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,979評(píng)論 2 355

推薦閱讀更多精彩內(nèi)容