iOS显示纯HTML代码并且修改HTML代码
由于后端返回的数据是存HTML代码,如下
我是消息内容
平时我们使用UIWebView
或者WKWebView
等控件,大多时候是传个网址调用网页,如下
UIWebView *web = [UIWebView new];
NSURLRequest *req = [NSURLRequest requestWithURL:[NSURL URLWithString:@"http://www.jianshu.com"]];
[web loadRequest:req];
如果遇到纯HTML代码的时候,其实系统也提供了方法
UIWebView * webView = [UIWebView new];
NSString *htmlString = @"测试
";
[webView loadHTMLString:htmlString baseURL:nil];
如果HTML中有图片,通过上面的方式,图片是无法显示出来的,因为HTML中的Image
标签是使用的相对路径,所以我们本地是无法直接加载的,要加载出图片也很简单,就是将上面的方法修改一下,如下
UIWebView * webView = [UIWebView new];
NSString *htmlString = @"测试
";
[webView loadHTMLString:htmlString baseURL:[NSURL URLWithString:XHBaseUrl]];
其中的XHBaseUrl
就是基地址,也就是拼接到src
前面的地址,如上写后,HTML中的src
中的图片地址就会变成http://www.xxx.com/Upload/Img/1.png
,这就成了相对地址了,就可以直接显示出来了.
经过上面的操作,我们已经可以直接将HTML纯代码显示在WebView
上了,也可以加载HTML中的图片,但是还几个问题
1、导航栏的Title
- 我们在
WebView
中要给导航栏设置Title大多都是使用如下代码,可以获取到HTML中的标题
self.title = [webView stringByEvaluatingJavaScriptFromString:@"document.title"];
但是像上文那种,后端就只返回个p标签或者Image标签的话,根本就获取不到标题,这就需要我们自己手动添加标题了
方法也有几种,第一种就是直接在push传值的时候将要显示的Title设置给下个页面就行了
UIWebView *web = [UIWebView new];
web.title = @"我的标题";
但是大多数人都会封装一下WebView
,所以导致及时像上面一样将Title传值,到下个页面也会没有标题,原因就是因为生命周期的问题
- (void)webViewDidFinishLoad:(UIWebView *)webView {
NSString *title = [webView stringByEvaluatingJavaScriptFromString:@"document.title"];
if (title.length > 10) {
title = [[title substringToIndex:9] stringByAppendingString:@"…"];
}
self.navigationItem.title = title;
}
我们设置标题大多都是在WebView加载完后再设置的标题,如果通过传值设置标题,等WebView加载完后没有获取到标题就会把之前的给覆盖掉了,导致标题也没有了。这样的话我们可以先来个简单的办法,如下
- (void)webViewDidFinishLoad:(UIWebView *)webView {
NSString *title = [webView stringByEvaluatingJavaScriptFromString:@"document.title"];
if (title.length > 10) {
title = [[title substringToIndex:9] stringByAppendingString:@"…"];
}
if (title.length == 0) {
title = self.title;
}
self.navigationItem.title = title;
}
我们在其中添加了一个if判断
if (title.length == 0) {
title = self.title;
}
如果没有获取到HTML的标题,就用我们传值过来的标题,这样一来,标题也算解决了
2、文字大小
- 当加载出HTML的时候,大家会发现文字很小,而且2个手指在屏幕上捏合是可以放大的,这时字体也会跟着变大,不可能用户每次为了看字都要捏合吧,那多麻烦,其实这个解决办法也很简单,而且还可以将上面的Title也一并解决,直接上代码
NSString *Title = @"我是标题";
NSString *Content = @"我是内容";
[NSString stringWithFormat:@" \n"
" \n"
"%@ \n"
""
" \n"
" \n"
"%@ \n"
"",Title,Content];
方法就是我们直接自己构建HTML代码,其中让字体正常适应的就是
这一句代码,这一件代码就可以适配手机屏幕
最后我们将方法提取封装一下
- (NSString *)HTMLAdapter:(NSString *)Content {
return [NSString stringWithFormat:@" \n"
" \n"
"%@ \n"
""
" \n"
" \n"
"%@ \n"
"",self,Content];
}
我是将其写成了NSString
的一个Category
使用的时候就直接
NSString *Title = @"我是标题";
NSString *Content = @"我是内容
";
UIWebView *webView = [UIWebView new];
[webView loadHTMLString:[Title HTMLAdapter:Content] baseURL:[NSURL URLWithString:XHBaseUrl]];
至此,收工,文中如有错误希望大家在评论中及时指出,谢谢!