iOS 超强富文本编辑库
YYText
功能强大的 iOS 富文本编辑与显示框架
特性
API 兼容 UILabel 和 UITextView支持高性能的异步排版和渲染扩展了 CoreText 的属性以支持更多文字效果支持 UIImage、UIView、CALayer 作为图文混排元素支持添加自定义样式的、可点击的文本高亮范围支持自定义文本解析 (内置简单的 Markdown/表情解析)支持文本容器路径、内部留空路径的控制支持文字竖排版，可用于编辑和显示中日韩文本支持图片和富文本的复制粘贴文本编辑时，支持富文本占位符支持自定义键盘视图撤销和重做次数的控制富文本的序列化与反序列化支持支持多语言，支持 VoiceOver支持 Interface Builder全部代码都有文档注释架构
YYText 和 TextKit 架构对比
文本属性
YYText 原生支持的属性
| Demo | Attribute Name | Class |
|---|---|---|
| TextAttachment | YYTextAttachment | |
| TextHighlight | YYTextHighlight | |
| TextBinding | YYTextBinding | |
| TextShadow TextInnerShadow | YYTextShadow | |
| TextBorder | YYTextBorder | |
| TextBackgroundBorder | YYTextBorder | |
| TextBlockBorder | YYTextBorder | |
| TextGlyphTransform | NSValue(CGAffineTransform) | |
| TextUnderline | YYTextDecoration | |
| TextStrickthrough | YYTextDecoration | |
| TextBackedString | YYTextBackedString |
YYText 支持的 CoreText 属性
| Demo | Attribute Name | Class |
|---|---|---|
| Font | UIFont(CTFontRef) | |
| Kern | NSNumber | |
| StrokeWidth | NSNumber | |
| StrokeColor | CGColorRef | |
| Shadow | NSShadow | |
| Ligature | NSNumber | |
| VerticalGlyphForm | NSNumber(BOOL) | |
| WritingDirection | NSArray(NSNumber) | |
| RunDelegate | CTRunDelegateRef | |
| TextAlignment | NSParagraphStyle (NSTextAlignment) | |
| LineBreakMode | NSParagraphStyle (NSLineBreakMode) | |
| LineSpacing | NSParagraphStyle (CGFloat) | |
| ParagraphSpacing ParagraphSpacingBefore | NSParagraphStyle (CGFloat) | |
| FirstLineHeadIndent | NSParagraphStyle (CGFloat) | |
| HeadIndent | NSParagraphStyle (CGFloat) | |
| TailIndent | NSParagraphStyle (CGFloat) | |
| MinimumLineHeight | NSParagraphStyle (CGFloat) | |
| MaximumLineHeight | NSParagraphStyle (CGFloat) | |
| LineHeightMultiple | NSParagraphStyle (CGFloat) | |
| BaseWritingDirection | NSParagraphStyle (NSWritingDirection) | |
| DefaultTabInterval TabStops | NSParagraphStyle CGFloat/NSArray(NSTextTab) |
用法
基本用法
// YYLabel (和 UILabel 用法一致)
YYLabel *label = [YYLabel new];
label.frame = ...
label.font = ...
label.textColor = ...
label.textAlignment = ...
label.lineBreakMode = ...
label.numberOfLines = ...
label.text = ...
// YYTextView (和 UITextView 用法一致)
YYTextView *textView = [YYTextView new];
textView.frame = ...
textView.font = ...
textView.textColor = ...
textView.dataDetectorTypes = ...
textView.placeHolderText = ...
textView.placeHolderTextColor = ...
textView.delegate = ...属性文本
// 1. 创建一个属性文本
NSMutableAttributedString *text = [[NSMutableAttributedString alloc] initWithString:@"Some Text, blabla..."];
// 2. 为文本设置属性
text.yy_font = [UIFont boldSystemFontOfSize:30];
text.yy_color = [UIColor blueColor];
[text yy_setColor:[UIColor redColor] range:NSMakeRange(0, 4)];
text.yy_lineSpacing = 10;
// 3. 赋值到 YYLabel 或 YYTextView
YYLabel *label = [YYLabel new];
label.frame = ...
label.attributedString = text;
YYTextView *textView = [YYTextView new];
textView.frame = ...
textView.attributedString = text;文本高亮
你可以用一些已经封装好的简便方法来设置文本高亮：
[text yy_setTextHighlightRange:range
color:[UIColor blueColor]
backgroundColor:[UIColor grayColor]
tapAction:^(UIView *containerView, NSAttributedString *text, NSRange range, CGRect rect){
NSLog(@"tap text range:...");
}];文本高亮
你可以用一些已经封装好的简便方法来设置文本高亮：
[text yy_setTextHighlightRange:range
color:[UIColor blueColor]
backgroundColor:[UIColor grayColor]
tapAction:^(UIView *containerView, NSAttributedString *text, NSRange range, CGRect rect){
NSLog(@"tap text range:...");
}];或者用更复杂的办法来调节文本高亮的细节：
// 1. 创建一个"高亮"属性，当用户点击了高亮区域的文本时，"高亮"属性会替换掉原本的属性
YYTextBorder *border = [YYTextBorder borderWithFillColor:[UIColor grayColor] cornerRadius:3];
YYTextHighlight *highlight = [YYTextHighlight new];
[highlight setColor:[UIColor whiteColor]];
[highlight setBackgroundBorder:highlightBorder];
highlight.tapAction = ^(UIView *containerView, NSAttributedString *text, NSRange range, CGRect rect) {
NSLog(@"tap text range:...");
// 你也可以把事件回调放到 YYLabel 和 YYTextView 来处理。
};
// 2. 把"高亮"属性设置到某个文本范围
[attributedText yy_setTextHighlight:highlight range:highlightRange];
// 3. 把属性文本设置到 YYLabel 或 YYTextView
YYLabel *label = ...
label.attributedText = attributedText
YYTextView *textView = ...
textView.attributedText = ...
// 4. 接受事件回调
label.highlightTapAction = ^(UIView *containerView, NSAttributedString *text, NSRange range, CGRect rect) {
NSLog(@"tap text range:...");
};
label.highlightLongPressAction = ^(UIView *containerView, NSAttributedString *text, NSRange range, CGRect rect) {
NSLog(@"long press text range:...");
};
@UITextViewDelegate
- (void)textView:(YYTextView *)textView didTapHighlight:(YYTextHighlight *)highlight inRange:(NSRange)characterRange rect:(CGRect)rect {
NSLog(@"tap text range:...");
}
- (void)textView:(YYTextView *)textView didLongPressHighlight:(YYTextHighlight *)highlight inRange:(NSRange)characterRange rect:(CGRect)rect {
NSLog(@"long press text range:...");
}图文混排
NSMutableAttributedString *text = [NSMutableAttributedString new];
UIFont *font = [UIFont systemFontOfSize:16];
NSMutableAttributedString *attachment = nil;
// 嵌入 UIImage
UIImage *image = [UIImage imageNamed:@"dribbble64_imageio"];
attachment = [NSMutableAttributedString yy_attachmentStringWithContent:image contentMode:UIViewContentModeCenter attachmentSize:image.size alignToFont:font alignment:YYTextVerticalAlignmentCenter];
[text appendAttributedString: attachment];
// 嵌入 UIView
UISwitch *switcher = [UISwitch new];
[switcher sizeToFit];
attachment = [NSMutableAttributedString yy_attachmentStringWithContent:switcher contentMode:UIViewContentModeBottom attachmentSize:switcher.size alignToFont:font alignment:YYTextVerticalAlignmentCenter];
[text appendAttributedString: attachment];
// 嵌入 CALayer
CASharpLayer *layer = [CASharpLayer layer];
layer.path = ...
attachment = [NSMutableAttributedString yy_attachmentStringWithContent:layer contentMode:UIViewContentModeBottom attachmentSize:switcher.size alignToFont:font alignment:YYTextVerticalAlignmentCenter];
[text appendAttributedString: attachment];文本布局计算
NSAttributedString *text = ...
CGSize size = CGSizeMake(100, CGFLOAT_MAX);
YYTextLayout *layout = [YYTextLayout layoutWithContainerSize:size text:text];
// 获取文本显示位置和大小
layout.textBoundingRect; // get bounding rect
layout.textBoundingSize; // get bounding size
// 查询文本排版结果
[layout lineIndexForPoint:CGPointMake(10,10)];
[layout closestLineIndexForPoint:CGPointMake(10,10)];
[layout closestPositionToPoint:CGPointMake(10,10)];
[layout textRangeAtPoint:CGPointMake(10,10)];
[layout rectForRange:[YYTextRange rangeWithRange:NSMakeRange(10,2)]];
[layout selectionRectsForRange:[YYTextRange rangeWithRange:NSMakeRange(10,2)]];
// 显示文本排版结果
YYLabel *label = [YYLabel new];
label.size = layout.textBoundingSize;
label.textLayout = layout;部分效果展示
安装
CocoaPods
- 在 Podfile 中添加
pod 'YYText'。 - 执行
pod install或pod update。 - 导入 。
Carthage
- 在 Cartfile 中添加
github "ibireme/YYText"。 - 执行
carthage update --platform ios并将生成的 framework 添加到你的工程。 - 导入 。
手动安装
- 下载 YYText 文件夹内的所有内容。
- 将 YYText 内的源文件添加(拖放)到你的工程。
- 链接以下 frameworks:
- UIKit
- CoreFoundation
- CoreText
- QuartzCore
- Accelerate
- MobileCoreServices
- 导入
YYText.h。
已知问题
YYText 并不能支持所有 CoreText/TextKit 的属性，比如 NSBackgroundColor、NSStrikethrough、NSUnderline、NSAttachment、NSLink 等，但 YYText 中基本都有对应属性作为替代。详情见上方表格。YYTextView 未实现局部刷新，所以在输入和编辑大量的文本（比如超过大概五千个汉字、或大概一万个英文字符）时会出现较明显的卡顿现象。竖排版时，添加 exclusionPaths 在少数情况下可能会导致文本显示空白。当添加了非矩形的 textContainerPath，并且有嵌入大于文本排版方向宽度的 RunDelegate 时，RunDelegate 之后的文字会无法显示。这是 CoreText 的 Bug（或者说是 Feature）。常见问题及源码下载:点击这里
demo:YYText.zip
