How to render Markdown content in text
Updated for Xcode 14.0 beta 1
New in iOS 15
SwiftUI has built-in support for rendering Markdown, including bold, italic, links, and more. I feel almost stupid writing this because honestly it takes no work to do – it’s literally built right into SwiftUI’s Text view, so you can write code like this:
VStack {
Text("This is regular text.")
Text("* This is **bold** text, this is *italic* text, and this is ***bold, italic*** text.")
Text("~~A strikethrough example~~")
Text("`Monospaced works too`")
Text("Visit Apple: [click here](https://apple.com)")
}
Download this as an Xcode project
And yes, that link is automatically tappable.
Note: Images aren’t supported.
This automatic Markdown conversion happens because SwiftUI interprets those strings as being instances of LocalizedStringKey – strings that can be localized by our app. This means if you want to create Markdown text from a property or variable, you should mark it explicitly as being LocalizedStringKey to get the Markdown rendering:
struct ContentView: View {
let markdownText: LocalizedStringKey = "* This is **bold** text, this is *italic* text, and this is ***bold, italic*** text."
var body: some View {
Text(markdownText)
}
} Download this as an Xcode project
If you wanted the original text unchanged – i.e., you wanted the raw, unformatted Markdown symbols to be left in place – just remove the LocalizedStringKey annotation. Alternatively, you can disable both Markdown and localization entirely using the Text(verbatim:) initializer.
SPONSORED Fernando's book will guide you in fixing bugs in three real, open-source, downloadable apps from the App Store. Learn applied programming fundamentals by refactoring real code from published apps. Hacking with Swift readers get a $10 discount!
Sponsor Hacking with Swift and reach the world's largest Swift community!
Similar solutions…
