UIWebView的间距和加载iFrame的坑

    xiaoxiao2022-06-30  70

    UIWebView的间距和加载iFrame的坑

    最近换了工作,新的项目中遇到了很多关于UIWebView的坑,所以就在这里简单说一下,以便以后填坑:

    HTML标签加载Style配置和Font变换iFrame的设置和停止播放UITableView中的UIWebView

    简单介绍

    UIWebView是iOS中用来显示网页(H5页面)的控件,一般使用loadHTMLString(_:baseURL:)和loadRequest(_:)这两个方法来显示一个h5页面,简单地说就是一个嵌入到app中的Safari页面;一般可以用来做一些活动页面,因为在时间一到可以立刻修改服务器上的数据,从而禁止进入,H5页面修改起来也比原生app页面要好修改得多。

    HTML标签加载

    这里的HTML标签加载,是指当app需要去加载一些HTML的标签,比如<p>that's a simple</p>这样的标签时,所需要做的一些操作,主要是使用UIWebView的loadHTMLString(_:baseURL:)来载入HTML标签,这里的HTML标签以NSString的形式作为传参,实际上我们是可以直接把这样的NSString直接传入的,UIWebView也是可以很好地处理,比如:

    NSString *HTMLStr = @"section><span style=\"margin: 0px; padding: 0px; color: rgb(198, 7, 7); box-sizing: border-box;\">that's an simple too</span>"; [webView loadHTMLString:HTMLStr baseURL:nil];

    这样直接的处理,UIWebView也是会加载在String里面声明的style的,但是在遇到某些style,比如万恶的微软雅黑……就会导致显示的界面出现问题,接下来马上就开始介绍如何给UIWebView加上style

    Style配置和Font变换

    因为在UIWebView里面加载的HTML实际上是一个NSString,所以给加上style的方法有2种:拼接<head></head>和指定UIWebView加载的CSS文件,这两种方法都可以用来设置WebView的style。

    拼接

    所谓拼接,指的是在执行loadHTMLString(_:baseURL:)之前,把局部的HTML拼接成完整的,具有head、body的HTML,这样的话在拼接的时候,就能够像构建HTML页面一样进行样式的调整,下面给出对应代码:

    NSString *fontStyle = [[NSString alloc] initWithFormat:@"body {font-family: \"%@\"; font-size: 3; margin:0; padding:0; }\n",[UIFont systemFontOfSize:12].fontName]; NSString *HTML = [[NSString alloc] initWithFormat:@"%@%@%@%@%@", @"<!DOCTYPE html>" "<html lang=\"ja\">" "<head>" "<meta charset=\"UTF-8\">" "<style type=\"text/css\">" "iframe{" "margin:0;" "padding:0;" "}" ".n-content{" "padding: 10px 15px;" "font-size: 18px;" "line-height: 2.5;" "overflow-x: hidden;" "}" ,fontStyle, @"</style>" "</head>" "<body id=\"page\">" "<div class=\"n-content\">" ,originalHTMLString,@"</div></body></html>"];

    简单地说,就是拼接补全HTML内容,把之前的局部HTML代码用一个div给包括起来,那就可以方便地使用Style了。

    iFrame的设置和停止播放

    在UIWebView中有的时候需要播放一些iframe视频,现在网上的资料,大部分对iframe的介绍都是通过youtubePlayer来进行播放,坦白说,这非常好用,完全可以作为内嵌的一款YouTube视频播放器,但是因为需求,这里我需要去播放一些挂在腾讯上的iframe,那就比较蛋疼了。。。。

    首先还是一样,通过拼接来进行HTML代码的补全,因为一般API所返回的都是iframe中的src,

    NSString *head = [NSString stringWithFormat:@"<iframe class=\"video_iframe\" type=\"text/html\" width=\"100%%\" height=\"100%%\" margin = 0; padding = 0 src=\""]; NSString *foot = @"\" frameborder=\"0\" allowfullscreen = 0></iframe>"; NSString *imageHTML = [NSString stringWithFormat:@"%@%@%@", head,[tempDict objectForKey:@"src"],foot];

    比较蛋疼的一点是,使用iframe进行播放,在停止的时候需要加载一个空的html,而不是去进行webView的stoploading,因为在根本上,iframe显示出来的时候,loading就已经结束了。

    [_videoWebView loadHTMLString:@"" baseURL:nil];

    UITableView中的UIWebView

    在TableViewCell中的webView跟其他控件没什么不同,只要在- (void)tableView:(UITableView )tableView willDisplayCell:(UITableViewCell )cell forRowAtIndexPath:(NSIndexPath *)indexPath里面进行webView的加载就好。

    转载请注明原文地址: https://ju.6miu.com/read-1126071.html

    最新回复(0)