iOS中支持HTML文本的標籤控件——MDHTMLLabel

iOS中支持HTML文本的標籤控件——MDHTMLLabel

1、引言

        在iOS開發中對HTML的處理不少時候除了使用WebView外，還須要原生的控件對其進行渲染，例如將HTML字符串渲染爲圖文混排的View視圖。Git上有不少輕量級的HTML渲染框架，列舉一些以下：

RTLabel：基於UIView的HTML文本渲染控件，git地址：https://github.com/honcheng/RTLabel。

RCLabel：與RTLabel思路相同，基於RCLabel之上，也是UIView的子類，支持了對HTML中的本地圖片標籤進行渲染。git地址：https://github.com/Janak-Nirmal/RichContentLabel。

MDHTMLLabel：與RTLabel和RCLabel不一樣的是，其是UILabel的子類，更加輕量級，不能支持圖片標籤。git地址：https://github.com/mattdonnelly/MDHTMLLabel。

    關於RCLabel對圖片便籤的支持，其只能支持本地的圖片，不能支持遠程URL圖片連接，這在開發中將十分侷限，之前我曾加RCLabel作了改造，加了支持遠程圖片URL的方法，我把它集成在了一個基礎框架中，須要的夥伴能夠參考下，git地址：https://github.com/ZYHshao/YHBaseFoundationTest。配套的講解博客地址以下：http://my.oschina.net/u/2340880/blog/499311。

    本篇博客主要討論MDHTMLLabel的使用。

2、MDHTMLLabel的建立與設置

      MDHTMLLabel框架十分小巧，其中只有兩個文件，總計2000餘行代碼。經過HTML字符串來建立一個MDHTMLLabel控件示例代碼以下：

NSString * kDemoText = @"<a href='http://github.com/mattdonnelly/MDHTMLLabel'>MDHTMLLabel</a> is a lightweight, easy to use replacement for <b>UILabel</b> which allows you to fully <font face='Didot-Italic' size='19'>customize</font> the appearence of the text using HTML (with a few added features thanks to <b>CoreText</b>), as well letting you handle whenever a user taps or holds down on link and automatically detects ones not wrapped in anchor tags/>";
    MDHTMLLabel *htmlLabel = [[MDHTMLLabel alloc] initWithFrame:self.view.frame];
    htmlLabel.numberOfLines = 0;
    htmlLabel.htmlText = kDemoText;
    [self.view addSubview:htmlLabel];

效果以下圖所示：

MDHTMLLabel中能夠設置的一些屬性解析以下：

//設置超連接文字的屬性字典 和設置AttributeString方法一致
@property (nonatomic, strong) NSDictionary *linkAttributes;
//設置超連接文字激活時的屬性字典
@property (nonatomic, strong) NSDictionary *activeLinkAttributes;
//設置超連接非激活時的屬性字典
@property (nonatomic, strong) NSDictionary *inactiveLinkAttributes;
//設置超連接文字觸發長按事件的最小按下時間
@property (nonatomic, assign) NSTimeInterval minimumPressDuration;
//設置label文件陰影的模糊半徑
@property (nonatomic, assign) CGFloat shadowRadius;
//設置label在高亮狀態下的文字模糊半徑 注：非高亮狀態的由原生UILabel的屬性設置
@property (nonatomic, assign) CGFloat highlightedShadowRadius;
//設置label在高亮狀態下的文字陰影偏移 注：非高亮狀態的由原生UILabel的屬性設置
@property (nonatomic, assign) CGSize highlightedShadowOffset;
//設置在label高亮狀態下的文字陰影顏色 注：非高亮狀態的由原生UILabel的屬性設置
@property (nonatomic, strong) UIColor *highlightedShadowColor;
//設置首行文字的縮進距離
@property (nonatomic, assign) CGFloat firstLineIndent;
//設置文字的行間距
@property (nonatomic, assign) CGFloat leading;
//設置行高的倍數
@property (nonatomic, assign) CGFloat lineHeightMultiple;
//設置文字內容的邊距
@property (nonatomic, assign) UIEdgeInsets textInsets;
//設置文字垂直方向的對其模式 默認爲居中對其 MDHTMLLabelVerticalAlignment枚舉意義以下:
/*
typedef NS_ENUM(NSUInteger, MDHTMLLabelVerticalAlignment) {
    MDHTMLLabelVerticalAlignmentCenter   = 0, //居中對其
    MDHTMLLabelVerticalAlignmentTop      = 1, //頂部對其
    MDHTMLLabelVerticalAlignmentBottom   = 2, //底部對其
};
*/
@property (nonatomic, assign) MDHTMLLabelVerticalAlignment verticalAlignment;
//設置文字的截斷模式
@property (nonatomic, strong) NSString *truncationTokenString;
//根據內容獲取控件尺寸
+ (CGFloat)sizeThatFitsHTMLString:(NSString *)htmlString
                         withFont:(UIFont *)font
                      constraints:(CGSize)size
           limitedToNumberOfLines:(NSUInteger)numberOfLines;

關於HTML數據中的超連接的相應，MDHTMLLabel是經過代理回調的方式處理的，以下：

@protocol MDHTMLLabelDelegate <NSObject>
@optional
//點擊超連接的時候觸發的方法
- (void)HTMLLabel:(MDHTMLLabel *)label didSelectLinkWithURL:(NSURL*)URL;
//長按超連接時觸發的方法
- (void)HTMLLabel:(MDHTMLLabel *)label didHoldLinkWithURL:(NSURL*)URL;
@end

專一技術，熱愛生活，交流技術，也作朋友。

——琿少 QQ羣：203317592