iOS 앱의 UITextView에서 여러 스타일을 적용하는 방법 – NSAttributedString 완벽 가이드

iOS에서 하나의 텍스트 뷰(Text View) 안에 서로 다른 여러 스타일을 적용하려면 NSAttributedString(속성 문자열)을 사용해야 합니다. iOS의 UITextView는 attributedText라는 속성을 제공하며, 이 속성을 활용하면 텍스트 뷰 내부의 문자열에 글꼴 크기, 색상 등 다양한 스타일을 자유롭게 지정할 수 있습니다.

NSAttributedString이란?

NSAttributedString은 단순히 문자열만 저장하는 String과 달리, 문자열의 각 부분에 폰트, 색상, 배경색, 밑줄 같은 스타일 정보(속성)를 함께 담을 수 있는 클래스입니다. NSMutableAttributedString을 사용하면 여러 개의 스타일이 적용된 문자열 조각들을 하나로 합칠 수도 있습니다.

1. 스타일 속성(Attribute) 생성하기

먼저 텍스트에 적용할 첫 번째 속성을 정의합니다. 아래 예제는 16pt 크기의 시스템 폰트와 파란색 글자색을 설정하는 코드입니다.

let attributeOne : [NSAttributedString.Key : Any] = [NSAttributedString.Key(rawValue: NSAttributedString.Key.font.rawValue) : UIFont.systemFont(ofSize: 16.0), NSAttributedString.Key(rawValue: NSAttributedString.Key.foregroundColor.rawValue) : UIColor.blue]

2. 속성을 적용한 문자열 만들기

생성한 속성을 사용해 NSAttributedString 인스턴스를 만듭니다.

let string = NSAttributedString(string: "Text for first Attribute", attributes: attributeOne)

같은 방식으로 다른 스타일(예: 더 큰 폰트 크기와 빨간색)이 적용된 두 번째 문자열도 만들 수 있습니다.

3. 전체 코드 예제

두 개의 속성 문자열을 NSMutableAttributedString에 이어 붙인 후, textView의 attributedText에 할당하면 하나의 텍스트 뷰 안에 두 가지 스타일이 동시에 표시됩니다. viewDidLoad 또는 viewWillAppear에 아래 코드를 작성하면 됩니다.

let tx = UITextView()
tx.isScrollEnabled = true
tx.isUserInteractionEnabled = true
tx.frame = CGRect(x: 10, y: 25, width: self.view.frame.width, height: 100)

// 첫 번째 스타일: 16pt, 파란색
let attributeOne : [NSAttributedString.Key : Any] = [NSAttributedString.Key(rawValue: NSAttributedString.Key.font.rawValue) : UIFont.systemFont(ofSize: 16.0), NSAttributedString.Key(rawValue: NSAttributedString.Key.foregroundColor.rawValue) : UIColor.blue]

// 두 번째 스타일: 20pt, 빨간색
let attributeTwo : [NSAttributedString.Key : Any] = [NSAttributedString.Key(rawValue: NSAttributedString.Key.font.rawValue) : UIFont.systemFont(ofSize: 20.0), NSAttributedString.Key(rawValue: NSAttributedString.Key.foregroundColor.rawValue) : UIColor.red]

let string = NSAttributedString(string: "Text for first Attribute", attributes: attributeOne)
let string2 = NSAttributedString(string: "Text for first Attribute", attributes: attributeTwo)

// 두 문자열을 하나로 병합
let finalAttributedString = NSMutableAttributedString()
finalAttributedString.append(string)
finalAttributedString.append(string2)

tx.attributedText = finalAttributedString
self.view.addSubview(tx)

실행 결과

위 코드를 애플리케이션의 viewDidLoad나 viewWillAppear에 작성하고 실행하면, 하나의 텍스트 뷰 안에 파란색 16pt 텍스트와 빨간색 20pt 텍스트가 함께 출력되는 것을 확인할 수 있습니다.

추가 팁

이 방법은 UITextView뿐 아니라 UILabel에도 동일하게 적용할 수 있습니다. 또한 NSAttributedString.Key에는 font, foregroundColor 외에도 backgroundColor(배경색), strikethroughStyle(취소선), underlineStyle(밑줄), kern(자간) 등 다양한 속성이 있으므로, 이를 조합하면 리치 텍스트 UI를 손쉽게 구현할 수 있습니다.