I am using SpriteKit and have a timer in my iOS app rendered through an SKLabelNode and which is updated in the update function. I didn't want the digits moving left and right as the count increased, so I tried using Courier New. It worked much better than Avenir, but there are still subtle fluctuations in the width of some of the digits. (The 6 and the 9 are slightly wider than the other digits.) I saw these fluctuations in several different experiments where I tried:
- normal & bold styles
- large (65) & small (9) font sizes
- Courier New & Menlo fonts
- Xcode simulator & iPod Touch
I submitted queries like "which font has uniform width digits", but all the answers I could find just say "use a monospaced font". (See https://graphicdesign.stackexchange.com/questions/13148/which-fonts-have-the-same-width-for-every-character or Monospace Font - Not really Monospace?)
My code is super simple. I setup the scoreNode once like this:
scoreNode = SKLabelNode(fontNamed: "Courier New")
scoreNode.fontSize = 65
scoreNode.fontColor = UIColor.blackColor()
scoreNode.text = "0"
scoreNode.position = CGPoint(x: patternPane.midX, y: patternPane.midY)
patternPaneNode.addChild(scoreNode)
And then I update the score like this:
scoreNode.text = "\(viewControllerDelegate!.getScore())"
Here's an image overlaying the frame showing 28 with part of the frame showing 29. You can see that the edges of the movie are lined up and you can see that the base of the 2s do not line up.
Any explanations?
Is it possible that iOS is applying kerning to the SKLabelNode even though I'm using a monospace font?
I faced the same problem and killed multiple days trying to solve it. Here is my solution:
So, first of all - the function that sets the score. It uses
attributedText
instead of justtext
. That made possible use ofUIFont.monospacedSystemFont()
Next - fix the position of
SKLabelNode
insideSKShapeNode
(or any other rectangle):Note that we are setting
verticalAlignmentMode
to.baseline
. Because of that, we need to calculatelabelHeightShift
by ourselves.Yeah, the code is a little dirty with
0.8
and other constants. But I haven't found a better solution.I hope that helps someone.