Vertically aligning NSTextAttachment in NSMutableAttributedString

问题

I'm adding an icon to a UILabel using NSTextAttachment inside an NSMutableAttributedString like this:

//Setting up icon
let moneyIcon = NSTextAttachment()
moneyIcon.image = UIImage(named: "MoneyIcon")
let moneyIconString = NSAttributedString(attachment: moneyIcon)

//Setting up text
let balanceString = NSMutableAttributedString(string: " 1,702,200")
balanceString.insert(moneyIconString, at: 0)

//Adding string to label
self.attributedText = balanceString
self.sizeToFit()

But for some reason the icon isn't vertically aligned

Does anybody know how can I align it?

Thank you!

回答1:

This answer, which is about vertically centering two differently sized fonts in a single NSAttributedString, mentions using the baseline offset to calculate the center of the string.

You can use the same approach when using an image:

1. Subtract the font size from the image's height and divide it by 2.

2. Subtract the font's descender from the value (since font size isn't the same as the ascent of your font). The font that you are particularly using (Baloo-Regular) has a descender value that differs from the standard and it should be divided by 2. Other fonts (including San Fransisco) don't need that fix or require a different divisor.

This code covers most cases, if your font behaves differently, you should check out the guide for managing texts in Text Kit.

---

let moneyImage = UIImage(named: "MoneyIcon")!

//Setting up icon
let moneyIcon = NSTextAttachment()
moneyIcon.image = moneyImage
let moneyIconString = NSAttributedString(attachment: moneyIcon)

let balanceFontSize: CGFloat = 16
let balanceFont = UIFont(name: "Baloo", size: balanceFontSize)

//Setting up font and the baseline offset of the string, so that it will be centered
let balanceAttr: [NSAttributedStringKey: Any] = [.font: balanceFont,
                                                 .baselineOffset: (moneyImage.size.height - balanceFontSize) / 2 - balanceFont.descender / 2]

//Setting up text
let balanceString = NSMutableAttributedString(string: " 1,702,200", attributes: balanceAttr)
balanceString.insert(moneyIconString, at: 0)

Here is a GitHub project where you can try out this code.

回答2:

use bounds property of NSTextAttachment.

//Setting up icon
let moneyIcon = NSTextAttachment()
moneyIcon.image = UIImage(named: "MoneyIcon")

let imageSize = moneyIcon.image!.size
moneyIcon.bounds = CGRect(x: CGFloat(0), y: (font.capHeight - imageSize.height) / 2, width: imageSize.width, height: imageSize.height)

let moneyIconString = NSAttributedString(attachment: moneyIcon)

//Setting up text
let balanceString = NSMutableAttributedString(string: " 1,702,200")
balanceString.insert(moneyIconString, at: 0)

//Adding string to label
self.attributedText = balanceString
self.sizeToFit()

来源：https://stackoverflow.com/questions/47844721/vertically-aligning-nstextattachment-in-nsmutableattributedstring