AWRichText

基于CoreText，面向?qū)ο?，極簡(jiǎn)，易用，高效，支持精確點(diǎn)擊，UIView混排，GIF動(dòng)圖，并不僅僅局限于圖文混排的富文本排版神器。

代碼地址：https://github.com/hardman/AWRichText -- 喜歡的同學(xué)可以star。

接下來(lái)會(huì)在blog中更新一些具體實(shí)現(xiàn)細(xì)節(jié)。

簡(jiǎn)述

很多app中都有聊天功能，圖文混排也是常見(jiàn)的需求。

iOS原生類：NSAttributedString 就是支持圖文混排的。很多應(yīng)用會(huì)用它來(lái)實(shí)現(xiàn)自己的功能。

但是直接使用它會(huì)有很多不方便的地方，大概有下面幾個(gè)：

1. 太難用，屬性那么多，而且使用字典構(gòu)造，每次用都要查一下文檔。更不要說(shuō)大規(guī)模使用了
2. 不支持GIF動(dòng)圖
3. 不支持局部精確點(diǎn)擊
4. 不支持UIView與文字進(jìn)行混排

AWRichText完全解決了這些問(wèn)題，它的特點(diǎn)如下：

1. 基于 NSAttributedString+CoreText 繪制
2. 面向?qū)ο?鏈?zhǔn)讲僮?，不需記憶繁多的屬性名即可快速生成各種文本效果
3. 支持GIF 及 任意UIView 的圖文混排
4. 支持精確點(diǎn)擊

AWRichText是可以讓你在項(xiàng)目中大規(guī)模使用的，并不僅僅局限于圖文混排的工具。

它適合于如下場(chǎng)景：文字+文字，圖片+文字，組件（UIView及其子類）+文字。

因此可出現(xiàn)在：文檔排版，聊天排版，列表展示，廣告文案 等各個(gè)位置。

功能演示

AWRichText演示

圖中的Demo（直接下載github代碼運(yùn)行即可）包含4部分：

• 第一部分展示了長(zhǎng)文本圖文混排功能。展示了文字樣式，UIView(一個(gè)無(wú)處安放的按鈕)混排，精確點(diǎn)擊（藍(lán)紫色字體），GIF動(dòng)圖（小龍）。
• 第二部分展示了富文本的更多使用方式?？梢栽谌我忸^像+昵稱這種列表中使用，省去動(dòng)態(tài)建立UIImageView和UILabel的麻煩。
• 第三部分展示了一個(gè)簡(jiǎn)單的的仿斗魚(yú)聊天功能。展示了如何創(chuàng)建復(fù)雜的富文本及獲取富文本尺寸等功能。
• 第四部分展示了純UIView單行排版功能：對(duì)于按鈕橫排的需求很實(shí)用，另外點(diǎn)擊"打開(kāi)DebugFrame"按鈕，會(huì)觸發(fā)線框模式，能夠看到每個(gè)文字的位置和大小。

Demo中所有元素都是使用AWRichText構(gòu)造的。

使用方法

1.直接引入文件

將代碼中的 "RichText" 文件夾直接拖入你的工程。
引入頭文件 "AWRichText.h" 即可使用。

2.使用pod

在Podfile文件中加入：

source 'https://github.com/CocoaPods/Specs.git'
platform :ios, '8.0'

target 'TargetName' do
pod 'AWRichText', '~> 1.0.1'
end

然后命令行執(zhí)行如下命令：

pod install

基本用法

#include "AWRichText.h"

...
...

AWRichText *richText = [[AWRichText alloc] init];
    
//創(chuàng)建紅色文本hello，文本類型 text和font是必須設(shè)置的。
AWRTTextComponent *rTextComp = [[AWRTTextComponent alloc] init]
.AWText(@"hello")
.AWColor([UIColor redColor])
.AWFont([UIFont systemFontOfSize:12])
.AWPaddingRight(@1);
[richText addComponent: rTextComp];
    
//創(chuàng)建藍(lán)色文本world
AWRTTextComponent *bTextComp = [[AWRTTextComponent alloc] init]
.AWText(@" world")
.AWColor([UIColor blueColor ])
.AWFont([UIFont systemFontOfSize:12])
.AWPaddingRight(@1);
[richText addComponent:bTextComp];
    
//創(chuàng)建圖片，圖片類型也請(qǐng)?jiān)O(shè)置font，否則可能顯示異常
AWRTImageComponent *imgComp = [[AWRTImageComponent alloc] init]
.AWImage([UIImage imageWithContentsOfFile:[[NSBundle mainBundle] pathForResource:@"fengtimo.jpg" ofType:nil]])
.AWFont([UIFont systemFontOfSize:12])
.AWBoundsDepend(@(AWRTAttchmentBoundsDependFont))
.AWAlignment(@(AWRTAttachmentAlignCenter))
.AWPaddingRight(@1);
[richText addComponent:imgComp];
    
//創(chuàng)建UIButton
UIButton *btn = [[UIButton alloc] initWithFrame:CGRectMake(0, 0, 120, 22)];
btn.titleLabel.font = [UIFont systemFontOfSize:12];
[btn setTitle:@"這是一個(gè)button" forState:UIControlStateNormal];
[btn setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal];
[btn setTitleColor:[UIColor colorWithRed:170.f/255 green:170.f/255 blue:170.f/255 alpha:1] forState:UIControlStateHighlighted];
[btn setBackgroundColor:[UIColor colorWithRed:1 green:184.f/255 blue:0 alpha:1]];
btn.layer.cornerRadius = 5;
btn.layer.borderWidth = 1/[UIScreen mainScreen].scale;
btn.layer.borderColor = [UIColor colorWithRed:201.f/255 green:201.f/255 blue:201.f/255 alpha:1].CGColor;

//根據(jù)button創(chuàng)建ViewComponent，View類型也請(qǐng)?jiān)O(shè)置font，否則可能顯示異常
//另外 AWRTxxxComponent組件也可以從Pool中取，直接調(diào)用addComponentFromPoolWithType:方法。
//此種方法適合AWRichText的components變化頻繁的情況。
//正常情況使用 alloc init的方式生成即可。
((AWRTViewComponent *)[richText addComponentFromPoolWithType:AWRTComponentTypeView])
.AWView(btn)
.AWFont([UIFont systemFontOfSize:12])
.AWBoundsDepend(@(AWRTAttchmentBoundsDependContent))
.AWAlignment(@(AWRTAttachmentAlignCenter));

//創(chuàng)建label，AWRichTextLabel是UILabel的子類
AWRichTextLabel *awLabel = [richText createRichTextLabel];
//請(qǐng)務(wù)必設(shè)置rtFrame屬性，設(shè)置后會(huì)自動(dòng)計(jì)算frame的尺寸
//寬度為非0，高度為0表示高度自適應(yīng)。另外若寬度設(shè)置特別大，超出文字內(nèi)容，最終生成的寬度仍然是以文字內(nèi)容寬度為準(zhǔn)。
//寬度為0表示單行。
//系統(tǒng)屬性numberOfLines無(wú)效
awLabel.rtFrame = CGRectMake(100, 100, 100, 0);
    
awLabel.backgroundColor = [UIColor colorWithRed:0.9f green:0.9f blue:0.9f alpha:1];
    
[superView addSubview:awLabel];
...
...

上述代碼效果：

1 . 當(dāng)rtFrame為 CGRectMake(100,100,100,0)時(shí)：

寬度為100

2 . 當(dāng)rtFrame為 CGRectMake(100,100,1000,0)時(shí)：

寬度為1000

其他用法及效果實(shí)現(xiàn)，詳見(jiàn)github中的demo。