How to customize UILabel with different Font Size and Color with multiple Variables together

Question

I'm trying to put 3 variables in the same UILabel to make emphasis on the second word.

With one variable it work's fine. (Option 1)

    //Option 1 That work with one variable
    labelBoldAnswer.attributedText = secondWordBoldRed

THE RESULT 1 IS: Bold and Red

import UIKit

class ViewController: UIViewController,UITextFieldDelegate {

@IBOutlet weak var textFieldOriginal : UITextField!
@IBOutlet weak var labelBoldAnswer   : UILabel!

@IBAction func ButtonBold(sender: AnyObject) {

    var firstWord   = "First Word"
    var thirdWord   = "Third Word"

    var attrs      = [NSFontAttributeName: UIFont.boldSystemFontOfSize(20), NSForegroundColorAttributeName: UIColor.redColor()]
    var secondWordBoldRed = NSMutableAttributedString (string:textFieldOriginal.text, attributes: attrs)

    //Option 1 That work with one variable
    labelBoldAnswer.attributedText = secondWordBoldRed

    //Option 2 That work partialy
    //labelBoldAnswer.text = ("\(firstWord), \(secondWordBoldRed), \(thirdWord)")

}

SECOND TRY

With three variables, it show's all the text with code instead of showing bigger text and red in the center of the First and Third word. (Option 2)

//Option 2 That work partialy
    labelBoldAnswer.text = ("\(firstWord), \(secondWordBoldRed), \(thirdWord)")

THE RESULT 2 IS NOT PERFECT:

import UIKit

class ViewController: UIViewController,UITextFieldDelegate {

@IBOutlet weak var textFieldOriginal : UITextField!
@IBOutlet weak var labelBoldAnswer   : UILabel!

@IBAction func ButtonBold(sender: AnyObject) {

    var firstWord   = "First Word"
    var thirdWord   = "Third Word"

    var attrs      = [NSFontAttributeName: UIFont.boldSystemFontOfSize(20), NSForegroundColorAttributeName: UIColor.redColor()]
    var secondWordBoldRed = NSMutableAttributedString (string:textFieldOriginal.text, attributes: attrs)

    //Option 1 That work with one variable
    //labelBoldAnswer.attributedText = secondWordBoldRed

    //Option 2 That work partialy
    labelBoldAnswer.text = ("\(firstWord), \(secondWordBoldRed), \(thirdWord)")

}

Thank's for your help!

Answer 1

You can either build the attributed string up, adding attributes to the different parts as you go:

    let firstWord   = "First Word"
    let secondWord = "Insert Text"
    let attrs      = [NSFontAttributeName: UIFont.boldSystemFontOfSize(20), NSForegroundColorAttributeName: UIColor.redColor()]
    let thirdWord   = "Third Word"
    let attributedText = NSMutableAttributedString(string:firstWord)
    attributedText.appendAttributedString(NSAttributedString(string: secondWord, attributes: attrs))
    attributedText.appendAttributedString(NSAttributedString(string: thirdWord))
    textField.attributedText = attributedText

Or create the thing, then add an attribute to the range. This is somewhat complicated by the fact that NSAttributedString use NSRange, and Swift String use Range<String.index>.

    let firstWord   = "First Word"
    let secondWord = "Insert Text"
    let thirdWord   = "Third Word"
    let comboWord = firstWord + secondWord + thirdWord
    let attributedText = NSMutableAttributedString(string:comboWord)
    let attrs      = [NSFontAttributeName: UIFont.boldSystemFontOfSize(20), NSForegroundColorAttributeName: UIColor.redColor()]
    let range = NSString(string: comboWord).rangeOfString(secondWord)
    attributedText.addAttributes(attrs, range: range)
    textField.attributedText = attributedText