前言
iOS中有很多需求是要求來展示網頁的內容的,當然系統有現有的方法供我們調用,但是有時候還是達不到我們的需求,
下面我們就談談的iOS中展示網頁的幾種方法的利與弊吧
第一種方法:(safari
)
可以調用自帶瀏覽器safari
- 優點:自帶很多功能(進度條,刷新,前進,倒退等等功能)
- 缺點:如果調用
url
的時候,必須跳出當前應用
調用自帶瀏覽器safari方法
[[UIApplication sharedApplication] openURL:[NSURL URLWithString:@"http://www.lxweimin.com/writer#/notebooks/2126639/notes/4211543/preview"]];
第二種方法(UIWebView
)
- 沒有功能 ,在當前應用打開網頁,并且有safari,自己實現,UIWebView不能實現進度條
UIWebView的初始化和三種加載方式
- 1.第一種
- (void)loadRequest:(NSURLRequest *)request;
這是加載網頁最常用的一種方式,通過一個網頁URL來進行加載,這個URL可以是遠程的也可以是本地的,例如我加載百度的主頁
UIWebView * view = [[UIWebView alloc]initWithFrame:self.view.frame];
[view loadRequest:[NSURLRequest requestWithURL:[NSURL URLWithString:@"http://www.baidu.com"]]];
[self.view addSubview:view];
- 2.第二種
- (void)loadHTMLString:(NSString *)string baseURL:(NSURL *)baseURL;
這個方法需要將httml文件讀取為字符串,其中baseURL是我們自己設置的一個路徑,用于尋找html文件中引用的圖片等素材。 - 3.第三種
- (void)loadData:(NSData *)data MIMEType:(NSString *)MIMEType textEncodingName:(NSString *)textEncodingName baseURL:(NSURL *)baseURL;
這個方式使用的比較少,但也更加自由,其中data是文件數據,MIMEType是文件類型,textEncodingName是編碼類型,baseURL是素材資源路徑。
第三種(SFSafariViewController
)
- 專門用來展示網頁 需求:即想要在當前應用展示網頁,又想要safari功能 iOS9才能使用
- 注意:需要導入
#import <SafariServices/SafariServices.h>
- 在當前App中使用Safari的UI框架展現Web內容,包括相同的地址欄,工具欄等,類似一個內置于App的小型Safari
- 這是一個特殊的View Controller,而不是一個單獨的 View,和前面兩個的區別
- 共享Safari的一些便利特性,包括:相似的用戶體驗,和Safari共享Cookie,iCloud Web表單數據,密碼、證書自動填充,Safari閱讀器(Safari Reader
- 可定制性比較差,甚至連地址欄都是不可編輯的,只能在init的時候,傳入一個URL來指定網頁的地址只能用來展示單個頁面,并且有一個完成按鈕用來退出
具體用法
在點擊事件中(記得設置代理,后面在代理方法中做事情)
SFSafariViewController *sfViewControllr = [[SFSafariViewController alloc] initWithURL:[NSURL URLWithString:urlString]];
sfViewControllr.delegate = self;
[self presentViewController:sfViewControllr animated:YES completion:^{
//...
}];
Done 按鈕
- (void)safariViewControllerDidFinish:(nonnull SFSafariViewController *)controller{
[controller dismissViewControllerAnimated:YES completion:nil];
}
第四種(WKWebView
)
這中方法是大多開發者選擇的,是對于UIWebView升級版本,添加功能,可以監聽進度,實現進度條功能,還可以做一系列的緩存
- 注意點:首先用的時候要注意```導入#import <WebKit/WebKit.h>``
創建方法
首先用個屬性來強引用這個webView
@interface TestWebViewController ()
@property (weak, nonatomic) IBOutlet WKWebView *webView;
@end
WKWebView *webView = [[WKWebView alloc] init];
_webView = webView;
[self.contentView addSubview:webView];
// 展示網頁
NSURLRequest *request = [NSURLRequest requestWithURL:_url];
[webView loadRequest:request];
控制網頁的前進
[self.webView goForward];
控制網頁的后退
[self.webView goBack];
控制網頁的刷新
[self.webView goForward];
自定義實現Safari的類似功能:
可以自己創建一個控件Progress放在導航欄的下面,然后初始化的時候使progress = 0;然后通過```KVO``監聽webView中各個屬性的變化,從而空時前進、后退這些按鈕的編輯狀態
// KVO監聽屬性改變
/*
Observer:觀察者
KeyPath:觀察webView哪個屬性
options:NSKeyValueObservingOptionNew:觀察新值改變
KVO注意點.一定要記得移除
*/
// canGoBack 是否可以回退
[webView addObserver:self forKeyPath:@"canGoBack" options:NSKeyValueObservingOptionNew context:nil];
// canGoForward 是否可以前進
[webView addObserver:self forKeyPath:@"canGoForward" options:NSKeyValueObservingOptionNew context:nil];
// title 網頁標題
[webView addObserver:self forKeyPath:@"title" options:NSKeyValueObservingOptionNew context:nil];
// 進度條
[webView addObserver:self forKeyPath:@"estimatedProgress" options:NSKeyValueObservingOptionNew context:nil];
KVO一定要移除
可以及時的改變前進、后退、進度條等的狀態
- (void)dealloc{
[self.webView removeObserver:self forKeyPath:@"canGoBack"];
[self.webView removeObserver:self forKeyPath:@"title"];
[self.webView removeObserver:self forKeyPath:@"canGoForward"];
[self.webView removeObserver:self forKeyPath:@"estimatedProgress"];
}
只要觀察對象屬性有新值就會調用
- (void)observeValueForKeyPath:(NSString *)keyPath ofObject:(id)object change:(NSDictionary<NSString *,id> *)change context:(void *)context{
self.backItem.enabled = self.webView.canGoBack;
self.forwardItem.enabled = self.webView.canGoForward;
self.title = self.webView.title;
self.progressView.progress = self.webView.estimatedProgress;
self.progressView.hidden = self.webView.estimatedProgress >= 1;
}
這樣就可以完美實現網頁加載功能,還可以自定義網頁的顯示樣式,有進度條,前進,后退刷新功能,完全可以在項目中封裝一個通用的webView,可謂是一勞永逸