认识 TextKit 2

认识 TextKit 2

认识 TextKit 2：Apple 的下一代文本引擎，经过重新设计，具有更佳的准确性、安全性和性能。发现 TextKit 2 如何帮助您为互联网受众提供更好的文本体验，通过混合文本内容和视觉内容可创建更多样性的布局，并确保流畅的滚动性能。我们将向您介绍最新的 API，深入了解一些实例，并提供 app 现代化指导。

资源
相关视频

WWDC22
- TextKit 和文本视图的新功能
WWDC21
- AppKit 中的新功能
- UIKit 中的新功能
下载

唐娜：嗨我是唐娜谭是一名 TextKit工程师我的同事克里斯威利摩尔稍后将会加入此视频我们要介绍的是TextKit 2 Apple的下一代文本引擎
为了解TextKit 2的全部内容让我们简要回顾一下最初的TextKit 我们称之为TextKit 1 TextKit 1是一个用来驾驭文本布局和显示的文本引擎且横跨所有Apple平台 UIKit和AppKit中的文本控件使用了TextKit 1 来管理文本内容的存储和控制布局
20多年前 TextKit 1首次出现在 OpenStep的系统上多年来它与我们一起成长和发展从macOS 10.0 到iOS 7 到macOS 11和iOS 14
令人惊讶的是 TextKit 1 仍然在所有Apple设备上支持如此多的基本功能几十年来技术设计和工程原理发生了很大变化由于TextKit 1最初的规则定义，因此多年以来提供与我们的新技术完美集成的API 变得更具挑战性同时仍然提供高标准的性能
这就是我们构建TextKit 2的原因 TextKit 2是 Apple的下一代文本引擎建立在前瞻性的设计原则的集合之上你猜怎么着？你已经在Mac上使用TextKit 2了在BigSur中我们更新了整个操作系统中在幕后使用TextKit 2 的许多文本组件大惊喜来了：自macOS 11以来你一直在使用TextKit 2 现在让我们简要回顾一下让我们这么做的架构
TextKit 2与TextKit 1共存
就像它的前身一样 TextKit 2建立在Foundation Quartz和核心文本之上 UIKit和AppKit中的文本控件建立在TextKit 2之上 TextKit 2还松散地保留了其前身的MVC设计视图部分保留在 UIKit和AppKit框架的视图对象中虽然有我们老朋友的新版本 NSTextStorage和NSLayoutManager
除了这些新版本还有更多新的类别和协议加入了模型层和控制器层其中有很多但不要惊慌这些新组件简单、集中且组合起来很强大
它们使你可以更轻松地表达你对文本的各种需求而且不用那么担心系统如何完成你想要的
现在我们已经获得了系统的架构视图让我们深入了解细节
首先我们将讨论TextKit 2的核心设计原则以及这些原则将如何改变你对自定义存储的看法你的应用程序中的布局和文本显示
之后克里斯将引导你完成我们创建的 TextKit 2范例应用程序合作编写一本食谱
此应用程序使用新的TextKit 2 类别在CALayer中布局和显示文本在这里你将了解设计原则如何在实践中发挥作用
最后我们将介绍一些重要的技术细节用于为TextKit 2 将你的应用程序现代化
那么让我们从设计原则开始吧
TextKit 2的核心高层设计原则是正确性、安全性和性能我们采取了一种平衡的方法这三个原则都很重要所以没有优先顺序我们将在其中讨论它们
这些高级设计原则中的每一个都告知了系统中的特定设计更改
为了正确性 TextKit 2 将字形处理抽象化了
为了安全 TextKit 2更加关注值语义
而对于性能 TextKit 2使用基于视区的布局和渲染
我们将从正确性开始在这方面我们抽象化了字形处理以对于国际化文本提供一致的体验 Apple设备在世界各地都有用户因此提供正确布局非常重要呈现和交互所有语言和脚本的文本
我们希望每个人都能够在他们的设备上阅读文本并与之交互并且一些TextKit 1API的设计使得难以用普遍正确的方式处理国际化文本
要理解为什么我们首先需要了解什么是字形字形是一个或若干个字符的视觉表现
在许多西方语言中一个字形通常代表一个字符但这并不总是正确的
你可以有多个字形代表一个字符也可以相反单个字形可以代表多个字符
这个用于表示多个字符的单独字形就称为连字
西方语言没有太多的连字它们通常不会影响文本的易读性你仍然可以在没有连字的情况下阅读它
但并非所有语言都是如此像阿拉伯语和梵文这样的书写体使用大量连字它们确实会影响易读性看这个用阿拉伯文字写成的词
这是一个乌尔都语单词意思是“瞬间” 现在花点时间比较这两个渲染
在右边用连字书写的完整单词看起来与在左边单独的字符大不相同
该语言的母语读者会认为左边的版本难以辨认
TextKit 1中的许多API 需要使用字形索引或范围例如要获取某些文本的边界矩形你需要知道你想要的文本的字形范围
如果文本是西方语言找出正确的字形范围还行
在这个英语例子中很容易找到文本的前四个字符的字形范围
现在看看卡纳达语一种印度数百万人使用的书写体和语言
它不仅使用了大量连字而且字形可用各种有趣的方式重新排序和组合
这在卡纳达语意为“十月” 在4号字符索引处有一个分割元音所以它被分割成两个字形
然后左边是字符一和二在两者的连字产生之前字形间的重新排序
代表3号索引字符的字形也被替换为连接形式
最后它被绘制在一个字形下方在分裂元音中现在如果你不明白我刚才说的话那完全没问题
这些是框架应该为你处理的细节这样你就可以专注于构建你的应用程序
重点是在这样的文本里找到前四个字符的字形范围这是不可能的
没有单个字形范围可以代表那四个字
由于许多TextKit 1API 需要字形范围使用这些API 可能会破坏像这样复杂脚本的布局和渲染这就是TextKit 2 抽象化字形处理的原因 TextKit 2使用CoreText 呈现所有文本… 因此你将自动获得复杂脚本的正确渲染
使用TextKit 2 你根本不必管理字形相反地你使用更高级别的对象控制文本布局和交互
这是NSTextSelection 这些更高级别的对象之一
它包含表示文本选取的所有必要上下文比如它的粒度它的亲和力以及组成选取的可能不相交的文本范围
NSTextSelection上的这些属性是只读的所以你不会修改选取对象的实例来改变它们相反地你使用NSTextSelection Navigation的实例对文本选取执行操作接收表示结果选取的 NSTextSelection的新实例
你可以要求导航对象为你提供选取由点击或鼠标在屏幕上的某个点按下的事件所产生的或从向前或向后导航得到一个新的选取结果这使作业上变得更容易就像将选取对象向前扩展一个词的范围并得到正确的结果考虑在从右到左的语言中的双向文本
现在我想让你注意关于这些新的选取API 一些有趣的事情这个方法需要一个 NSTextLocation 这是TextKit 2中的另一个新对象
见见NSTextLocation和NSTextRange
它们与UIKit中的UITextPosition 和UITextRange类别非常相似除非你不需要对它们进行子类化大多数情况下你将会通过TextKit 2 使用默认的位置和范围对象
使用对象而不是整数能允许更具表现力的文件模型因为范围是根据彼此相对的位置定义的 HTML文件对象模型就是一个很好的例子由于它具有嵌套元素因此位置需要代表在文件中的绝对位置以及可见文本中的位置这不能用单一的数字索引来表达
这就是正确性接下来是安全
在这方面我们设计的 TextKit 2更强调了值语义能更好地与Swift和SwiftUI 等技术的目标保持一致
当我说“值语义”时我不是在谈论值类型我们没有把NSLayoutManager 变成一个结构体
值类型保留着其数据的唯一副本以防止该数据发生突变这能使你的代码更安全、更稳定通过消除非计划中的共享和相关的副作用但是值类型并不是获得这种好处的唯一方法
不可变类具有初始化后无法更改的属性这也可以防止他们的数据发生突变
这些类的行为与值类型相似因此我们将它们称为具有值语义如果要更改这些对象之一中的数据你必须制作一个全新的实例来代替原来的而TextKit 2中的许多类别都是这样设计的
为了说明这种设计更改的好处让我们重新回忆一下 TextKit 1的设计文本从存储器到屏幕的流向以前是这样工作的
对文本存储的更新通知了布局管理器然后它会生成字形定位它们并将它们直接绘制到视图中
使用这种将字形直接绘制到视图中的方法会很难弄清楚在何处分隔文本以创建自定义绘图空间
为了理解我的意思看看这个来自范例应用程序先睹为快的截图我在其中对食谱留下了一些评论
注意评论是如何显示在它所指的食谱下方的它是用这种独特的气泡形状绘制的靛蓝色背景和白色文本
我们应该采取什么方法在正确的位置插入注释并使它们看起来与文本的其余部分不同？
你可能希望通过将配方文本分成有意义的单元或元素来做到这点将每个评论放在自己的元素中并将每个评论放在与之相关的食谱之后同时提供如何绘制注释的说明在TextKit 1中现实就大不相同了你必须担心很多细节比如找到字形索引确保字形不在字位簇的中间如果是则调整该字形索引更改行间距并尽可能自定义线段的几何
这些细节与你尝试做的事情无关因此在TextKit 2上我们的目标是将期望变为现实我们改变了系统中的文本流使这样的方法成为可能
以下是该流程在TextKit 2中的工作方式
对文本存储的更新会通过一个称为内容管理器的新对象
内容管理器将文本分成元素并追踪它们的状态当需要进行布局时文本布局管理器会向内容管理器询问元素
然后文本布局管理器会将元素布置到文本容器中并生成包含布局和定位信息的布局片段
当需要展示时布局片段会被移交给协调位置的 ViewportLayoutController 以及你选取的渲染表面中这些片段的布局无论是视图还是图层
如你所见此过程涉及许多新对象值语义的重要性在此体现了出来
你通过在正确的点挂入系统控制文本的布局和显示并从使用值语义的对象获取你需要的信息
要进行更改你需要创建具有你想要的更改的值的对象之中的新实例并将它们交还给系统系统使用了替换对象中的值用于布局和显示
那么现在让我们认识这些新对象并识别在它们系统中你可以接收或更换的不同的点我们将从存储对象开始
这是NSTextElement 元素是文件的构建模块每个元素代表内容的一部分并包含一个范围描述它在文件中的位置元素具有值语义它们的属性包括范围是在创建元素后不可变且不能改变的
将文件建模为一系列元素而不是一系列字符给了我们更多的力量我们获得了轻松区分元素代表什么样的内容的能力无论是一段文本一个附件或其他一些自定义类型我们可以根据元素的类型决定如何布置元素
现在让我们认识一下 NSTextContentManager
内容管理器知道如何从文本内容生成元素并追踪整个文档中这些元素的范围它还知道如何使用后备存储以及如何生成新元素以及更新的范围当后备存储中的内容发生变化时
把内容管理器当成是后备存储的包装器
内容管理器提供了将原始数据转换为元素的接口
NSTextContentManager 和NSTextElement 都是抽象类型因此如果你需要使用自定义文件模型则可以对它们进行子类化或自定义后备存储标题和文档提供了有关如何执行此操作的指导但大多数情况下你可以使用TextKit 2 提供的默认设置
认识NSTextContentStorage 和NSTextParagraph 这些是默认的内容管理器和元素类型 NSTextContentStorage是一个使用 NSTextStorage 作为后备存储的内容管理器
它知道如何将文本存储的内容划分为段落元素它们是NSTextParagraph的实例 NSTextContentStorage也知道如何当文本存储中的文本发生变化时生成更新的段落元素这让我想到一个重点
在对底层文本存储进行更改时你应该将更新打包在这个 performEditingTransaction方法中这确保了 TextKit 2系统的其他部分收到你的更改通知
你可以用内容存储代理做一些很酷的事情无需实现完整的 NSTextContentManager子类
在这个视频的后面克里斯将介绍如何使用内容代理无需修改文本存储来更改评论字体和颜色以及如何完全隐藏评论所以请继续关注更多细节
好的现在我们了解了TextKit 2 如何从你的文本内容中创建元素这处理了我们新方法的前两个步骤
内容存储自动将文本分成段落元素它还知道如何为新评论创建新段落
接下来让我们弄清楚如何实现最后的两个步骤：评论的定位和显示回到我们的流程图我们需要获取评论元素的布局信息有新的布局对象可以帮助我们完成这些任务现在来看看它们吧
见识一下NSTextLayoutManager 文本布局管理器控制着文本布局的过程 NSTextLayoutManager类似于来自 TextKit 1的旧NSLayoutManager 但有一个主要区别： NSTextLayoutManager不会处理字形
相反地 NSTextLayoutManager获取文本元素将它们布置到文本容器中并为这些元素生成布局片段
你可以使用布局片段来获取文本元素的布局信息那么现在让我们了解一下布局片段
认识NSTextLayoutFragment 布局片段包含一个或多个文本元素的布局信息就像元素一样它们使用值语义并且它们的属性是不可变的
所以文本布局管理器将为我们的每个评论元素创建布局片段然后我们可以使用来自布局片段的信息来定位和显示它们
布局片段通过三个属性传达布局信息：一个textLineFragments数组 layoutFragmentFrame 和renderingSurfaceBounds
如果你想自定义或更改布局通过这每一个属性了解你获得的信息至关重要所以我们接下来会讨论这个
对于第一个属性我们将遇到NSTextLineFragment 行列片段包含了布局片段中每一行文本的测量信息
这些对于获取几何信息很有用用于特定行或计算布局片段中的行数
第二个属性布局片段框架描述布局片段中的文本如何布局在文本容器区域内在TextKit 2中文字布局基本上是在容器内把布局片段框架堆叠起来的把这些框架想象成瓷砖系统正在把文本容器区域划分成瓦片其中每个布局片段是一个单一的瓷砖
空行有自己的布局片段框架如图所示一般来说布局片段框架可用于在UI中的片段内容附近定位其他视图或用于计算文本内容的总高度
现在这个框架不能准确地代表绘制文本本身所需的空间该信息来自第三个属性渲染表面边界描述了绘制文本所需的区域这是你所要使用的矩形获取视图坐标空间中文本的大小这与布局片段的框架不同因为文本可能会超出片段框架的边缘变音符号会发生这种情况或者如此处所示带有斜体字体的下缘钩注意J的左下边缘如何从布局片段框架中伸出一点点它并没有那么突出所以这里有一个更极端的例子
某些字体如Zapfino 具有延伸很远的字形超出排版范围渲染表面边界会更大在这种情况下而不是布局片段框架
现在我们了解了布局片段提供的布局信息让我们退后一点谈谈如何使用这些信息来自定义文本元素的布局
由于布局片段是不可变的你不能直接在一个片段上改变布局信息
回到我们的流程图我们需要钩入布局过程并创建NSTextLayoutFragment的新实例使用我们想要更改的信息
然后你使用这个代理方法在NSTextLayoutManager上连接到布局过程当文本布局管理器在布局过程中调用此方法正在从元素生成布局片段在这里你有机会对于一个元素创建自己的布局片段
这完成了最后两个步骤在我们解决评论问题的方法中我们通过使用 NSTextLayoutFragment的子类处理定位和自定义绘图我们的评论布局片段并在文本布局管理器代理中提供我们自定义片段的实例
在这个视频的后面克里斯将在我们的范例应用程序中演示这是如何完成的
这就是安全现在让我们继续讨论性能
性能是任何文本引擎面临的最大挑战之一 TextKit 2对于非常广泛的场景来说非常快从快速渲染每个只有几行的标签到布置数百兆字节的文档以交互速率滚动浏览对于这些场景当你滚动浏览这些非常大的文档时以可变速率和不连续的文本布局出色的性能是绝对是必不可少的
让我们回顾一下连续和非连续布局之间的区别
此图显示了一个文件其中黄色矩形表示屏幕上的可见内容区域
连续布局从文档的最开头开始并按顺序从文本的开头到结尾
因此如果你滚动到文档中间某个点连续布局会对于在那之前出现的所有文本执行布局
这包括了在屏幕上滚动的所有文本一路回到了开头如果有很多文本性能可能会很慢滚动时可能会出现动画卡顿在最坏的情况下它可能会挂起
相反地非连续布局意味着我们可以在文档中的任何地方布置一段文本而不布置它之前的碎片
现在当你滚动到文档中间时该可见区域会立即进行布局
这通过了仅对在屏幕上可见的文本部分执行布局来提高性能加上一个额外的过度滚动区域从而获得更流畅的滚动体验 TextKit 2中的布局总是不连续的
相比之下非连续布局在 TextKit 1中是可选的
它是通过NSLayoutManager上的布尔属性启用的这个API很简单但是因为很简单所以无法表达布局的状态信息在你请求布局信息时
非连续布局依赖于在文件的其他部分被布局好之后可能会改变的估计在TextKit 1上你只能打开或关闭非连续布局无法控制文档的哪些部分被布局并且无法知道布局何时完成以及布局估计值被更新为实际值
TextKit 2API更丰富、更具表现力
TextKit 2为可见内容区域中的元素提供一致的布局信息并在该可见区域的布局更新时通知你
该区域称为视区你可以在视区布局之前期间、和之后通过调整或重新定位来管理视区并获得回叫函数
为了获得最佳性能你的代码应该关注处理视区区域内的布局信息尽可能避免为视区外的元素请求布局信息
视区外元素的布局信息可能不太准确除非你明确询问以确保与这些元素对应的文本范围的布局此调用可能很昂贵尤其是对于大型文档
回顾我们之前的流程图还有另一个新的控制器类别帮助我们管理视区
认识 NSTextViewportLayoutController 这是视区布局信息的真实来源它与文本布局管理器对话以获取布局片段对于视区区域内的元素你可以通过文本布局管理器上的属性访问视区布局控制器
现在我们已经遇到了视区布局控制器我们来谈谈如何参与进入视区布局过程中
视区布局控制器对其代理在视区布局过程中调用了三个重要的方法： TextViewportLayoutController WillLayout、textViewportController configureRenderingSurface FortextLayoutFragment 和textViewportLayoutController DidLayout
首先视区布局控制器在视区中布置元素之前调用了willLayout方法在这里你可以进行任何设置工作以准备布局例如清除视图或图层的内容
接下来视区布局控制器会调用 configureRenderingSurface 对于在视区中可见的每个布局片段你可以在此处更新每个片段视图或图层的几何形状
最后视区布局控制器布局完成后调用 didLayout方法在视区中可见的所有布局片段
在这里你可以在视区布局完成后执行任何需要的更新就像你想调整视区一样使最后一个元素在屏幕上完全可见这就是对性能的总结现在我将把它交给克里斯来向你展示如何在实践中使用TextKit 2 谢谢唐娜我们编写了一个范例应用程序演示了一些不同的方式让你可以使用TextKit 2 来布置应用程序中的文本并与之交互你可以下载此视频中使用的范例代码让我们打开它并尝试一下我们正在使用此协作应用程序来查看食谱书这样我们就可以弄清楚我们午餐想做什么滚动浏览食谱如预期般地工作但在幕后却发生了一些特别的事情：仅有视区中可见的段落被绘制出来而不是每个段落都被渲染在同一个大平面上每个段落都被渲染到自己的图层中
如果我单击此处工具栏中的 “显示边界”按钮这些彩色矩形会出现橙色矩形会显示每层的边界将文本绘制到单独的图层中让我们实现一个有趣的功能：我可以对食谱发表评论现在我觉得鸡蛋三明治听起来不错所以我要双击这一段然后输入“嘿这听起来不错” 然后按回车键插入评论
我刚刚往文档里插入了一个新段落气泡背景则是通过 NSTextLayoutFragment的自定义子类所绘制称为BubbleLayoutFragment 我们稍后会再谈
特别的是当我往文档插入评论时所有在评论下方的段落都会移动以腾出空间如果你第一次没有看到我将点击工具栏中的这个乌龟按钮来启用慢速模式
让我们添加另一个评论 “是啊今天就去吃午饭吧” 按回车后评论就被添加到它下面的文件而且它下面的所有段落里都在缓慢地跑着动画如果你想隐藏所有评论你可以单击在工具栏中的 “切换评论”按钮这实际上并不是在编辑底层文档而是询问文本内容管理器在为了布局枚举文本元素时跳过注解
TextKit 2在iOS上和在macOS 上一样好用这意味着macOS应用程序的TextKit 2 部分可以在iOS上重复使用让我们在iPad上运行它
我们已经使用这些部分编写了我们协作应用的iOS 版本具有所有相同的功能我长按一个段落发表评论然后输入“嘿听起来不错” 并按回车
就像macOS上的应用程序一样我可以点击评论显示/隐藏按钮隐藏所有评论
我刚刚浏览了一个应用程序它使用了TextKit 2的布局、绘制和与文本交互现在让我们回顾一下范例应用程序中的一些代码以及TextKit 2如何使它成为可能
该应用程序演示了 TextKit 2提供的许多功能但我现在想专注于两个领域：它是如何使用 NSViewportLayoutController 在视区中布置文本以及它如何实现自定义隐藏行为和评论的呈现
当文本布局管理器即将布局文档时或者因为它发生了变化容器大小已更改或文档中以前未见过的部分已移入视区它会调用 textViewportLayout ControllerWillLayout 在其视区布局代理上我们在这里使用它来清除所有文本子层并开启一个动画交易
对于文本布局管理器所布局的每个文本元素它会调用 textViewportLayoutController configureRenderingSurfaceFor textLayoutFragment 在这里我们要显示一个图层文本布局片段更新其几何形状将其动画化到它的新位置如果可能并将它添加作为视图的子层
当布局管理器完成布局后它会调用textViewportLayout ControllerDidLayout 我们提交动画事务更新选取亮点并更新内容大小以便正确放置滚动拇指
现在让我们来谈谈评论 TextKit 2提供了几个可用于自定义布局元素的钩子和布局片段生成我将向你展示我们如何在文档中接受评论为显示设置自定义属性如字体和颜色并在它们后面绘制气泡
对于文档中的每个段落文本内容存储为其代理提供了机会来自定义该段落的属性在我们的实现中我们在评论上设置自定义字体和颜色无需更改底层文本存储的字体或颜色
文本内容管理器还让其代理人在布局期间有机会决定文本布局管理器将显示哪些文本元素
文本元素错误的返回会阻止其被显示在这里我们通过选取不枚举来隐藏评论无需从底层文本存储中实际删除它们
文本布局管理器也有一个代理通过在textElement中实现textLayoutManager textLayoutFragmentForlocation 代理可以生成自定义文本布局片段而不是默认给定NSTextElement的 NSTextLayoutFragment实例在这种情况下当它遇到一个代表一条评论的 NSTextElement 它会创建一个 BubbleLayoutFragment 这是NSTextLayoutFragment的自定义子类
BubbleLayoutFragment会覆盖 NSTextLayoutFragment的绘制方法好在调用顶部绘制文本的基类实现之前绘制背景气泡请注意目前正在通过我们之前设置的自定义字体和文本颜色来呈现文本
我讲解了范例应用程序如何使用TextKit 2 执行基于视区的文本动画布局以及它如何在这些彩色气泡中呈现评论一路从自定义属性到在文本存储中自定义绘图但是范例代码中还有更多利用TextKit 2提供的新API 包括诠释鼠标事件以确定文本选取渲染文本选取突出显示在文件中的特定段落放置评论弹出框以及估计文档高度等你可以在范例代码中找到所有这些主题的进一步讨论让我们交回给唐娜来谈谈为TextKit 2 准备你的应用程序谢谢克里斯这是TextKit 2 如何实际应用的一个好例子既然我们已经讨论了 TextKit 2可以做什么让我们讨论一些应用程序现代化的方法
到目前为止我们讨论的所有内容都适用于创建你自己的 TextKit 2堆栈与通用视图或图层一起使用所有新类别都可以在iOS 15的UIKit 和macOS 12的AppKit中使用因此如果你想走这条路今天就可以开始使用 TextKit 2编写新代码
另一方面许多应用程序使用内置的文本控件如文本视图充分利用所有出色的免费功能例如辅助功能支持以及选取和编辑服务其中一些控件已为使用TextKit 2 而经过更新如果你的应用程序使用内置控件还有一些额外的细节需要注意保持兼容性对我们和对你都很重要由于TextKit 1是内置文本控件不可或缺的一部分我们将竭尽全力维护使用它们的应用程序的兼容性这就是为什么在iOS 15 和macOS 12中只有一些控件自动使用 TextKit 2的原因
此外某些控件需要采取额外的步骤才能在这些操作系统版本中使用TextKit 2 对于AppKit开发者 NSTextView 不会自动使用TextKit 2
如果要将TextKit 2与NSTextView 一起使用则需要在创建时以编程方式选取加入
做法如下：首先创建一个文本布局管理器接下来创建一个文本容器然后使用 NSTextLayoutManager上的 textContainer属性将文本容器与文本布局管理器关联起来最后使用指定的初始化程序创建你的NSTextView 与文本容器现在你将拥有一个使用 TextKit 2的文本视图
你可以通过NSTextView上新的属性访问文本布局管理器和文本内容存储只有一件事要小心
回想一下NSTextView 有个layoutManager属性它允许获取和设置它的 NSLayoutManager
NSLayoutManager 是个TextKit 1对象它与TextKit 2堆栈不兼容
文本视图不能同时拥有布局管理器和文本布局管理器
所以就这样吧我们为NSTextView 在需要将其切换到TextKit 1的时候添加了特殊的兼容模式文本视图可以自动检测是否需要使用该模式并用NSLayoutManager 来替换 NSTextLayoutManager 为了获得最佳性能文本视图将从那时起保留在兼容模式下
即使你选取使用TextKit 2 你的文本视图也会自动切换到TextKit 1 如果你在你的文本视图或文本容器上明显地调用layoutManager 属性的话
如果遇到尚不支持的文本内容或侦测到需要TextKit 1的其他条件文本视图也会切换
这也可能发生在场域编辑器身上 NSTextField的字段编辑器默认使用TextKit 2 但是如果你的文本字段子类从字段编辑器的布局管理器请求布局信息字段编辑器将会为了该窗口中的所有文本字段切换到TextKit 1
系统会在文本视图切换到 TextKit 1 之前和之后发出通知你可以观察这些通知以接收此信息
通知对象包含对更改模式的确切文本视图的引用
欲知完整详情有关在AppKit的 TextKit 1兼容模式请参考在Apple 开发者门户上的文档
对于UIKit开发人员 UITextField在iOS 15中自动使用TextKit 2
带有TextKit 2的 UITextView在iOS 15中则不可用
我们正在努力确保所有使用UITextView的应用程序的最大兼容性并且它们的数量相当多同时你可以查看现有的代码来使用UITextView的 layoutManager属性并考虑如何使用 TextKit 2表达你的意图这样一来一旦它可用了你就可以准备过渡
本环节到此结束现在你已经认识了TextKit 2 Apple的新文本引擎带我们进入了未来我们期待看到你使用 TextKit 2构建的内容谢谢观看 [轻快的音乐]

32:22 - Responding to layout updates: textViewportLayoutControllerWillLayout()

func textViewportLayoutControllerWillLayout(_ controller: NSTextViewportLayoutController) {
    contentLayer.sublayers = nil
    CATransaction.begin()
}

32:47 - Responding to layout updates: textViewportLayoutController(_:configureRenderingSurfaceFor:)

private func animate(_ layer: CALayer, from source: CGPoint, to destination: CGPoint) {
    let animation = CABasicAnimation(keyPath: "position")
    animation.fromValue = source
    animation.toValue = destination
    animation.duration = slowAnimations ? 2.0 : 0.3
    layer.add(animation, forKey: nil)
}

private func findOrCreateLayer(_ textLayoutFragment: NSTextLayoutFragment) -> (TextLayoutFragmentLayer, Bool) {
    if let layer = fragmentLayerMap.object(forKey: textLayoutFragment) as? TextLayoutFragmentLayer {
        return (layer, false)
    } else {
        let layer = TextLayoutFragmentLayer(layoutFragment: textLayoutFragment, padding: padding)
        fragmentLayerMap.setObject(layer, forKey: textLayoutFragment)
        return (layer, true)
    }
}

func textViewportLayoutController(_ controller: NSTextViewportLayoutController,
                                  configureRenderingSurfaceFor textLayoutFragment: NSTextLayoutFragment) {
    let (layer, layerIsNew) = findOrCreateLayer(textLayoutFragment)
    if !layerIsNew {
        let oldPosition = layer.position
        let oldBounds = layer.bounds
        layer.updateGeometry()
        if oldBounds != layer.bounds {
            layer.setNeedsDisplay()
        }
        if oldPosition != layer.position {
            animate(layer, from: oldPosition, to: layer.position)
        }
    }
    if layer.showLayerFrames != showLayerFrames {
        layer.showLayerFrames = showLayerFrames
        layer.setNeedsDisplay()
    }
    
    contentLayer.addSublayer(layer)
}

33:10 - Responding to layout updates: textViewportLayoutControllerDidLayout()

func textViewportLayoutControllerDidLayout(_ controller: NSTextViewportLayoutController) {
    CATransaction.commit()
    updateSelectionHighlights()
    updateContentSizeIfNeeded()
    adjustViewportOffsetIfNeeded()
}

33:47 - Overriding text attributes for comments

func textContentStorage(_ textContentStorage: NSTextContentStorage, textParagraphWith range: NSRange) -> NSTextParagraph? {
    // In this method, we'll inject some attributes for display, without modifying the text storage directly.
    var paragraphWithDisplayAttributes: NSTextParagraph? = nil
    
    // First, get a copy of the paragraph from the original text storage.
    let originalText = textContentStorage.textStorage!.attributedSubstring(from: range)
    if originalText.attribute(.commentDepth, at: 0, effectiveRange: nil) != nil {
        // Use white colored text to make our comments visible against the bright background.
        let displayAttributes: [NSAttributedString.Key: AnyObject] = [.font: commentFont, .foregroundColor: commentColor]
        let textWithDisplayAttributes = NSMutableAttributedString(attributedString: originalText)
        // Use the display attributes for the text of the comment itself, without the reaction.
        // The last character is the newline, second to last is the attachment character for the reaction.
        let rangeForDisplayAttributes = NSRange(location: 0, length: textWithDisplayAttributes.length - 2)
        textWithDisplayAttributes.addAttributes(displayAttributes, range: rangeForDisplayAttributes)
        
        // Create our new paragraph with our display attributes.
        paragraphWithDisplayAttributes = NSTextParagraph(attributedString: textWithDisplayAttributes)
    } else {
        return nil
    }
    // If the original paragraph wasn't a comment, this return value will be nil.
    // The text content storage will use the original paragraph in this case.
    return paragraphWithDisplayAttributes
}

34:06 - Hiding comments

func textContentManager(_ textContentManager: NSTextContentManager,
                        shouldEnumerate textElement: NSTextElement,
                        with options: NSTextElementProviderEnumerationOptions) -> Bool {
    // The text content manager calls this method to determine whether each text element should be enumerated for layout.
    // To hide comments, tell the text content manager not to enumerate this element if it's a comment.
    if !showComments {
        if let paragraph = textElement as? NSTextParagraph {
            let commentDepthValue = paragraph.attributedString.attribute(.commentDepth, at: 0, effectiveRange: nil)
            if commentDepthValue != nil {
                return false
            }
        }
    }
    return true
}

34:28 - Generating special layout fragments for comments

func textLayoutManager(_ textLayoutManager: NSTextLayoutManager,
                       textLayoutFragmentFor location: NSTextLocation,
                       in textElement: NSTextElement) -> NSTextLayoutFragment {
    let index = textLayoutManager.offset(from: textLayoutManager.documentRange.location, to: location)
    // swiftlint:disable force_cast
    let commentDepthValue = textContentStorage!.textStorage!.attribute(.commentDepth, at: index, effectiveRange: nil) as! NSNumber?
    if commentDepthValue != nil {
        let layoutFragment = BubbleLayoutFragment(textElement: textElement, range: textElement.elementRange)
        layoutFragment.commentDepth = commentDepthValue!.uintValue
        return layoutFragment
    } else {
        return NSTextLayoutFragment(textElement: textElement, range: textElement.elementRange)
    }
}

34:58 - Drawing the comment bubble

var commentDepth: UInt = 0

private var tightTextBounds: CGRect {
    var fragmentTextBounds = CGRect.null
    for lineFragment in textLineFragments {
        let lineFragmentBounds = lineFragment.typographicBounds
        if fragmentTextBounds.isNull {
            fragmentTextBounds = lineFragmentBounds
        } else {
            fragmentTextBounds = fragmentTextBounds.union(lineFragmentBounds)
        }
    }
    return fragmentTextBounds
}

// Return the bounding rect of the chat bubble, in the space of the first line fragment.
private var bubbleRect: CGRect { return tightTextBounds.insetBy(dx: -3, dy: -3) }

private var bubbleCornerRadius: CGFloat { return 20 }

private var bubbleColor: Color { return .systemIndigo }

private func createBubblePath(with ctx: CGContext) -> CGPath {
    let bubbleRect = self.bubbleRect
    let rect = min(bubbleCornerRadius, bubbleRect.size.height / 2, bubbleRect.size.width / 2)
    return CGPath(roundedRect: bubbleRect, cornerWidth: rect, cornerHeight: rect, transform: nil)
}

override var renderingSurfaceBounds: CGRect {
    return bubbleRect.union(super.renderingSurfaceBounds)
}

override func draw(at renderingOrigin: CGPoint, in ctx: CGContext) {
    // Draw the bubble and debug outline.
    ctx.saveGState()
    let bubblePath = createBubblePath(with: ctx)
    ctx.addPath(bubblePath)
    ctx.setFillColor(bubbleColor.cgColor)
    ctx.fillPath()
    ctx.restoreGState()
    
    // Draw the text on top.
    super.draw(at: renderingOrigin, in: ctx)
}

37:26 - Opting NSTextView in to TextKit 2

var scrollView: NSScrollView!
var containerSize = CGSize.zero
var textContainer = NSTextContainer()

// Important: Keep a reference to text storage since NSTextView weakly references it.
var textContentStorage = NSTextContentStorage()

override func viewDidLoad() {
    super.viewDidLoad()
    
    scrollView =
        NSScrollView(frame: NSRect(origin: CGPoint(),
                                   size: CGSize(width: view.bounds.width, height: view.bounds.height)))
    scrollView.translatesAutoresizingMaskIntoConstraints = false
    view.addSubview(scrollView)
    
    NSLayoutConstraint.activate([
        scrollView.leadingAnchor.constraint(equalTo: (view.leadingAnchor)),
        scrollView.trailingAnchor.constraint(equalTo: (view.trailingAnchor)),
        scrollView.topAnchor.constraint(equalTo: (view.topAnchor)),
        scrollView.bottomAnchor.constraint(equalTo: (view.bottomAnchor))
        ])
    
    setUpScrollView(scrollsHorizontally: false)
}

func setUpScrollView(scrollsHorizontally: Bool) {
    scrollView.borderType = .noBorder
    scrollView.hasVerticalScroller = true
    scrollView.hasHorizontalScroller = scrollsHorizontally
    
    setUpTextContainer(scrollsHorizontally: scrollsHorizontally)
    setUpTextView(scrollsHorizontally: scrollsHorizontally)
}

func setUpTextContainer(scrollsHorizontally: Bool) {
    let contentSize = scrollView.contentSize
    if scrollsHorizontally {
        containerSize = NSSize(width: CGFloat.greatestFiniteMagnitude, height: CGFloat.greatestFiniteMagnitude)
        textContainer.containerSize = containerSize
        textContainer.widthTracksTextView = false
    }
    else {
        containerSize = NSSize(width: contentSize.width, height: CGFloat.greatestFiniteMagnitude)
        textContainer.containerSize = containerSize
        textContainer.widthTracksTextView = true
    }
}

func setUpTextView(scrollsHorizontally: Bool) {
    let textLayoutManager = NSTextLayoutManager()
    textLayoutManager.textContainer = textContainer

    textContentStorage.addTextLayoutManager(textLayoutManager)

    // Workaround: Pass textLayoutManager.textContainer to the NSTextView initializer
    let textView = NSTextView(frame: scrollView.contentView.bounds, textContainer: textLayoutManager.textContainer)

    textView.isEditable = true
    textView.isSelectable = true
    textView.minSize = CGSize()
    textView.maxSize = containerSize
    textView.isVerticallyResizable = true
    textView.isHorizontallyResizable = scrollsHorizontally
    textContentStorage.performEditingTransaction {
        textView.textStorage?.append(NSAttributedString(string: "Text content..."))
    }
    scrollView.documentView = textView
}

正在查找特定内容？在上方输入一个主题，就能直接跳转到相应的精彩内容。

提交你查询的内容时出现错误。请检查互联网连接，然后再试一次。

资源

相关视频

WWDC22

WWDC21