iOS UILabel與UITextView加載圖片富文本點(diǎn)擊看大圖

背景:

功能:回復(fù)列表
要求:界面按UI給的效果圖
收到的數(shù)據(jù):帶各種標(biāo)簽的html格式的字符串(包括web端的表情圖片)

如果只是想簡(jiǎn)單的加載HTML(包括圖片),點(diǎn)擊這里。

解決方案:UILabelUITextView加載富文本取代帶圖片的HTML

  1. 過(guò)濾掉 web端 回復(fù)內(nèi)容 已知 的所有標(biāo)簽
NSString *text = allHtmlText;
//NSLog(@"這是評(píng)論的內(nèi)容%@",text);
text = [text stringByReplacingOccurrencesOfString:@"<p>" withString:@""];
text = [text stringByReplacingOccurrencesOfString:@"</p>" withString:@"\n"];
text = [text stringByReplacingOccurrencesOfString:@"<u>" withString:@""];
text = [text stringByReplacingOccurrencesOfString:@"</u>" withString:@""];
text = [text stringByReplacingOccurrencesOfString:@"<strong>" withString:@""];
text = [text stringByReplacingOccurrencesOfString:@"</strong>" withString:@""];
text = [text stringByReplacingOccurrencesOfString:@"<em>" withString:@""];
text = [text stringByReplacingOccurrencesOfString:@"</em>" withString:@""];

2、創(chuàng)建attributedString并獲取其中的圖片URL及其范圍

NSMutableAttributedString *string = [[NSMutableAttributedString alloc] initWithString:text];
[self getImageurlFromHtml:string];//具體實(shí)現(xiàn)放在文章后面
  1. 循環(huán)遍歷創(chuàng)建圖片附件 并 替換原有范圍的字符串

    for (int i= 0 ; i< self.rangeArr.count; i++) {
        // 創(chuàng)建圖片圖片附件
        NSTextAttachment *attach = [[NSTextAttachment alloc] init];
        
        NSString *imageUrlStr = self.imageurlArray[i];
        
        NSURL *url = [NSURL URLWithString:imageUrlStr];
        
        NSData *imageData = [NSData dataWithContentsOfURL:url];
        
        attach.image = [UIImage imageWithData:imageData];
        
        attach.bounds = CGRectMake(0, 0, 15, 15);
        
        NSAttributedString *attachString = [NSAttributedString attributedStringWithAttachment:attach];
        
        // 點(diǎn)擊圖片跳轉(zhuǎn)到safari
        NSMutableAttributedString *maImageStr = [[NSMutableAttributedString alloc] initWithAttributedString:attachString];
        
        [maImageStr addAttribute:NSLinkAttributeName value:self.imageurlArray[i] range:NSMakeRange(0, maImageStr.length)];
        
        NSString *rangeStr = self.rangeArr[i];
        
        NSRange range = NSRangeFromString(rangeStr);
        
        if (i>0) {
            NSInteger length = 0;
            for (int j = 0; j<i; j++) {
                NSString *rangeStr0 = self.rangeArr[j];
                
                NSRange range0 = NSRangeFromString(rangeStr0);
                length = length + range0.length;
                NSLog(@"\nlocation:%ld\nlength:%ld\nstringlength:%ld",range0.location,range0.length,string.length);
            }
            
            range.location = range.location - length + i;
        }
        //創(chuàng)建NSMutableParagraphStyle實(shí)例
        NSMutableParagraphStyle *style = [[NSMutableParagraphStyle alloc]init];
        //設(shè)置行距
        [style setLineSpacing:2.5];
        //根據(jù)給定長(zhǎng)度與style設(shè)置attStr式樣
        [string addAttribute:NSParagraphStyleAttributeName value:style range:NSMakeRange(0, string.length)];
        [string replaceCharactersInRange:range withAttributedString:maImageStr];
        
    }

4、設(shè)置UI給定的樣式

    self.textView.scrollEnabled = NO;
    [string addAttribute: NSForegroundColorAttributeName value: [UIColor orangeColor] range: NSMakeRange(0, string.length)];
    self.textView.attributedText = string
  • 獲取圖片URL方法
- (NSArray *) getImageurlFromHtml:(NSMutableAttributedString *) webString
{
    if (webString.length==0) {
        return nil;
    }
    NSString *webStr  = [NSString stringWithFormat:@"%@",webString];
    self.imageurlArray = [NSMutableArray arrayWithCapacity:1];
    self.rangeArr = [NSMutableArray arrayWithCapacity:1];
    
    //標(biāo)簽匹配
    NSString *parten = @"<img(.*?)>";
    NSError* error = NULL;
    NSRegularExpression *reg = [NSRegularExpression regularExpressionWithPattern:parten options:0 error:&error];
    
    NSArray* match = [reg matchesInString:webStr options:0 range:NSMakeRange(0, [webString length] - 1)];
    
    for (NSTextCheckingResult * result in match) {
        
        //過(guò)去數(shù)組中的標(biāo)簽
        NSRange range = [result range];
        [self.rangeArr addObject:NSStringFromRange(range)];
        NSString * subString = [webStr substringWithRange:range];
        
        
        //從圖片中的標(biāo)簽中提取ImageURL
        NSRegularExpression *subReg = [NSRegularExpression regularExpressionWithPattern:@"http://(.*?)\"" options:0 error:NULL];
        NSArray* match = [subReg matchesInString:subString options:0 range:NSMakeRange(0, [subString length] - 1)];
        NSTextCheckingResult * subRes = match[0];
        NSRange subRange = [subRes range];
        subRange.length = subRange.length -1;
        NSString * imagekUrl = [subString substringWithRange:subRange];
        
        //將提取出的圖片URL添加到圖片數(shù)組中
        [self.imageurlArray addObject:imagekUrl];
    }
    
    return self.imageurlArray;
}

點(diǎn)個(gè)贊或者小紅心再走吧 ^ - ^
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • Spring Cloud為開發(fā)人員提供了快速構(gòu)建分布式系統(tǒng)中一些常見(jiàn)模式的工具(例如配置管理,服務(wù)發(fā)現(xiàn),斷路器,智...
    卡卡羅2017閱讀 136,545評(píng)論 19 139
  • HTML標(biāo)簽解釋大全 一、HTML標(biāo)記 標(biāo)簽:!DOCTYPE 說(shuō)明:指定了 HTML 文檔遵循的文檔類型定義(D...
    米塔塔閱讀 3,527評(píng)論 1 41
  • WebSocket-Swift Starscream的使用 WebSocket 是 HTML5 一種新的協(xié)議。它實(shí)...
    香橙柚子閱讀 24,735評(píng)論 8 183
  • 一個(gè)正常的普通的媽媽,會(huì)哭、會(huì)笑、會(huì)鬧、也會(huì)怕,情緒正常表現(xiàn),不會(huì)有太多壓抑和掩飾。一個(gè)正常的普通人最基本的情緒就...
    欣欣棒棒糖閱讀 338評(píng)論 0 0
  • “所以我要教育教育他?!? “不用這么著急?!卑酥刈幼ё×苏逊虻母觳?,“等安穩(wěn)下來(lái)再說(shuō),好不好?孩子也受了打...
    叨叨叨神經(jīng)閱讀 256評(píng)論 0 0

友情鏈接更多精彩內(nèi)容