图文混排三种境界

目标:显示富文本,包括文字、图片、链接等,图片需要点击预览,链接可以正常跳转。

境界一. 采用UILabel实现

使用方法:

NSAttributedString *attributedString = [[NSAttributedString alloc] initWithData:[content dataUsingEncoding:NSUnicodeStringEncoding] options:@{NSDocumentTypeDocumentAttribute: NSHTMLTextDocumentType} documentAttributes:nil error:nil];

contentLabel.attributedText = attributedString;

优点:使用简单,可以完美显示HTML格式的内容。
缺点:富文本渲染速度一般,很难实现图片预览和链接跳转。

境界二. 采用UIWebView或者WKWebView实现

使用方法:
方法1. [webView loadHTMLString:content baseURL:nil];
方法2. [webView loadRequest:[NSURL URLWithString:@"http://xxx"]];

图片预览:
- (void)webView:(WKWebView *)webView didFinishNavigation:(WKNavigation *)navigation {
    NSString *jsStr = @"function registerImageClickAction(){\
    var imgs=document.getElementsByTagName('img');\
    var length=imgs.length;\
    for(var i=0;i 0) {
    NSString* path = [requestURL.absoluteString substringFromIndex:[@"image-preview:" length]];
    path = [path stringByAddingPercentEscapesUsingEncoding:NSUTF8StringEncoding];
    //path 就是被点击图片的url
    int k = 0;
    for (int i = 0; i < self.imageMArray.count; i ++) {
        if ([self.imageMArray[i] isEqualToString:path]) {
            k = i;
            break;
        }
    }
    
    SDPhotoBrowserd *browser = [[SDPhotoBrowserd alloc] init];
    browser.imageCount = xxx; // 图片总数
    browser.currentImageIndex = k;
    browser.delegate = self;
    [browser show];
    
    decisionHandler(WKNavigationActionPolicyCancel);
 }
 decisionHandler(WKNavigationActionPolicyAllow);
}

优点:可以完美显示HTML格式内容;链接跳转、图片预览容易实现。
缺点:量级较重,性能一般,体验较差。

境界三. 采用CoreText实现

使用方法:参考巧神的三篇文章

  1. 基于 CoreText 的排版引擎:基础
    http://blog.devtang.com/2015/06/27/using-coretext-1/
  2. 基于 CoreText 的排版引擎:进阶
    http://blog.devtang.com/2015/06/27/using-coretext-2/
  3. 猿题库iOS客户端的技术细节(三):基于CoreText的排版引擎
    http://blog.devtang.com/2013/10/21/the-tech-detail-of-ape-client-3/

优点:可以完美显示HTML格式内容,而且渲染速度快,性能很不错!
缺点:链接跳转、图片预览等功能需要自己实现,实现难道中等,需要后台配合。

你可能感兴趣的:(图文混排三种境界)