관리 메뉴

김종권의 iOS 앱 개발 알아가기

[iOS - swift] UILabel에서 특정 문자열의 font, 색상 변경 방법 (attributedText) 본문

iOS 응용 (swift)

[iOS - swift] UILabel에서 특정 문자열의 font, 색상 변경 방법 (attributedText)

jake-kim 2021. 8. 5. 23:30

하나의 Label에 font와 color를 다르게 설정

Attributed text 개념

  • UILabel은 attributedText 프로퍼티를 가지고 소유

  • 이름 그대로 Text에 '속성'값이 존재하는 프로퍼티
  • UILabel의 text에 font, color같은 속성값을 지정할수 있다는 의미

사용 방법

  • NSAttributedString 객체를 만들어서 프로퍼티에 대입 
let fullText = label.text ?? ""
let attribtuedString = NSMutableAttributedString(string: fullText)
  • 대입 하기전에 font, color 속성값을 부여 > font, color속성값을 특정 문자열에 부여하기 위해서는 NSRange값을 이용
let range = (fullText as NSString).range(of: "iOS앱")
  • range값을 가지고 위에서 만든 attributedString객체에 color 속성값을 추가
    • text color속성은 .foregroundColor로 접근
attribtuedString.addAttribute(.foregroundColor, value: UIColor.blue, range: range)
  • 기존 label 객체에 attributedText 객체 대입

* 전체 코드

class ViewController: UIViewController {

    lazy var label: UILabel = {
        let label = UILabel()
        label.font = .systemFont(ofSize: 14)
        label.textColor = .black
        label.text = "iOS앱 개발 블로그 하나의 label 입니다"

        return label
    }()

    override func viewDidLoad() {
        super.viewDidLoad()

        view.addSubview(label)

        label.translatesAutoresizingMaskIntoConstraints = false
        label.centerYAnchor.constraint(equalTo: view.centerYAnchor).isActive = true
        label.centerXAnchor.constraint(equalTo: view.centerXAnchor).isActive = true

        let fullText = label.text ?? ""
        let attribtuedString = NSMutableAttributedString(string: fullText)
        let range = (fullText as NSString).range(of: "iOS앱")
        attribtuedString.addAttribute(.foregroundColor, value: UIColor.blue, range: range)
        label.attributedText = attribtuedString
    }
}

extension으로 넣어서 편리하게 활용

  • font를 변경하는 함수
extension UILabel {
    func asFont(targetString: String, font: UIFont) {
        let fullText = text ?? ""
        let attributedString = NSMutableAttributedString(string: fullText)
        let range = (fullText as NSString).range(of: targetString)
        attributedString.addAttribute(.font, value: font, range: range)
        attributedText = attributedString
    }
}
  • color를 변경하는 함수
extension UILabel {    
    func asColor(targetString: String, color: UIColor) {
        let fullText = text ?? ""
        let attributedString = NSMutableAttributedString(string: fullText)
        let range = (fullText as NSString).range(of: targetString)
        attributedString.addAttribute(.foregroundColor, value: color, range: range)
        attributedText = attributedString
    }
}
  • color와 font둘다 변경하는 함수 - addAttributes에서 속성을 배열로 설정 가능
extension UILabel {    
    func asFontColor(targetString: String, font: UIFont?, color: UIColor?) {
        let fullText = text ?? ""
        let attributedString = NSMutableAttributedString(string: fullText)
        let range = (fullText as NSString).range(of: targetString)
        attributedString.addAttributes([.font: font as Any, .foregroundColor: color as Any], range: range)
        attributedText = attributedString
    }
}
  • string을 여러개 받아서 color와 font 둘다 변경하는 함수
extension UILabel {    
    func asFontColor(targetStringList: [String], font: UIFont?, color: UIColor?) {
        let fullText = text ?? ""
        let attributedString = NSMutableAttributedString(string: fullText)

        targetStringList.forEach {
            let range = (fullText as NSString).range(of: $0)
            attributedString.addAttributes([.font: font as Any, .foregroundColor: color as Any], range: range)
        }
        attributedText = attributedString
    }
}
  • 사용예시
        let targetString1 = label.text?.components(separatedBy: " ").first ?? ""
        let targetString2 = label.text?.components(separatedBy: " ").last ?? ""
        let targetString3 = "블로그"
        label.asFontColor(targetStringList: [targetString1 ,targetString2, targetString3], font: .systemFont(ofSize: 30), color: .blue)

Comments