UILabelの先頭のtextを指定して文字色・背景色を付けたい

Question

実現したいこと
入力された文字(変数)をUILabelに表示する時に先頭の1文字目だけを文字色や背景色など
できれば角丸まで装飾して表示させたい。
（イメージとしてはかるたのようなデザインです）

実現したいことに類似している事例
似たような方法では一部の「文字列」を青くしリンク化させる方法がありましたが、これよりさらに一文字に絞り背景色と角丸をコードで実装できればと考えています。

SwiftでUILabelの先頭の文字列を青くリンク化させた例

@IBOutlet weak var helloLabel: UILabel!
　　 //任意の文字列
    let linkText = "Hello"

    override func viewDidLoad() {
        super.viewDidLoad()

       　〜省略〜

        // リンク化させる場所を青くさせる。
        let string = helloLabel!.text!
        let range = (string as NSString).range(of: linkText)
        let attributedString = NSMutableAttributedString(string: string)
        attributedString.addAttribute(NSForegroundColorAttributeName, value: UIColor.blue, range: range)
        helloLabel.attributedText = attributedString
    }

何か良い方法ありますでしょうか？m(_ _)m

Comments

[退会済みユーザー]

先頭文字ラベルと、それ以降の文字ラベルに分けるのはダメ？

Answer 1

最初の文字と2番目以降の文字を別ラベル(firstLabel，otherLabel)に分けて，firstLabelにだけ背景色と角丸の設定をstoryboardもしくは自力で実装する形が一番簡単だと思います．
(質問者様の示された例は文字色とフォントの変更くらいはできそうですが，それ以上の細かい設定は難しそうだと判断しました．)

かるたのように様々なテキストでこれを行いたい場合はsetTextToLabelのような関数を作って，そこに与えるtextを色々と変えてやれば良いのではないでしょうか．

    @IBOutlet weak var firstLabel: UILabel!
    @IBOutlet weak var otherLabel: UILabel!

    let helloWorld = "Hello World"

    override func viewDidLoad() {
        super.viewDidLoad()
        
        ...
        
        setTextToLabel(text: helloWorld)
      
        ...

    }


    func setTextToLabel(text: String) {
        let firstChar = String(text.prefix(1))
        let otherChars = String(text.suffix(text.count - 1))

        firstLabel.text = firstChar
        otherLabel.text = otherChars
    }

試してないのでこれで動くか分かりませんが，こんな感じでやれば良いのではないかなと思います．