[Swift] TextView HyperLink

안녕하세요🐶

빈지식 채우기의 비니🙋🏻‍♂️ 입니다.

 

오늘의 포스팅은!

텍스트뷰 내에 텍스트가 URL 형태로 있을 시 하이퍼링크로 만들어주는 기능을 구현해보려고 합니다!

바로 시작합니다!

---

1. 필수 요소

1-1. UIDataDetectorTypes

정의

• 텍스트 기반 콘텐츠에서 탐지할 정보 유형을 정의하는 상수입니다.

상수라고 하네요 상수면 Enum 으로 정의된 것임을 모두 아시죠..?

그럼 대체 어떤 것으로 정의되어 있느냐..!

데이터 유형 상수들

UIDataDetectorTypes 가 인식할 수 있는 유형들은 아래와 같이 존재합니다!

• phoneNumber
• link
• address
• calendarEvent
• shipmentTrackingNumber
• flightNumber
• lookupSuggestion
• menoy
• physicalValue
• all

우리는 링크로 정의된 텍스트를 하이퍼링크로 변환해주는 기능을 만들고 있기 때문에  link 부분을 사용합니다!

 

간단한 사용 방법은 아래와 같습니다!

textview.dataDetectorTypes = .link

 

1-2. textView(_:shouldInteractWith:in:)

정의

• 텍스트뷰 내 URL에 대해 상호작용을 하는지 여부 및 URL 체크가 가능한 대리자 함수입니다. 

파라미터들

• textView : 현재 대리자를 걸어놓은 텍스트뷰 
• URL : 상호작용된 URL
• characterRange : 텍스트뷰 텍스트 내 URL 의 범위

주의사항

하이퍼링크를 위해서는 아래와 같이 반드시 설정해야한다.

• isSelectable > True
• isEditable > False

---

2. 구현 방법

스토리보드

@IBOutlet weak var textview: UITextView! {
    didSet {
        textview.text = "이 텍스트는 링크입니다. https://naver.com"
        textview.delegate = self
        textview.dataDetectorTypes = .link      // 텍스트 내 감지가능한 정보 유형 Link 사용
        textview.isSelectable = true            // 텍스트 선택이 가능하게 설정 필수 ( 하이퍼링크 )
        textview.isEditable = false             // 텍스트 편집 불가능하게 설정 필수
    }
}

• 텍스트뷰에 대한 초기 설정을 합니다.
  • delegate : 대리자 설정 ( 하단 shouldInteractWith 대리자 함수 사용하기 위함 )
  • dataDetectorTypes : 텍스트 내 감지 가능한 정보 유형 설정
  • isSelectable, isEditable : 하이퍼링크 기능을 위한 필수 설정

extension ViewController: UITextViewDelegate {
    
    // 텍스트뷰 내 link와 interact하는 메서드
    func textView(_ textView: UITextView, shouldInteractWith URL: URL, in characterRange: NSRange) -> Bool {
        if UIApplication.shared.canOpenURL(URL) {
            UIApplication.shared.open(URL)
        }
        
        return false
    }
    
}

• Delegate 대리자 설정 이후 사용자가 링크 클릭 시 실행되는 함수입니다.
  • 상호작용된 URL을 받아 Open 합니다.

import UIKit
import Foundation

class ViewController: UIViewController {
    
    @IBOutlet weak var textview: UITextView! {
        didSet {
            textview.text = "이 텍스트는 링크입니다. https://naver.com"
            textview.delegate = self
            textview.dataDetectorTypes = .link      // 텍스트 내 감지가능한 정보 유형 Link 사용
            textview.isSelectable = true            // 텍스트 선택이 가능하게 설정 필수 ( 하이퍼링크 )
            textview.isEditable = false             // 텍스트 편집 불가능하게 설정 필수
        }
    }
    
    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view.
    }
}

extension ViewController: UITextViewDelegate {
    
    // 텍스트뷰 내 link와 interact하는 메서드
    func textView(_ textView: UITextView, shouldInteractWith URL: URL, in characterRange: NSRange) -> Bool {
        if UIApplication.shared.canOpenURL(URL) {
            UIApplication.shared.open(URL)
        }
        
        return false
    }
    
}

• 하이퍼 링크 전체 소스입니다.

실행 화면

---

감사합니다.

---

참고

• https://developer.apple.com/documentation/uikit/uitextview/1618607-datadetectortypes
• https://developer.apple.com/documentation/uikit/uitextviewdelegate/1649337-textview
• https://borabong.tistory.com/18