CoreText 入門（一） 文字繪製

aron1992發表於2019-04-04

本文主要的內容是討論如何使用CoreText進行最簡單的文字內容的繪製，同時也談到的CoreText繪圖的一個最基本但是也是最重要的CoreText座標系的概念，CoreText座標系的概念是貫穿所有的CoreText繪圖場景，所有這裡先做個介紹

其它文章：
CoreText入門（一）-文字繪製
CoreText入門（二）-繪製圖片
CoreText進階（三）-事件處理
CoreText進階（四）-文字行數限制和顯示更多
CoreText進階（五）- 文字排版樣式和效果
CoreText進階（六）-內容大小計算和自動佈局
CoreText進階（七）-新增自定義View和對其

本文的主要內容如下

  • CoreText是什麼
  • 座標系
  • 簡單的文字繪製
  • 總結

Demo：CoreTextDemo

CoreText是什麼

蘋果的文件中對CoreText的描述如下

Core Text is an advanced, low-level technology for laying out text and handling fonts. Core Text works directly with Core Graphics (CG), also known as Quartz, which is the high-speed graphics rendering engine that handles two-dimensional imaging at the lowest level in OS X and iOS.

翻譯過來的意思就是：CoreText是一種高階的底層技術, 用於佈局文字和處理字型。CoreText直接與Core Graphics (CG) 一起工作, 也稱為Quartz, 它是在 OS X 和 iOS 的最底層的處理二維成像的高速圖形渲染引擎。

座標系

UIKit的座標系原點是在右上角，CoreText的座標原點是在左下角，並且繪製的內容是顛倒的，所以需要進行座標轉換，繪製的內容顯示才能正常

座標系
座標系

 使用以下的程式碼進行座標系的轉換

    CGContextRef context = UIGraphicsGetCurrentContext();
    CGContextSetTextMatrix(context, CGAffineTransformIdentity);
    CGContextTranslateCTM(context, 0, self.bounds.size.height);
    CGContextScaleCTM(context, 1, -1);
複製程式碼

步驟示例圖：


步驟示例圖
步驟示例圖

簡單的文字繪製

效果圖



效果圖
效果圖

文字繪製的流程圖：


文字繪製的流程圖
文字繪製的流程圖

- (void)drawRect:(CGRect)rect {
    [super drawRect:rect];
    CGContextRef context = UIGraphicsGetCurrentContext();
    CGContextSetTextMatrix(context, CGAffineTransformIdentity);
    CGContextTranslateCTM(context, 0, self.bounds.size.height);
    CGContextScaleCTM(context, 1, -1);

    // 繪製區域
    CGMutablePathRef path = CGPathCreateMutable();
    CGPathAddRect(path, NULL, self.bounds);

    // 繪製的內容屬性字串
    NSDictionary *attributes = @{NSFontAttributeName: [UIFont systemFontOfSize:18],
                                 NSForegroundColorAttributeName: [UIColor blueColor]
                                 };
    NSMutableAttributedString *attrStr = [[NSMutableAttributedString alloc] initWithString:@"Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world" attributes:attributes];

    // 使用NSMutableAttributedString建立CTFrame
    CTFramesetterRef framesetter = CTFramesetterCreateWithAttributedString((CFAttributedStringRef)attrStr);
    CTFrameRef frame = CTFramesetterCreateFrame(framesetter, CFRangeMake(0, attrStr.length), path, NULL);

    // 使用CTFrame在CGContextRef上下文上繪製
    CTFrameDraw(frame, context);
}
複製程式碼

總結

使用CoreText繪製文字步驟比較簡單，這裡面子用到CoreText中的一個類CTFrame，CoreText中還有許多其他的概念沒有涉及到，下一篇CoreText入門（二）-繪製圖片會涉及到CoreText中更多的概念

相關文章