iOS UIWebView简单用法

作者: Peak_One | 来源:发表于2016-05-20 18:04 被阅读4367次

前言

好久没有写简书了，突然感觉有点生疏。最近一直在思考人生，不知道何去何从。总之，就是头疼……好了，废话不多说，今天来记录一下UIWebView，随着H5的流行，UIWebView也火了起来，对于平时不怎么使用UIWebView的我来说，真该学习一下了。（正好，最近自己也在学习H5）,下来我给大家介绍一下OC与JS的交互，但是前提是，你得熟悉UIWebView。

UIWebView基本用法

UIWebView的基本用法都是一些很简单的东西，相信只要你会用UIButton，一般就能搞定UIWebView。

UIWebView加载

UIWebView提供了三种加载html界面的方法：

/**通过NSURLRequest去加载html界面**/
- (void)loadRequest:(NSURLRequest *)request;
/**加载html格式的字符串，其中的baseUrl下面会介绍**/
- (void)loadHTMLString:(NSString *)string baseURL:(nullable NSURL *)baseURL;
/**这种方式表示没见到过，我也不知道是什么，有兴趣的可以自己去查查**/
- (void)loadData:(NSData *)data MIMEType:(NSString *)MIMEType textEncodingName:(NSString *)textEncodingName baseURL:(NSURL *)baseURL;(*很少用*)

示例如下：

(void)loadRequest:(NSURLRequest *)request方法即可以去通过网络连接加载html资源，也可以去加载本地的html资源。
加载网络地址
NSURLRequest request =[NSURLRequest requestWithURL:[NSURL URLWithString:@"http://www.superqq.com"]];
[self.view addSubview:webView];
[webView loadRequest:request];
加载本地Html
NSString path = [[NSBundle mainBundle] pathForResource:@"swift" ofType:@"html"];
NSURL url = [NSURL fileURLWithPath:path];//创建URL
NSURLRequest request = [NSURLRequest requestWithURL:url];//创建NSURLRequest
[webView loadRequest:request];//加载

(void)loadHTMLString:(NSString *)string baseURL:(nullable NSURL *)baseURL方法一般用来加载本地的html界面。
NSString *localHTMLPageName = @"myPage";
NSString *path = [[NSBundle mainBundle] pathForResource:localHTMLPageName ofType:@"html"];

// 从html文件中读取html字符串
NSFileHandle *readHandle = [NSFileHandle fileHandleForReadingAtPath:path];

NSString *htmlString = [[NSString alloc] initWithData:
              [readHandle readDataToEndOfFile] encoding:NSUTF8StringEncoding];
// 或使用                 
// NSString *htmlString = [NSString stringWithContentsOfFile:path encoding:NSUTF8StringEncoding error:NULL];

// baseURL用来确定htmlString的基准地址，
// 相当于HTML的<base>标签的作用，定义页面中所有链接的默认地址。
[webView loadHTMLString:htmlString baseURL:[[NSBundle mainBundle] bundleURL]];

注意：baseURLbaseURL用来确定htmlString的基准地址，相当于HTML的<base>标签的作用，定义页面中所有链接的默认地址。具体查看W3C上的base标签。
baseURL是HTML字符串中引用到资源的查找路径，当HTML中没有引用外部资源时，可以指定为nil；若引用了外部资源(外部资源：除了html代码以外，界面中所有的图片，链接都属于外部资源)，一般情况下使用mainBundle的路径即可。在实际操作中，常常会出现「文本显示正常，图片无法显示」等情况，若HTML文本中引用外部资源都是使用相对路径，则出现这种问题的原因一般都是baseURL参数错误。

UIWebView的一些常用属性和方法（这部分东西转载自：http://www.jianshu.com/p/fbdb09b6b564）

**webView的代理**
@property (nullable, nonatomic, assign) id <UIWebViewDelegate> delegate;
**内置的scrollView**
@property (nonatomic, readonly, strong) UIScrollView       
*scrollView NS_AVAILABLE_IOS(5_0);
**URL请求**
@property (nullable, nonatomic, readonly, strong) NSURLRequest *request;
**是否缩放到适合屏幕大小**
@property (nonatomic) BOOL scalesPageToFit;
**执行javaScript操作**
- (nullable NSString *)stringByEvaluatingJavaScriptFromString:(NSString *)script;

加载属性

- (void)reload; //重新加载数据
- (void)stopLoading; //停止加载数据
@property (nonatomic, readonly, getter=isLoading) BOOL loading; //是否正在加载
- (void)goBack; //返回上一级
- (void)goForward; //跳转下一级
@property (nonatomic, readonly, getter=canGoBack) BOOL canGoBack; //能否返回上一级
@property (nonatomic, readonly, getter=canGoForward) BOOL canGoForward; //能否跳转下一级

多媒体属性

//YES，自动检测网页上的电话号码，单击可以拨打 
@property (nonatomic) BOOL detectsPhoneNumbers NS_DEPRECATED_IOS(2_0, 3_0);
//设置某些数据变为链接形式，这个枚举可以设置如电话号，地址，邮箱等转化为链接
@property (nonatomic) UIDataDetectorTypes dataDetectorTypes NS_AVAILABLE_IOS(3_0);
//设置是否使用内联播放器播放视频
@property (nonatomic) BOOL allowsInlineMediaPlayback NS_AVAILABLE_IOS(4_0); // iPhone Safari defaults to NO. iPad Safari defaults to YES
//设置视频是否自动播放
@property (nonatomic) BOOL mediaPlaybackRequiresUserAction NS_AVAILABLE_IOS(4_0); // iPhone and iPad Safari both default to YES
//设置音频播放是否支持ari play功能
@property (nonatomic) BOOL mediaPlaybackAllowsAirPlay NS_AVAILABLE_IOS(5_0); // iPhone and iPad Safari both default to YES
//设置是否将数据加载如内存后渲染界面
@property (nonatomic) BOOL suppressesIncrementalRendering NS_AVAILABLE_IOS(6_0); // iPhone and iPad Safari both default to NO
//设置用户交互模式
@property (nonatomic) BOOL keyboardDisplayRequiresUserAction NS_AVAILABLE_IOS(6_0);

iOS7.0 新特性

@property (nonatomic) UIWebPaginationMode paginationMode NS_AVAILABLE_IOS(7_0);
这个属性用来设置一种模式，当网页的大小超出view时，将网页以翻页的效果展示，枚举如下：
typedef NS_ENUM(NSInteger, UIWebPaginationMode) 
{ 
  UIWebPaginationModeUnpaginated, //不使用翻页效果 
  UIWebPaginationModeLeftToRight, //将网页超出部分分页，从左向右进行翻页 
  UIWebPaginationModeTopToBottom, //将网页超出部分分页，从上向下进行翻页 
  UIWebPaginationModeBottomToTop, //将网页超出部分分页，从下向上进行翻页 
  UIWebPaginationModeRightToLeft //将网页超出部分分页，从右向左进行翻页
} __TVOS_PROHIBITED;
//设置每一页的长度
@property (nonatomic) CGFloat pageLength NS_AVAILABLE_IOS(7_0);
//设置每一页的间距
@property (nonatomic) CGFloat gapBetweenPages NS_AVAILABLE_IOS(7_0);
//获取分页数
@property (nonatomic, readonly) NSUInteger pageCount NS_AVAILABLE_IOS(7_0);

@property (nonatomic) UIWebPaginationBreakingMode paginationBreakingMode NS_AVAILABLE_IOS(7_0);
typedef NS_ENUM(NSInteger, UIWebPaginationBreakingMode) 
{ 
  UIWebPaginationBreakingModePage,       
  UIWebPaginationBreakingModeColumn
} __TVOS_PROHIBITED;

iOS9.0新特性

//是否允许画中画播放
@property (nonatomic) BOOL allowsPictureInPictureMediaPlayback NS_AVAILABLE_IOS(9_0);
 //A Boolean value that determines whether pressing on a link displays a preview of the destination for the link.
This property is available on devices that support 3D Touch. Default value is NO.
@property (nonatomic) BOOL allowsLinkPreview NS_AVAILABLE_IOS(9_0); //

UIWebView的代理方法

//设置代理，同时实现UIWebViewDelegate
webView.delegate = self;

//代理方法
- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType
{
/**返回YES，进行加载。通过UIWebViewNavigationType可以得到请求发起的原因
如果为webView添加了delegate对象并实现该接口，那么在webView加载任何一个frame之前都会delegate对象的该方法，该方法的返回值用以控制是否允许加载目标链接页面的内容，返回YES将直接加载内容，NO则反之。并且UIWebViewNavigationType枚举，定义了页面中用户行为的分类，包括

UIWebViewNavigationTypeLinkClicked，用户触击了一个链接。
UIWebViewNavigationTypeFormSubmitted，用户提交了一个表单。
UIWebViewNavigationTypeBackForward，用户触击前进或返回按钮。
UIWebViewNavigationTypeReload，用户触击重新加载的按钮。
UIWebViewNavigationTypeFormResubmitted，用户重复提交表单
UIWebViewNavigationTypeOther，发生其它行为。
*/
    return YES;
}

- (void)webViewDidStartLoad:(UIWebView *)webView
{
    //开始加载，可以加上风火轮（也叫菊花）
}

- (void)webViewDidFinishLoad:(UIWebView *)webView
{
    //完成加载
}

- (void)webView:(UIWebView *)webView didFailLoadWithError:(NSError *)error
{
    //加载出错
}

禁用页面滚动弹跳

webView.scrollView.bounces = NO ;

移除滚动后�的外边阴影

UIWebView包含一个scrollView组件，用来将关联web内容实现滚动效果，页面滚动后的UIWebView的面板周围会出现阴影效果，该效果是在四周添加UIImageView实现的，因此移除这种阴影效果的代码如下：

UIScrollView *scrollView = webView.scrollView;

for (int i = 0; i < scrollView.subviews.count ; i++) {
    UIView *view = [scrollView.subviews objectAtIndex:i];
    if ([view isKindOfClass:[UIImageView class]]) {
        view.hidden = YES ;
    }
}

处理webView展示txt文档乱码问题

if ([theType isEqualToString:@".txt"])
{
     //txt分带编码和不带编码两种，带编码的如UTF-8格式txt，不带编码的如ANSI格式txt
     //不带的，可以依次尝试GBK和GB18030编码
     NSString* aStr = [[NSString alloc] initWithData:attachmentData encoding:NSUTF8StringEncoding];
     if (!aStr) {
     //用GBK进行编码
     aStr=[[NSString alloc] initWithData:attachmentData encoding:0x80000632];
     }
     if (!aStr) {
     //用GBK编码不行,再用GB18030编码 
     aStr=[[NSString alloc] initWithData:attachmentData encoding:0x80000631];
     }
    //通过html语言进行排版 
    NSString* responseStr = [NSString stringWithFormat: 
                @"<HTML>" 
                   "<head>"
                   "<title>Text View</title>" 
                   "</head>" 
                  "<BODY>" 
                  "<pre>" "%@" "/pre>" 
                  "</BODY>" 
                  "</HTML>", aStr]; 
    [attachmentWebView loadHTMLString:responseStr baseURL:[NSURL fileURLWithPath:[[NSBundle mainBundle] bundlePath]]]; return; 
  }

UIWebView的整个流程

1、 Loading a local PDF file into the web view
- (void)viewDidLoad { 
  [super viewDidLoad]; 
  //从本地加载 
  NSString *thePath = [[NSBundle mainBundle] pathForResource:@"iPhone_User_Guide" ofType:@"pdf"];
  if (thePath) { 
  NSData *pdfData = [NSData dataWithContentsOfFile:thePath];       
  [(UIWebView *)self.view loadData:pdfData MIMEType:@"application/pdf" textEncodingName:@"utf-8" baseURL:nil]; 
  }
  //从网络加载
  [self.myWebView loadRequest:[NSURLRequest requestWithURL:[NSURL URLWithString:@"http://www.apple.com/"]]];}
2、The web-view delegate managing network loading

- (void)webViewDidStartLoad:(UIWebView *)webView{
   // starting the load, show the activity indicator in the status bar 
  [UIApplication sharedApplication].networkActivityIndicatorVisible = YES;
  } 
- (void)webViewDidFinishLoad:(UIWebView *)webView{ 
   // finished loading, hide the activity indicator in the status bar 
  [UIApplication sharedApplication].networkActivityIndicatorVisible = NO;
  } 
- (void)webView:(UIWebView *)webView didFailLoadWithError:(NSError *)error{ 
  // load error, hide the activity indicator in the status bar 
  [UIApplication sharedApplication].networkActivityIndicatorVisible = NO; 
  // report the error inside the webview 
  NSString* errorString = [NSString stringWithFormat: @"<html><center><font size=+5 color='red'>An error occurred:<br>%@</font></center></html>", error.localizedDescription];
  [self.myWebView loadHTMLString:errorString baseURL:nil];}
3、Stopping a load request when the web view is to disappear
- (void)viewWillDisappear:(BOOL)animated{ if ( [self.myWebView loading] ) {
  [self.myWebView stopLoading]; } self.myWebView.delegate = nil; 
  // disconnect the delegate as the webview is hidden     
  [UIApplication sharedApplication].networkActivityIndicatorVisible = NO;
  }
 /************/引用自苹果官方文档（displaying web content）

参考博客：

http://www.jianshu.com/p/fbdb09b6b564
http://zhangbuhuai.com/2015/06/16/UIWebView-loading-local-html/
http://my.oschina.net/u/557242/blog/70836
https://m.oschina.net/blog/147507