iOS- 富文本

iOS开发中经常会遇到一些图文混排的情况,特别是在微博类应用的开发过程中经常会遇到各种表情,各种链接的解析。笔者在实践开发中经历了几次这种类型的开发,由最开始的利用WebView进行布局到最后利用富文本进行布局,对该部分的开发积累了一定的经验,现对富文本与正则表达式混用实现图文混排进行总结:

一.富文本

     WebView虽然也可以实现图文混排的效果,但是在使用的时候比较复杂,而且WebVIew的内存泄漏相当明显,使用不好反而得补偿失。现在很多的新闻类App都采用自己写的富文本进行图文混排。在很多情况下,富文本表现予外的是一个Label,将要显示的内容通过正则等封装成HTML字符串,然后显示在界面上,

下面就是按照步骤实现这一功能:

(1)先下载已经封装好的富文本标签类RCLabel(http://www.okbase.net/file/item/20694)

    该类是由一牛人封装好的用于实现图文混排的富文本类,在下载下来的源代码中可以看到其用法,但是这里有一个较为复杂的问题是你每次都需要手动将你要显示的内容封装成HTML格式的文本,这个过程相当繁琐而且容易出错,所以我在这个基础上进行了改进,将封装HTML的方法通过正则表达式独立开来,这样就实现了RCLabel与正则实现图文混排,以下是代码:

     将字符串转化成HTML的正则如下:


     .h头文件

     

[html]  view plain copy
  1.  #import <Foundation/Foundation.h>  
  2.   
  3.   
  4. @interface HtmlString : NSString  
  5.   
  6.   
  7. + (NSString *)transformString:(NSString *)originalStr;  
  8.   
  9.   
  10. @end  

     .m文件

[html]  view plain copy
  1.  #import "HtmlString.h"  
  2.   
  3. #import <Foundation/NSObjCRuntime.h>  
  4.   
  5. #import "RegexKitLite.h"  
  6.   
  7.   
  8. @implementation HtmlString  
  9.   
  10.   
  11. + (NSString *)transformString:(NSString *)originalStr  
  12.   
  13. {  
  14.   
  15.     NSString *text = originalStr;  
  16.   
  17.       
  18.   
  19.     //解析http://短链接  
  20.   
  21.     NSString *regex_http =@"http(s)?://([a-zA-Z|\\d]+\\.)+[a-zA-Z|\\d]+(/[a-zA-Z|\\d|\\-|\\+|_./?%&=]*)?";//http://短链接正则表达式  
  22.   
  23.     NSArray *array_http = [text componentsMatchedByRegex:regex_http];  
  24.   
  25.       
  26.   
  27.     if ([array_http count]) {  
  28.   
  29.         for (NSString *strin array_http) {  
  30.   
  31.             NSRange range = [text rangeOfString:str];  
  32.   
  33.             NSString *funUrlStr = [NSStringstringWithFormat:@"<a href=%@>%@</a>",str, str];  
  34.   
  35.             text = [text stringByReplacingCharactersInRange:NSMakeRange(range.location, str.length)withString:funUrlStr];  
  36.   
  37.         }  
  38.   
  39.     }  
  40.   
  41.   
  42.     //解析@  
  43.   
  44.     NSString *regex_at =@"@[\\u4e00-\\u9fa5\\w\\-]+";//@的正则表达式  
  45.   
  46.     NSArray *array_at = [text componentsMatchedByRegex:regex_at];  
  47.   
  48.     if ([array_at count]) {  
  49.   
  50.         NSMutableArray *test_arr = [[NSMutableArrayalloc]init];  
  51.   
  52.         for (NSString *strin array_at) {  
  53.   
  54.             NSRange range = [text rangeOfString:str];  
  55.   
  56.             if (![test_arr containsObject:str]) {  
  57.   
  58.                 [test_arr addObject:str];  
  59.   
  60.                 NSString *funUrlStr = [NSStringstringWithFormat:@"<a href=%@>%@</a>",str, str];  
  61.   
  62.                 text = [text stringByReplacingCharactersInRange:NSMakeRange(range.location, [str length]) withString:funUrlStr];  
  63.   
  64.             }  
  65.   
  66.         }  
  67.   
  68.         [test_arr release];  
  69.   
  70.     }  
  71.   
  72.       
  73.   
  74.       
  75.   
  76.     //解析&  
  77.   
  78.     NSString *regex_dot =@"\\$\\*?[\u4e00-\u9fa5|a-zA-Z|\\d]{2,8}(\\((SH|SZ)?\\d+\\))?";//&的正则表达式  
  79.   
  80.     NSArray *array_dot = [text componentsMatchedByRegex:regex_dot];  
  81.   
  82.     if ([array_dot count]) {  
  83.   
  84.         NSMutableArray *test_arr = [[NSMutableArrayalloc]init];  
  85.   
  86.         for (NSString *strin array_dot) {  
  87.   
  88.             NSRange range = [text rangeOfString:str];  
  89.   
  90.             if (![test_arr containsObject:str]) {  
  91.   
  92.                 [test_arr addObject:str];  
  93.   
  94.                 NSString *funUrlStr = [NSStringstringWithFormat:@"<a href=%@>%@</a>",str, str];  
  95.   
  96.                 text = [text stringByReplacingCharactersInRange:NSMakeRange(range.location, [str length]) withString:funUrlStr];  
  97.   
  98.             }  
  99.   
  100.         }  
  101.   
  102.         [test_arr release];  
  103.   
  104.     }  
  105.   
  106.   
  107.     //解析话题  
  108.   
  109.     NSString *regex_pound = @"#([^\\#|.]+)#";//话题的正则表达式  
  110.   
  111.     NSArray *array_pound = [text componentsMatchedByRegex:regex_pound];  
  112.   
  113.       
  114.   
  115.     if ([array_pound count]) {  
  116.   
  117.         for (NSString *strin array_pound) {  
  118.   
  119.             NSRange range = [text rangeOfString:str];  
  120.   
  121.             NSString *funUrlStr = [NSStringstringWithFormat:@"<a href=%@>%@</a>",str, str];  
  122.   
  123.             text = [text stringByReplacingCharactersInRange:NSMakeRange(range.location, [strlength])withString:funUrlStr];  
  124.   
  125.         }  
  126.   
  127.     }  
  128.   
  129.   
  130.     //解析表情  
  131.   
  132.     NSString *regex_emoji =@"\
    [azAZ09u4e00u9fa5]+
    ";//表情的正则表达式  
  133.   
  134.     NSArray *array_emoji = [text componentsMatchedByRegex:regex_emoji];  
  135.   
  136.     NSString *filePath = [[[NSBundlemainBundle]resourcePath]stringByAppendingPathComponent:@"emotionImage.plist"];  
  137.   
  138.     NSDictionary *m_EmojiDic = [[NSDictionaryalloc]initWithContentsOfFile:filePath];  
  139.   
  140.    // NSString *path = [NSString stringWithFormat:@"%@", [[NSBundle mainBundle] bundlePath]];  
  141.   
  142.       
  143.   
  144.     if ([array_emoji count]) {  
  145.   
  146.         for (NSString *strin array_emoji) {  
  147.   
  148.             NSRange range = [text rangeOfString:str];  
  149.   
  150.             NSString *i_transCharacter = [m_EmojiDicobjectForKey:str];  
  151.   
  152.             if (i_transCharacter) {  
  153.   
  154.                 //NSString *imageHtml = [NSString stringWithFormat:@"<img src = 'file://%@/%@' width='12' height='12'>", path, i_transCharacter];  
  155.   
  156.                 NSString *imageHtml = [NSStringstringWithFormat:@"<img src =%@>",  i_transCharacter];  
  157.   
  158.                 text = [text stringByReplacingCharactersInRange:NSMakeRange(range.location, [str length]) withString:[imageHtmlstringByAppendingString:@" "]];  
  159.   
  160.             }  
  161.   
  162.         }  
  163.   
  164.     }  
  165.   
  166.     [m_EmojiDic release];  
  167.   
  168.     //返回转义后的字符串  
  169.   
  170.     return text;  
  171.   
  172. }  
  173.   
  174.   
  175. @end  

    实用的时候:

[html]  view plain copy
  1.    //contentStr为你要显示的图文字符串  
  2.   
  3.    NSString *str = [HtmlStringtransformString:contentStr];  
  4.   
  5.     textLabel = [[RCLabelalloc]initWithFrame:CGRectMake(10,160,300,84)];  
  6.   
  7.     textLabel.delegate =self;  
  8.   
  9.     textLabel.sizeDelegate =self;  
  10.   
  11.     [textLabelsetFont:[UIFontfontWithName:TextNamesize:15]];  
  12.   
  13.     RCLabelComponentsStructure *componentsDS = [RCLabelextractTextStyle:textString];  
  14.   
  15.     textLabel.componentsAndPlainText = componentsDS;  
  16.   
  17.     CGSize optimalSize = [textLabeloptimumSize:YES];   //计算图文混排后的高度  
  18.   
  19.     textLabel.frame=CGRectMake(10,180,300, optimalSize.height+5);  
  20.   
  21.     textLabel.lineBreakMode =NSLineBreakByCharWrapping;  
  22.   
  23.     textLabel.backgroundColor = [UIColorclearColor];  
  24.   
  25.     textLabel.textColor = [UIColorcolorWithRed:33.0/255green:33.0/255blue:33.0/255alpha:1];  
  26.   
  27.     [self.viewaddSubview:textLabel];  
  28.   
  29.    //如果你在实现图文混排时还有超链接、@、$等,在最后实现该类的代理方法  
  30.   
  31. -(void)RCLabel:(id)RCLabel didSelectLinkWithURL:(NSString *)url  
  32.   
  33. {   //url为超链接的文字内容  
  34.   
  35.   
  36. }   

效果图:


demo 点击下载

原文出处:http://blog.csdn.net/javayujiafeng/article/details/14163319

### 回答1: iOS 富文本可以通过使用 NSAttributedString 和 NSTextAttachment 类加载 GIF 图片,达到将富文本与动态效果结合的效果。 首先,需要将 GIF 图片转换为 NSData 格式,可通过使用 NSData 的类方法 dataWithContentsOfFile 或者 dataWithContentsOfURL 来实现。 接着,创建 NSTextAttachment 实例,并以 NSData 格式将 GIF 图片作为参数传入。然后,创建 NSMutableAttributedString 实例,并将富文本内容包含在其中。 最后,使用 UILabel、UITextView 或者 UIWebView 等组件来展示富文本内容,并加以控制动态效果的播放周期及重复次数等属性,达到更丰富的用户体验。 需要注意的是,在使用富文本加载 GIF 图片时,应考虑对应用性能及网络耗费等问题进行优化调整,使得应用流畅稳定,并能够节省用户移动数据流量等资源。 ### 回答2: iOS开发中,要加载gif动图作为富文本,可以使用如下的步骤: 1. 引入SDWebImage库:在项目中添加SDWebImage库,这是一个常用的图片加载库,可以方便地加载并显示网络上的图片。 2. 下载gif图片:从网络上找到合适的gif图片,并将其下载到本地。 3. 将gif图片添加到富文本中:使用SDWebImage提供的方法将gif图片添加到富文本中,可以使用`UIImage sd_animatedGIFWithData:`方法将本地的gif图片转换为UIImage对象,并使用该UIImage对象创建一个`NSTextAttachment`对象。 4. 将NSTextAttachment对象添加到NSAttributedString中:将创建好的NSTextAttachment对象添加到NSMutableAttributedString对象中,可以使用`appendAttributedString:`方法将其追加到NSMutableAttributedString对象的末尾。 5. 将NSAttributedString对象显示在界面上:通过UILabel、UITextView等界面控件,将NSMutableAttributedString对象显示在界面上,即可完成富文本加载gif的功能。 需要注意的是,为了保证gif动图的流畅播放,SDWebImage库会将gif图片展示为一系列的静态图片,然后再按照正确的帧率进行播放。另外,对于高性能的gif加载,也可以使用其他优化库,如FLAnimatedImage等。 综上所述,通过引入SDWebImage库、下载gif图片、将图片添加到富文本中,并将富文本显示在界面上等一系列步骤,即可实现在iOS中加载gif动图作为富文本显示的功能。 ### 回答3: 在iOS中,要加载GIF图像并将其显示在富文本中,我们可以采取以下步骤: 1. 首先,我们需要获取GIF图像文件的URL或路径。可以从互联网上下载或从应用程序的资源文件中获取。例如,如果GIF图像保存在应用程序的资源文件中,则可以使用`Bundle.main.url(forResource: "myGif", withExtension: "gif")`方法获取该文件的URL。 2. 接下来,我们需要将GIF图像文件加载到`Data`对象中,以便将其与`NSAttributedString`富文本一起使用。我们可以使用`Data(contentsOf: gifURL)`方法将URL转换为Data对象。 3. 然后,我们可以创建一个`NSTextAttachment`对象,并将GIF图像数据设置为其`image`属性。例如,可以使用`NSTextAttachment(image: UIImage(data: gifData)!)`来创建`NSTextAttachment`对象。 4. 然后,我们可以使用`NSAttributedString`的`append`方法将`NSTextAttachment`对象添加到富文本中,并设置其适当的位置。例如,可以使用`attributedString.append(NSAttributedString(attachment: textAttachment))`语句将`NSTextAttachment`对象添加到`attributedString`富文本字符串中。 5. 最后,我们可以将包含GIF图像的富文本字符串应用于文本视图或标签等UI元素,以便在界面上显示GIF图像。例如,对于UILabel,可以使用`label.attributedText = attributedString`将富文本字符串应用于标签。 综上所述,以上是利用iOS富文本加载GIF的简要步骤。通过将GIF图像文件加载到`Data`对象中,然后将其作为`NSTextAttachment`对象添加到富文本字符串中,我们可以在富文本中显示GIF图像,并将其应用于iOS界面中的相应UI元素。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值