图文并茂的 html 网页,两种方法实现UILabel的图文并茂的显示html文本

概述

本文讲述用2中方法在UILabel中显示带图片和文字的HTML文本。

先预览下显示效果：

显示效果

如果你的设备时iOS 9或以上，默认只允许HTTPS，请打开HTTP请求许可，参照:iOS 9打开HTTP请求许可

方案一：

//HTML文本 包含图片、文本

NSString *htmlString=@"< img src=http://upload-images.jianshu.io/upload_images/937405-50a8ad2d8866fc12.png>&nbsp&nbsp花羊羊领取了你的红包"

UILabel *label=[UILabel alloc] initWithFrame:CGRectMake(50, 200, 220, 20)];

[self.view addSubview:label];

UIFont *font=[UIFont systemFontOfSize:14];

label.font=font;

NSDictionary *optoins=@{NSDocumentTypeDocumentAttribute:NSHTMLTextDocumentType,

NSFontAttributeName:font};

NSData *data=[htmlString dataUsingEncoding:NSUnicodeStringEncoding];

NSAttributedString *attributeString=[[NSAttributedString alloc] initWithData:data

options:optoins

documentAttributes:nil

error:nil];

label.attributedText=attributeString;

方案一点评：

这种方案只是实现了显示，显示效果好不好是另一回事。事实证明，这种方案的显示效果很不好：

方案一显示效果

我们现在要对方案一进行优化。

方案一优化思路：

1.缩小图片，让图片与字体显示差不多大；

2.让字体显示垂直方向居中。

优化后的方案一：

//HTML文本 包含图片、文本

NSString *htmlString=@"< img src=http://upload-images.jianshu.io/upload_images/937405-50a8ad2