ios - 你如何在 Swift 中为 iOS 制作垂直文本 UILabel 和 UITextView？

Question

如果您根据标题来到这个问题但对蒙古语不感兴趣，您可能正在寻找这个问答:

• Swift: How can you rotate text for UIButton and UILabel?

---

我一直在学习 Swift，以便为 traditional Mongolian 开发 iOS 应用程序.问题是传统的蒙古文是从上到下、从左到右竖写的。我的问题是如何在垂直显示文本的同时进行换行？

如果您稍等片刻，我会尝试更清楚地解释问题。下面是我想要实现的那种 TextView 的图像。以防外国脚本让您失望，我已经包含了遵循相同模式的英文文本。事实上，如果应用程序有任何英文文本要显示，它应该是这样的。

对于简单的单行 UILabel，顺时针旋转 90 度即可。但是，对于多行 UITextView，我需要处理换行。如果我只是做一个简单的 90 度旋转，那么写的第一件事最终会出现在最后一行。

到目前为止我已经制定了一个我认为可以克服这个问题的计划:

1. 制作一个自定义字体，其中所有字母都垂直镜像。
2. 将 TextView 顺时针旋转 90 度。
3. 水平镜像 TextView 。

这应该会处理文本换行。

我可以做镜像字体。但是，我不知道如何对 UITextView 的旋转和镜像进行 Swift 编码。我发现以下链接似乎提供了部分解决方案的提示，但它们都在 Objective C 中而不是在 Swift 中。

• How to rotate sub-views around their own centres?
• Rotate UIView around its center keeping its size
• iOS: Mirror content on screen
• Mirroring UIView

应用商店中有传统的蒙古语应用程序(如 this 和 this )，但我还没有找到任何人分享他们的源代码，所以我不知道他们在幕后做了什么显示文本。我计划将我的代码开源，以便将来其他人为数百万阅读传统蒙古语的人开发应用程序并不那么困难。如果您能为这项工作提供任何帮助，我将不胜感激，蒙古人民也将不胜感激。即使您不了解自己，对这个问题进行投票以使其更加明显也会有所帮助。

更新

@sangonz 的答案仍然是一个很好的答案，但我暂时将其取消标记为已接受的答案，因为我无法让所有内容正常工作。具体来说:

• 启用滚动(通过在 ScrollView 中嵌入自定义 View 或通过 subclassing UIScrollView )。在 github 项目中，@sangonz 说这应该很容易，但对我来说不是。
• 在方向改变时重新布局(而不是拉伸(stretch))字线。我认为这不应该太难通过更多的研究来解决。
• 为什么文本行没有一直延伸到 View 的边缘？底部有一个很大的缺口。
• 如何取消自定义垂直 View 的 NSTextStorage 与其他 UITextView 的链接。(参见 this question)

到目前为止I have been using the original method我在上面提出了建议，但我真正想要的是获得类似于@sangonz 提议的东西。

我现在也在考虑替代方法，比如

• Using Core Text , 缺点:感觉像是在重新发明轮子
• Using WebKit , 缺点:Apple 不再为他们的 UITextView
使用 WebKit

Answer 1

编辑:这就是我最终做到的。

这是我的 GitHub 中的一个非常基本的实现:Vertical-Text-iOS .

没什么特别的，但它确实有效。最后我不得不混合使用 TextKit 和图像处理。看一下代码。它涉及:

1. 子类化 NSTextContainer 以获得正确的文本尺寸。
2. 创建自定义 UIView 以呈现文本，对每一行应用仿射变换，并使用 NSLayoutManager 进行呈现以保留所有 TextKit 功能。

---

TextKit 方式

保留所有原生文本优势(例如突出显示、选择...)的正确方法是使用标准 TextKit API。您提出的方法会破坏所有这些，或者可能会导致奇怪的行为。

但是，iOS 中的 TextKit 似乎还不支持开箱即用的垂直方向，但它已为此做好了准备。附带说明一下，在 OS X 中它在一定程度上受到支持，您可以调用 textView.setLayoutOrientation(.Vertical)，但它仍然有一些限制。

The NSTextLayoutOrientationProvider protocol defines an interface providing the default orientation for text laid out in a conforming object, in absence of an explicit NSVerticalGlyphFormAttributeName attribute. The only UIKit class that implements this interface is NSTextContainer, whose default implementation returns NSTextLayoutOrientationHorizontal. An NSTextContainer subclass that handles vertical text could set this property to NSTextLayoutOrientationVertical to support the custom layout orientation logic.

来源:UIKit > NSTextLayoutOrientationProvider Protocol Reference for iOS

总而言之，您应该开始子类化 NSTextContainer，您将不得不处理 NSLayoutManager 和 NSTextContainer很多。

---

自定义图片处理方式

另一方面，如果您决定遵循自定义文本呈现，我建议采用以下方法。

1. 将普通文本呈现 到具有普通字体的隐藏层。为其边界框指定正确的尺寸。
2. 获取文本属性，主要是文本高度和行间距。
3. 处理图像 按照从下到上的相反顺序绘制每条线，如下图所示。结果你应该得到一个新的 CGImage。
4. 旋转图像 创建一个 UIImage 并设置正确的 UIImageOrientation 值。
5. 将该图像插入到只允许水平滚动的UIScrollView。

请注意此方法会呈现整个文本，因此不要将其用于很长的文本。如果您需要这样做，您将需要考虑一种平铺方法。 watch WWDC 2013 > 217 - Exploring Scroll Views on iOS 7 .

祝你好运!

更新:(图片来自github项目)