iOS developer’s guide to NSAttributedString in Swift 3

Customize every single character in your string

What is NSAttributedString

It is an object that manages string and associated set of attributes applied to individual characters or range of characters.

It is a class belongs to the Foundation framework and it is NOT a subclass of NSString. Instead it contains NSString object that it applies attributes to.

The cluster has two public class NSAttributedString and NSMutableAttributedString

Creating NSAttributedString

We can create NSAttributedString in different ways. You can create NSAttributedString from String, URL, Data, HTML or from another NSAttributedString.

//create attributed string from string
let attributedString : NSAttributedString = NSAttributedString.init(string: "iOS-Tutorial.com")
//create attributed string from string with attributes
let attributedString = NSAttributedString(string: "ios-tutorial.com",
            attributes: [NSFontAttributeName : UIFont(
                name: "Chalkduster",
                size: 22.0)!])

Apply different text color to character range

First of all create a UILabel in InterfaceBuilder and IBOutlet for it in code.

Then lets create a mutable attributed string so we can add attributes one by one later

let string = "http://ios-tutorial.com"
        
let attributedString = NSMutableAttributedString(string: string)

Then use addAttribute function of the NSMutableAttributedString to add attribute and the range of characters that the attribute will be applied to.

attributedString.addAttribute(NSForegroundColorAttributeName, value: UIColor.magenta, range: NSRange(location: 0, length: 23))

Then assign the attributed string to the “attributedText” property of the UILabel

lblDemo.attributedText = attributedString

Build and run

NSAttributedString Swift 3

Now lets apply different color to some characters by adding another attribute just after the first addAttribute line

attributedString.addAttribute(NSForegroundColorAttributeName, value: UIColor.blue, range: NSRange(location: 7, length: 12))

Here we assign blue color to the foreground color of characters in range from 7 to 12. Build and run

character range color Swift 3

Add Stroke outline effect to character range

Add another attribute to the attributed string just after the last addAttribute line

attributedString.addAttribute(NSStrokeColorAttributeName, value: UIColor.red, range: NSRange(location: 7, length: 12))

Here we used the NSStrokeColorAttribute to define stroke color and its value of “red” to a range of characters. Build and run.

Nothing changed !sorry, I forgot to tell you that you have to apply stroke width too.

Add NSStrokeWidthAttributeName attribute after the last one

attributedString.addAttribute(NSStrokeWidthAttributeName, value: 2.0, range: NSRange(location: 7, length: 12))

Build and run

add stroke to text in iOS

Make some characters bold using NSAttributedString

Using NSFontAttributeName lets change the font name and size for some characters

attributedString.addAttribute(NSFontAttributeName, value: UIFont(name: "AmericanTypewriter-Bold", size: 24)!, range: NSRange(location: 7, length: 12))

Build and run

make some characters bold in iOS

Add underline to text using NSAttributedString

We can use NSUnderlineColorAttributeName and NSUnderlineStyleAttributeName to define underline color and style for our string

attributedString.addAttribute(NSUnderlineColorAttributeName, value: UIColor.blue, range: NSRange(location: 0, length: 23))
        
attributedString.addAttribute(NSUnderlineStyleAttributeName, value: 1, range: NSRange(location: 0, length: 23))

Build and run

underline text in iOS

Here is the complete code:

        
let string = "http://ios-tutorial.com"
        
let attributedString = NSMutableAttributedString(string: string)
        
attributedString.addAttribute(NSForegroundColorAttributeName, value: UIColor.magenta, range: NSRange(location: 0, length: 23))
        
attributedString.addAttribute(NSForegroundColorAttributeName, value: UIColor.blue, range: NSRange(location: 7, length: 12))
        
attributedString.addAttribute(NSStrokeColorAttributeName, value: UIColor.red, range: NSRange(location: 7, length: 12))
        
attributedString.addAttribute(NSStrokeWidthAttributeName, value: 2.0, range: NSRange(location: 7, length: 12))
        
        
attributedString.addAttribute(NSFontAttributeName, value: UIFont(name: "AmericanTypewriter-Bold", size: 24)!, range: NSRange(location: 7, length: 12))
        
        
attributedString.addAttribute(NSUnderlineColorAttributeName, value: UIColor.blue, range: NSRange(location: 0, length: 23))
        
attributedString.addAttribute(NSUnderlineStyleAttributeName, value: 1, range: NSRange(location: 0, length: 23))

        
lblDemo.attributedText = attributedString

NSAttributedString is very powerful and what we did here was just samples for example try adding background color to your text.
Try adding drop shadow to your text and tell me if you have any questions.

You might also like iOS developer’s guide to CALayer

Leave a Reply

Your email address will not be published. Required fields are marked *