UIWebView 详解(1)

创建

githubdemo: https://github.com/wangjinshan/JSWebDemo
UIWebView继承自UIView 是用来加载网页的类,可以简单理解成就是一个view
完整的创建UIWebView
1加载网络HTML数据

self.webView = [[UIWebView alloc] initWithFrame:self.view.frame];
    NSURLRequest *request =[NSURLRequest requestWithURL:[NSURL URLWithString:@"http://lianghui.huanqiu.com/2017/roll/2017-03/10304840.html"]];
    [self.view addSubview: _webView];
    [_webView loadRequest:request];

2, 加载本地的HTML数据

    NSString *path =[[NSBundle mainBundle]pathForResource:@"JSShareSDKDemo" ofType:@"html"];
    NSURL *url =[NSURL URLWithString:path];
    NSURLRequest *request =[NSURLRequest requestWithURL:url];
    self.webView =[[UIWebView alloc]initWithFrame:self.view.frame];
    [self.webView loadRequest:request];
    [self.view addSubview:self.webView];

加载

加载的方式给了以下三种

/**通过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资源

   //    加载网络html
    NSURLRequest *request =[NSURLRequest requestWithURL:[NSURL URLWithString:@"http://shenzoom.com"]];
    [self.myWebview loadRequest:request];

(void) loadHTMLString:(NSString )string baseURL:(nullable NSURL )baseURL方法一般用来加载本地的html界面

-(void)loadHtmlWithString
{
//    加载css
    NSURL *cssPath = [[NSBundle mainBundle]URLForResource:@"ShareSDK" withExtension:@"css"];
//    创建css标签
    NSString *css = [NSString stringWithFormat:@"",cssPath,@"\"stylesheet\""];
    NSLog(@"--css--%@",css);
    NSString *html =[NSString stringWithFormat:@"%@网页中的文字
     ",css,css];
    [self.myWebview loadHTMLString:html baseURL:nil];
}

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

属性

//    **webView的代理**
    @property (nullable, nonatomic, assign) id  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;

@property (nonatomic) BOOL scalesPageToFit; 是否允许用户对网页进行缩放,yes是允许,就是控制双手放到屏幕上是否可以放大当前网页的操作控制

加载属性

- (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; //能否跳转下一级

多媒体属性

   self.myWebview.scalesPageToFit = YES;    // 是否允许用户对网页进行缩放,yes是允许
    self.myWebview.dataDetectorTypes =  UIDataDetectorTypePhoneNumber;  // 检测网站中电话号码
    self.myWebview.allowsInlineMediaPlayback = YES;                //设置是否使用内联播放器播放视频
    self.myWebview.mediaPlaybackRequiresUserAction = true;   //设置视频是否自动播放
    self.myWebview.mediaPlaybackAllowsAirPlay = true;            //设置音频播放是否支持ari play功能
    self.myWebview.suppressesIncrementalRendering = true;         //设置是否将数据加载如内存后渲染界面
    self.myWebview.keyboardDisplayRequiresUserAction = YES;  //设置用户交互模式
//            self.myWebview.paginationMode = UIWebPaginationModeLeftToRight; //当网页的大小超出view时，将网页以翻页的效果展示
    //        self.myWebview.pageLength = 400;
    self.myWebview.allowsPictureInPictureMediaPlayback = YES; //是否允许画中画播放,目前ipad支持iPhone不支持
    self.myWebview.allowsLinkPreview = YES; //长按链接是否支持预览（支持3D Touch的设备）
    self.myWebview.scrollView.bounces = false;  //禁用页面滚动弹跳
    //      移除外部的阴影
    self.myWebview.scrollView.backgroundColor = [UIColor redColor];
    self.myWebview.paginationBreakingMode = UIWebPaginationBreakingModeColumn;
    /*
     UIWebPaginationBreakingModePage,//默认设置是这个属性，CSS属性以页样式
     UIWebPaginationBreakingModeColumn//当UIWebPaginationBreakingMode设置这个属性的时候，这个页面内容CSS属性以column-break 代替page-breaking样式
     */
    UIScrollView *scrollView = self.myWebview.scrollView;

具体详解:
1, self.myWebview.dataDetectorTypes = UIDataDetectorTypePhoneNumber; // 检测网站中电话号码,单击可以进行拨打电话 ,其他枚举值类似

phone.png

2, self.myWebview.allowsInlineMediaPlayback = YES; //设置是否使用内联播放器播放视频

lol.png

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);
@property (nonatomic) BOOL allowsLinkPreview NS_AVAILABLE_IOS(9_0); //

画中画的界面补充

ipad.jpeg

UIWebView的代理方法 UIWebViewDelegate

self.myWebview.delegate =self;

//代理方法
- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType
{
    /**返回YES，进行加载。通过UIWebViewNavigationType可以得到请求发起的原因
     如果为webView添加了delegate对象并实现该接口，那么在webView加载任何一个frame之前都会delegate对象的该方法，该方法的返回值用以控制是否允许加载目标链接页面的内容，返回YES将直接加载内容，NO则反之。并且UIWebViewNavigationType枚举，定义了页面中用户行为的分类，包括;
     UIWebViewNavigationTypeLinkClicked，0 用户触击了一个链接。
     UIWebViewNavigationTypeFormSubmitted，1 用户提交了一个表单。
     UIWebViewNavigationTypeBackForward，2, 用户触击前进或返回按钮。
     UIWebViewNavigationTypeReload，3, 用户触击重新加载的按钮。
     UIWebViewNavigationTypeFormResubmitted，4,用户重复提交表单
     UIWebViewNavigationTypeOther，5, 发生其它行为。
     */
//    NSLog(@"----request-------%@",request);
    NSLog(@"----navigationType-------%ld",(long)navigationType);
    return YES;
}
- (void)webViewDidStartLoad:(UIWebView *)webView
{
    //开始加载，可以加上风火轮（也叫菊花）
}

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

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

完美结束对 UIWebView 的认识