图文点击高亮截断功能CoreText亲身实践

如欲赋予文本活力，就需要CoreText的登场。从文本的基础知识入手，理解各个类的作用与关系，循序渐进，掌握构建文本绘制流水线。掌握了基本知识，我们便可探索图文混排的艺术。在绘图上下功夫，设定样式，高效插入图片。再点击添加交互，结合手势识别，点击触发高亮。最后实现截断，处理超出部分，展现文字之美。

知识要点

1. 掌握CoreText基本概念与各组件关系。
2. 实现自定义文本排版，融入图片。
3. 集成手势识别，打造高亮效果。
4. 巧用截断，美化超出文本。

操作步骤

1. 导入CoreText框架，初始化CTFramesetter。
2. 获取上下文并设置好文本属性。
3. 利用CTFramesetter绘制富文本。
4. 绘制图片，构筑图文并茂。
5. 集成手势识别，响应点击高亮。
6. 应用截断，处理文本超出部分。

示例代码

#import <CoreText/CoreText.h>

@interface MyTextView : UIView

@property (nonatomic, strong) NSAttributedString *attributedString;
@property (nonatomic, strong) CTFrameRef ctFrame;

- (void)drawRect:(CGRect)rect;

@end

@implementation MyTextView

- (void)drawRect:(CGRect)rect {
    // 创建上下文并设置文本属性
    CGContextRef context = UIGraphicsGetCurrentContext();
    CGContextSetTextMatrix(context, CGAffineTransformIdentity);
    CGContextTranslateCTM(context, 0, self.bounds.size.height);
    CGContextScaleCTM(context, 1.0, -1.0);
    
    // 绘制富文本
    CTFrameDraw(self.ctFrame, context);
    
    // 绘制图片
    UIImage *image = [UIImage imageNamed:@"image.png"];
    [image drawInRect:CGRectMake(100, 100, 100, 100)];
    
    // 集成手势识别
    UITapGestureRecognizer *tapGestureRecognizer = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(handleTap:)];
    [self addGestureRecognizer:tapGestureRecognizer];
}

- (void)handleTap:(UITapGestureRecognizer *)gestureRecognizer {
    // 点击高亮
    CGPoint point = [gestureRecognizer locationInView:self];
    CGRect rect = [self characterRectAtPoint:point];
    [self highlightRect:rect];
}

- (CGRect)characterRectAtPoint:(CGPoint)point {
    // 获取字符所在的位置
    CFIndex index = [self characterIndexAtPoint:point];
    CGRect rect = [self characterRectAtIndex:index];
    return rect;
}

- (CFIndex)characterIndexAtPoint:(CGPoint)point {
    // 获取字符的索引
    CTLineRef line = [self lineContainingPoint:point];
    CFIndex index = CTLineGetStringIndexForPosition(line, point);
    return index;
}

- (CGRect)characterRectAtIndex:(CFIndex)index {
    // 获取字符的区域
    CGRect rect = [self glyphRectAtIndex:index];
    return rect;
}

- (CGRect)glyphRectAtIndex:(CFIndex)index {
    // 获取字符的区域
    CTLineRef line = [self lineContainingCharacterAtIndex:index];
    CGRect rect = CTLineGetGlyphBoundsWithOptions(line, index, kCTLineBoundsUseGlyphs, NULL);
    return rect;
}

- (CTLineRef)lineContainingPoint:(CGPoint)point {
    // 获取包含点的行
    CFIndex index = [self characterIndexAtPoint:point];
    CTLineRef line = CTLineCreateWithAttributedString(self.attributedString, NULL, index);
    return line;
}

- (CTLineRef)lineContainingCharacterAtIndex:(CFIndex)index {
    // 获取包含字符的行
    CTLineRef line = CTLineCreateWithAttributedString(self.attributedString, NULL, index);
    return line;
}

- (void)highlightRect:(CGRect)rect {
    // 高亮区域
    CGContextRef context = UIGraphicsGetCurrentContext();
    CGContextSetFillColorWithColor(context, [UIColor yellowColor].CGColor);
    CGContextFillRect(context, rect);
}

@end

总结

CoreText的魅力在于灵活性。图文并排彰显了图形与文字的结合。高亮点击诠释了交互的精髓。截断功能展示了排版的艺术。CoreText点燃你的创意之火，自由驾驭文字，打造出美轮美奂的排版效果。