Search code examples
swiftnsattributedstring

How to change the "i" circle color (tittle color)


Is anyway to change the tittle color of the "i" character in swift?

I want to change the color of the circle of the "i" to orange but I can't find how to do that.

For example, I have this:

click

and I want to do this:

click orange circle

I want to do that with NSAttributedString but I can't find anything.

The "tittle" is the circle of the "i" character, when I search on the internet how to change that color, I only get result to change the UINavigationBar title


Solution

  • By using some Unicode tricks, you can (sort of) do it. The trick is the combining dot above character (U+0307). Make it a different color and adjust its baseline to completely overlap the dot on the i:

    let attributes = [
        NSFontAttributeName: UIFont.systemFontOfSize(50, weight: UIFontWeightHeavy)
    ]
    let dotAttributes = [
        NSFontAttributeName: UIFont.systemFontOfSize(60, weight: UIFontWeightHeavy),
        NSForegroundColorAttributeName: UIColor.redColor(),
        NSBaselineOffsetAttributeName: -15
    ]
    
    let attributedString = NSMutableAttributedString(string: "cli\u{307}ck", attributes: attributes)
    attributedString.setAttributes(dotAttributes, range: NSMakeRange(3, 1))
    
    textLabel.attributedText = attributedString
    

    Result:

    enter image description here

    The downside is that you have to experiment with the font size and baseline offset in dotAttributes to get it to play nice with your regular text - there's no universal rule for them.