之前优酷土豆的iOS工程师ibireme一口气在v2ex开源了很多YY系列库 非常好用 以下是个人对YYText源码分析和一些功能的使用 更多可参见 https://github.com/ibireme/YYText
YYText的架构
首先拿其中很重要的一个类YYTextLayout来说
YYTextLayout其中有一个到多个container（容器）来组成 而container又可以通过insets或者贝塞尔曲线来绘制间距
//YYTextLayout提供了以下的初始化方法 需要注意的是 需要container和attributedString两个基础要素 返回的Array是layout的Array 一一对应
+ (YYTextLayout *)layoutWithContainerSize:(CGSize)size text:(NSAttributedString *)text;
+ (YYTextLayout *)layoutWithContainer:(YYTextContainer *)container text:(NSAttributedString *)text；
+ (YYTextLayout *)layoutWithContainer:(YYTextContainer *)container text:(NSAttributedString *)text range:(NSRange)range;
+ (NSArray *)layoutWithContainers:(NSArray *)containers text:(NSAttributedString *)text;
+ (NSArray *)layoutWithContainers:(NSArray *)containers text:(NSAttributedString *)text range:(NSRange)range;
//需要注意的是 YYTextLayout的属性皆为readonly
YYLabel
一些需要注意的属性
//垂直布局中 用这个属性控制布局 只有center/top/bottom 还无法实现竖排情况下的居中
@property (nonatomic, assign) YYTextVerticalAlignment textVerticalAlignment;
//在显示不下的时候显示 默认是熟悉的...
@property (nonatomic, copy) NSAttributedString *truncationToken;
//显而易见 代理 可以去改变text 加高亮 换字体什么的 非常有用
@property (nonatomic, strong) id<YYTextParser> textParser;
//贝塞尔曲线用来限定text显示的区域
@property (nonatomic, copy) UIBezierPath *textContainerPath;
//贝塞尔曲线的集合 即一个YYLabel里可以由多个贝塞尔曲线截出来text显示区域
@property (nonatomic, copy) NSArray *exclusionPaths;
//是否是竖排显示模式
@property (nonatomic, assign, getter=isVerticalForm) BOOL verticalForm;
//代理 改变YYTextLine
@property (nonatomic, copy) id<YYTextLinePositionModifier> linePositionModifier;
//debug设置
@property (nonatomic, copy) YYTextDebugOption *debugOption;
//事件触发使用YYTextAction 置为highlight
@property (nonatomic, copy) YYTextAction highlightTapAction;
@property (nonatomic, copy) YYTextAction highlightLongPressAction;
//是否采取异步显示 默认是no 以下属性均为display mode
@property (nonatomic, assign) BOOL displaysAsynchronously;
//在异步显示前是否将content清空 异步下生效 默认是yes
@property (nonatomic, assign) BOOL clearContentsBeforeAsynchronouslyDisplay;
//在content变化的时候 加个fade动画 默认yes
@property (nonatomic, assign) BOOL fadeOnAsynchronouslyDisplay;
//在置为highlight的时候 加个fade动画 默认no
@property (nonatomic, assign) BOOL fadeOnHighlight;
//如果你的绘制都交给textlayout去做 那么可以为了更好的性能 忽略掉label的一些属性 例如text/font等等
@property (nonatomic, assign) BOOL ignoreCommonProperties;
作者在这里给出了几条tips：
如果你只是展示下富文本 那么大可不必去管display mode的东西 如果你想追求更好的性能 那么就这样
YYLabel *label = [YYLabel new]; label.displaysAsynchronously = YES;//开启异步 label.ignoreCommonProperties = YES;//忽略common properity
dispatch_async(dispatch_get_global_queue(DISPATCH_QUEUE_PRIORITY_DEFAULT, 0), ^{
// Create attributed string.
NSMutableAttributedString *text = [[NSMutableAttributedString alloc] initWithString:@"贝贝iOSer"];
text.yy_font = [UIFont systemFontOfSize:16];
text.yy_color = [UIColor grayColor];
[text yy_setColor:[UIColor redColor] range:NSMakeRange(0, 4)];
// Create text container
YYTextContainer *container = [YYTextContainer new];
container.size = CGSizeMake(100, CGFLOAT_MAX);
container.maximumNumberOfRows = 0;
// Generate a text layout.
YYTextLayout *layout = [YYTextLayout layoutWithContainer:container text:text];
dispatch_async(dispatch_get_main_queue(), ^{
label.size = layout.textBoundingSize;
label.textLayout = layout;
});
});
//lineBreakMode
NSLineBreakByTruncatingHead NSLineBreakByTruncatingMiddle NSLineBreakByTruncatingTail NSLineBreakByWordWrapping
以上四种截断mode呈现的结果如下
NSLineBreakByCharWrapping按照字符截断如下
NSLineBreakByClipping按行直接截断
YYTextDebugOption
细心的作者为YYText加了debug的类 使开发者便于调试自己的文本 通过给一些组件设置以下颜色来纠正细节
@property (nonatomic, strong) UIColor *baselineColor; ///< baseline color @property (nonatomic, strong) UIColor *CTFrameBorderColor; ///< CTFrame path border color @property (nonatomic, strong) UIColor *CTFrameFillColor; ///< CTFrame path fill color @property (nonatomic, strong) UIColor *CTLineBorderColor; ///< CTLine bounds border color @property (nonatomic, strong) UIColor *CTLineFillColor; ///< CTLine bounds fill color @property (nonatomic, strong) UIColor *CTLineNumberColor; ///< CTLine line number color @property (nonatomic, strong) UIColor *CTRunBorderColor; ///< CTRun bounds border color @property (nonatomic, strong) UIColor *CTRunFillColor; ///< CTRun bounds fill color @property (nonatomic, strong) UIColor *CTRunNumberColor; ///< CTRun number color @property (nonatomic, strong) UIColor *CGGlyphBorderColor; ///< CGGlyph bounds border color @property (nonatomic, strong) UIColor *CGGlyphFillColor; ///< CGGlyph bounds fill color
举个栗子
YYTextDebugOption *debugOption = [YYTextDebugOption new]; debugOption.baselineColor = [UIColor blackColor]; debugOption.CTFrameBorderColor = [UIColor redColor]; debugOption.CTLineBorderColor = [UIColor blueColor]; [YYTextDebugOption setSharedDebugOption:debugOption];
这样设置debugOption
效果如下 各种线的作用自己感受下
网友评论