[ASTextNode] has inconsistent line space when add emoji

[garrettmoon]

From @d6u on September 6, 2015 1:58

let fontHeight = CGFloat(19.25)
let fontSize = CGFloat(16)
let lineSpace = CGFloat(10)

// Red Strip

for i in 0...10 {
    let v = UIView(frame: CGRect(x: 0, y: CGFloat(150) + CGFloat(i) * (fontHeight + lineSpace), width: 320, height: fontHeight))
    v.backgroundColor = UIColor.redColor()
    view.addSubview(v)
}

// String

let style = NSMutableParagraphStyle()
style.lineSpacing = lineSpace
let text = NSAttributedString(string: "Lorem Ipsum is simplyry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make 👍 a type specimen book.", attributes: [
    NSFontAttributeName: UIFont.systemFontOfSize(16),
    NSParagraphStyleAttributeName: style
])

// ASTextNode

let textNode = ASTextNode()
textNode.attributedString = text
textNode.measure(CGSize(width: 200, height: CGFloat.max))
textNode.frame = CGRect(origin: CGPoint(x: 50, y: 150), size: textNode.calculatedSize)
textNode.backgroundColor = UIColor.purpleColor()

view.addSubnode(textNode)

// Normal Text Label

let textLabel = UILabel(frame: CGRect(x: 50, y: 150, width: 200, height: 100))
textLabel.attributedText = text
textLabel.numberOfLines = 0
textLabel.sizeToFit()

view.addSubview(textLabel)

So I added two text label with the same attributed string. The line with 👍 won't agree with each other. I also added red strip as reference.

How do I render consistent line space using TextNode? Did I miss some config?

Copied from original issue: facebookarchive/AsyncDisplayKit#639

[garrettmoon]

From @zaaroth on January 17, 2016 11:48

I bumped into this issue as well. UILabel takes NSParagraphStyle into account just fine, but ASTextNode does not seem to be doing so as well when there are emojis on the attributed string.

[garrettmoon]

From @sainttail on June 18, 2016 11:6

Any update on this?

I also have this kind of problem.

Some clarification of the button

TTLabel -> TTTAttributedLabel doesn't constraint any lineHeight
YYLabel -> YYTextKit + setting YYTextLinePositionSimpleModifier to be font.lineHeight
AsLabel -> ASTextNode set atttrubtedString with maximumLineHeight and minimumLineHeight to font.lineHeight

ASTextNode seem to work fine except the first line with emoji it appears to be shift up slightly compare to UILabel.

Anyway to overcome this? Don't know this is the same problem with @d6u or not.

[garrettmoon]

From @appleguy on June 18, 2016 22:51

Very cool test app. Could you share the full source to that app? Sorry I didn’t read back on the thread, maybe you already did. Hannah may look at this soon.

On Jun 18, 2016, at 4:07 AM, Eakawat Tantamjarik notifications@github.com wrote:

I also have this kind of problem.

It is like this

TTLabel -> TTTAttributedLabel doesn't constraint any lineHeight
YYLabel -> YYTextKit + setting YYTextLinePositionSimpleModifier to be font.lineHeight
AsLabel -> ASTextNode set atttrubtedString with maximumLineHeight and minimumLineHeight to font.lineHeight

https://cloud.githubusercontent.com/assets/3015139/16170490/6ceafff8-357e-11e6-8d5c-84d08abdcf57.gif
ASTextNode seem to work fine except the first line with emoji it appears to be shift up slightly compare to UILabel.

Anyway to overcome this? Don't know this is the same problem with @d6u https://github.com/d6u or not.

—
You are receiving this because you are subscribed to this thread.
Reply to this email directly, view it on GitHub facebookarchive/AsyncDisplayKit#639 (comment), or mute the thread https://github.com/notifications/unsubscribe/AAigA8XpQJKrIYittbRPnYlwc-YuZ0Jwks5qM9FWgaJpZM4F4hrG.

[garrettmoon]

From @sainttail on June 22, 2016 18:47

Here is the test app.

I didn't hardcode the test text so you need to enter that yourself.

iOSMessageBubbleTest.zip

[garrettmoon]

From @dssheng on August 12, 2016 5:45

I' meet the same issue, and here is my solution.
facebookarchive/AsyncDisplayKit#2057