How to Highlight and Clickable if Text is URL SwiftUI

Question

Is there any way to Highlight the Text And clickable if Text contain URL in the chat screen from both

Sender USer Code:-

  import SwiftUI
  struct TextHighlightURL: View {
  var body: some View {
    HStack(alignment: .bottom){
        Spacer()
        Text("2:22 PM").font(.system(size: 10))
            .foregroundColor(.gray)
        HStack {
            Text("www.google.com")
                .foregroundColor(.white)
                .multilineTextAlignment(.trailing)
                .padding(10)
          }
          .background(Color.init("DTR-ChatSendrColor"))
          .cornerRadius(10.0)
         }.padding(.vertical,5)
         .padding()
      }
  }

Output:-

Reciver User Code:-

struct SenderReciverUI1: View {
var body: some View {
    Group {
        HStack(alignment: .bottom){
            VStack(alignment: .leading,spacing:5) {
                HStack(alignment: .bottom) {
                    Text("www.google.com")
                        .foregroundColor(.white)
                        .padding(10)
                        .cornerRadius(10.0)
                   }
              }
             Spacer()
        }.padding(.vertical,5)
        .padding()
       }
     }
 }

My Goal:-

Can someone please explain to me how to show Highlight the Text from both side if sender send the link and receiver receive the link it automatically highlighted And clickable if Text contain URL, I've tried to implement by above but no results yet.

Any help would be greatly appreciated.

Thanks in advance.

Answer 1

You need to create custom UIViewRepresentable for TextView.

check below code this might help you.

struct TextView: UIViewRepresentable {
    
    @Binding var text: String
    @Binding var textStyle: UIFont.TextStyle
    
    func makeUIView(context: Context) -> UITextView {
        let textView = UITextView()
        
        textView.delegate = context.coordinator
        textView.font = UIFont.preferredFont(forTextStyle: textStyle)
        textView.autocapitalizationType = .sentences
        textView.isSelectable = true
        textView.isUserInteractionEnabled = true
        textView.isEditable = false
        textView.dataDetectorTypes = .link
        
        return textView
    }
    
    func updateUIView(_ uiView: UITextView, context: Context) {
        uiView.text = text
        uiView.font = UIFont.preferredFont(forTextStyle: textStyle)
    }
    
    func makeCoordinator() -> Coordinator {
        Coordinator($text)
    }
    
    class Coordinator: NSObject, UITextViewDelegate {
        var text: Binding<String>

        init(_ text: Binding<String>) {
            self.text = text
        }
        
        func textViewDidChange(_ textView: UITextView) {
            self.text.wrappedValue = textView.text
        }
    }
}

In your "Receiver User Code:-" same for "Sender User Code"

struct SenderReciverUI1: View {
@State private var message = "Hello, www.google.com. this is just testing for hyperlinks, check this out our website https://www.apple.in thank you."
@State private var textStyle = UIFont.TextStyle.body

var body: some View {
    Group {
        HStack(alignment: .bottom){
            VStack(alignment: .leading,spacing:5) {
                HStack(alignment: .bottom) {
                    TextView(text: $message, textStyle: $textStyle)
                        .foregroundColor(.white)
                        .padding(10)
                        .cornerRadius(10.0)
                   }
              }
             Spacer()
        }.padding(.vertical,5)
        .padding()
       }
     }
 }

let me know if you need anything.