SwiftUI 如何在文本中呈现 Markdown 内容？

20 min read

SwiftUI 不会像一些文本编辑器那样直接接受 Markdown 语法的格式，但可以通过以下方法在视图中呈现 Markdown：

  1. 使用某些开源的第三方库，如 Ink 或 Marklight，这些库可以将 Markdown 原始文本转换为 SwiftUI 中可用的文本格式。

  2. 自己编写一个较简单的 Markdown 转换器，在 SwiftUI 的视图中直接使用该转换器将 Markdown 文本转换为可用的文本格式。

例如，您可以使用字符串的 .replacingOccurrences(of:with:) 方法，按需替换 Markdown 语法中的特殊字符，然后使用 Text 视图将其应用到使用的 Rich Text 格式中。

struct MarkdownTextView: View {
    let markdownText = """
        # This is a heading

        A block of text with **bold** and *italic* formatting.

        - A bulleted list item
        - Another list item
        """

    var body: some View {
        let formattedText = markdownText
            .replacingOccurrences(of: "\n", with: "\n\n") // Add line breaks
            .replacingOccurrences(of: "**", with: "") // Remove bold formatting
            .replacingOccurrences(of: "__", with: "") // Remove underline formatting
            .replacingOccurrences(of: "*", with: "") // Remove italic formatting
            .replacingOccurrences(of: "-", with: "•") // Replace hyphens with bullets
            
        Text(formattedText)
            .font(.body)
            .padding()
    }
}

在这个例子中，我们替换 Markdown 文本中的每个换行符 \n 为两个换行符以便于在文本中显示换行。然后，我们使用 replacingOccurrences(of:with:) 方法删除所有的粗体、下划线和斜体，并将破折号替换为圆点符号。

最后，我们将经过格式化的文本应用到 SwiftUI 的 Text 视图中。由于这个视图是可嵌套的，我们可以将它与其他视图结合起来以创建更丰富的用户界面。