CoreText Part 1

Apple 的相關博客:
Text Programming Guide for iOS
Core Text Programming Guide

CoreText 框架位置

text_kit_arch_2x-2.png

唐巧博客
基于 CoreText 的排版引擎:基礎

《Core Text Tutorial for iOS: Making a Magazine App》

使用 CoreText 實現圖文混排

基于 CoreText 的開源庫
OHAttribtuedLabel
DTCoreText
Nimbus
YYText
M80AttributedLabel

CoreText 引擎的架構

core_text_arch_2x.png

iOS/OSX中用于描述富文本的類是NSAttributedString。NSAttributedString 的 attributes 可以配置字符串中任意區域的,字體顏色,下劃線,斜體,背景顏色。

CoreText 中最重要的兩個概念就是 CTFrameSetter 和 CTFrame。

  1. 用 NSAttributedString 生成 CTFrameSetter
  2. CTFrameSetter 是 CTFrame 的工廠,專門用來生產 CTFrame(用 CTFrameSetter 來 生產 CTFrame )
  3. 用 CTFrame 繪制到 context 上。
    (CTLine 和 CTRun 是由屬性文本自動處理的,要進行精細化配置的時候才需要自己處理 CTRun)

CoreText 的簡單使用

使用 CoreText 進行圖文混排其實不是最根本的目的。
CoreText 使用,主要是用來顯示字符串的。

小目標 —— 顯示字符串

下列代碼寫在一個自定義的 UIView 的子類中。

override func draw(_ rect: CGRect) {
    super.draw(rect)
    
    // 1. 獲取當前的圖形上下文
    let context = UIGraphicsGetCurrentContext()
    
    // 2. 翻轉坐標
    context!.textMatrix = CGAffineTransform.identity
    context!.translateBy(x: 0, y: self.bounds.size.height);
    context!.scaleBy(x: 1.0, y: -1.0);
    
    // 3. 文本繪制的范圍
    let path = CGMutablePath()
    // 繪制字符串的范圍可以自己通過路徑自己指定
    path.addRect(rect)
    
    // 4. 創建屬性字符串
    let str: String = "Hello World!"
    let attributedString = NSMutableAttributedString(string: str)
    
    // 5. 創建 framesetter
    let framesetter = CTFramesetterCreateWithAttributedString(attributedString as CFAttributedString )
    
    // 6. 創建 frame
    let frame = CTFramesetterCreateFrame(framesetter, CFRange(location: 0, length: 0), path, nil)
    
    // 7. 繪制
    CTFrameDraw(frame, context!)
}
Snip20160928_12.png

** 文本繪制的過程 **


CoreText_2.png

整個流程大概是:
獲取上下文 ——> 翻轉坐標系 (翻轉坐標主要是由于 UIKit 的坐標系和 CG 框架的坐標系是不一樣的 ) ——> 創建 NSAttributedString ——> 根據NSAttributedString創建CTFramesetter ——>創建繪制區域CGPathRef ——> 根據CTFramesetter 和 CGPath 創建 CTFrame ——> CTFrameDraw 繪制。

**CoreText 視窗組合圖 **

1363570926_6077-2.png

UIGraphicsGetCurrentContext() 獲取的 context 相對于 Quartz ,可以理解為一個畫板。
CTFrame 相對于 CoreText , 也可以理解為一個圖文畫板。最終的目的也就是將 CTFrame 畫板上繪制的圖文 再繪制到 context 上,顯示出來給用戶看。

我們要使用 CoreText 的目的還是要控制 CTFrame 畫板上圖文的繪制。

根據視窗結構圖體現,CTFrame 主要有 CTLine 組成, CTLine 又主要由 CTRun 組成。

注意到上面的示例代碼,發現我們沒有創建 CTLine 和 CTRun,CoreText 會根據 NSAttributedString 的屬性來自動創建 CTRun,CTRun 又組合為CTLine, 每個CTRun對象對應不同的屬性,正因此,你可以自由的控制字體、顏色、字間距等等信息。

在實際的使用中最終步驟:
創建 NSAttributedString ——> 根據NSAttributedString創建CTFramesetter ——>創建繪制區域CGPath ——> 根據CTFramesetter 和 CGPath 創建 CTFrame ——> CTFrameDraw 繪制。

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容

  • CoreText是一個進階的比較底層的布局文本和處理字體的技術,CoreText API在OS X v10.5 和...
    smalldu閱讀 13,598評論 18 129
  • 1.iOS中的round、ceil、floor函數略解 round如果參數是小數,則求本身的四舍五入.ceil如果...
    K_Gopher閱讀 1,208評論 1 0
  • 一、前言 當我們的產品某天站在你身后拍著你的肩膀說:"Hi guys,看看這個效果可以做不,對,這段文字的首字大寫...
    進擊的海飛閱讀 666評論 0 1
  • 發現 關注 消息 iOS 第三方庫、插件、知名博客總結 作者大灰狼的小綿羊哥哥關注 2017.06.26 09:4...
    肇東周閱讀 12,257評論 4 61
  • 翻開屬于我們的記憶 流淌著滿滿的情誼 心里暖暖的,喜歡這種感覺 也許我們分道揚鑣,回頭看看,屬于我們的 就在那里 ...
    蛻變ky閱讀 115評論 0 1