Search code examples
iostextswiftuimarkdown

Text view with rich markdown in SwiftUI (more than only bold and italic text)


Android

In my app I need to visually style and highlight long texts that come from a DB. The texts are written as following:

Accept the <f>current</f> situation and <f>then</f> try to build a better one on top of it. Only then will you catch a break from all that getting away and will be able to think about how to actually improve.
<h>Resistance deepens the negative thoughts, acceptance releases them.</h>

On Android, I take these texts and parse them using Regex to replace the tags with something that works with the library. I'm using the SRML library to display it like this:

Android screenshot


iOS

Now my question is: how do I reach a somewhat similar experience on iOS?

I'm using SwiftUI so far, but I can see that it's pretty limited in this specific regard. All I've found so far are libraries that helps you make it bold, italic or something other very minor:

But I specifically need to highlight phrases, meaning color their background yellow. I then found this library, that offers some pretty complex functionality, but is written in Objective-C and I don't know how well that will work with my SwiftUI basis: https://github.com/ibireme/YYText


Is there any chance for me to get it working with SwiftUI components?

My best guess would be to do something like this (very basic pseudo code):

text = DB.getText
parser = StringParser(text)
content = ViewGroup()

while(parser.hasNextLine) { nextLine in
  if(nextLine.contains("<h>")) {
    var text = Text(nextLine)
                 .background(Color.yellow)
    content.add(text)
  } else if(...) {
    ...
  }

  // etc. etc.
}

And kind of build the resulting Text step by step from multiple pieces. But this looks kind of ugly to be honest. Any other ideas? And if not, how should I go about including that Cbjective-C library into a SwiftUI project?


Solution

  • With the help of a freelancer on Fiverr I solved it in the following way:

    https://stackoverflow.com/a/69871902/1972372

    Basically parsed the tags manually and kept track of the content types and order in an array, while keeping formatted Texts in another array. Then I could take that content and plant it into a ViewBuilder body function.

    Unfortunately, SwiftUI doesn't let you change a Text's background color yet, without turning it into some View. So I had to make do with other, similar formattings for now.