UIFont render result is different from what we see on Sketch/Figma - ios

I'm working with a designer that is sharing assets coming from Figma and Sketch.
If I use the same exact font size available on Figma/Sketch for my UILabel, I see the rendered fonts are smaller than the same fonts rendered on Figma/Sketch.
I'm using something like this to initialise my font for the labels:
self.font = UIFont(name: "MyFont-Bold", size: 14)
Both Figma and Sketch work in points the same is true for UIFont...
Is there anything we can do to align our results?

For me, this option works well.
UIFont(name: "Font-Name", size: UIScreen.main.bounds.height*(fontSize)/800)

Related

How to use font to write musical sheet

I am trying to make an iOS app that can make possible to write and edit musical sheet.
I was wondering how can I visualise it.
I did not found any complete framework in swift that can make it possible.
But I found this font bravura, but i did not found any example of use.
This is an OpenType Font.
Reading the documentation I should be able to decide through unicode characters, how to change the position of the next element.
But no it doesn't seem to work. At first I thought it was because of the ligatures as not all editors support it, I'm not a font expert and I could be wrong.
So I used the NSAttributedString class to modify these parameters. But the result is still not what is expected.
This is my code :
textView.font = UIFont(name: "Bravura-Text", size: 40)
let text = "\u{E014}\u{EB99}\u{E0A4} \u{E014}\u{EB91}\u{E0A4}"
let attributes = [
NSAttributedString.Key.font : UIFont(name: "Bravura-Text", size: 40)!,
NSAttributedString.Key.ligature : 2
] as [NSAttributedString.Key : Any]
let attributedString = NSAttributedString(string: text, attributes: attributes)
textView.attributedText = attributedString
E014 = Displaying a 5 line staff
EB99 = Lower by two staff positions
EB91 = Raise by two staff positions
E0A4 = The black notehead
This is the result :
result
Any suggestions to make it possible to use this font and its features on iOS?
I would like to write a musical sheet like this one.
Layout of music notation require higher-level layout rather than just displaying a line of text. (Analogous to Web pages using HTML as high-level layout rather than just lines of text.) Fonts can provide the basic symbols, and all of the basic symbols are encoded in Unicode. But you'll need some library that can read a music-notation markup language and layout the content.
You can probably find the kind of resources you'll need at https://www.w3.org/community/music-notation/

iOS Prevent timer UILabel 'shaking' when numbers change

I have a UILabel which shows the output of a timer in the format MM:ss:SS (minutes, seconds, centiseconds), however it "shakes" from left to right as the width of the centiseconds changes - "11" is narrower than "33" for example.
Is there any way I can mitigate this? I've tried centring it, giving it a fixed width but they haven't seemed to help.
Since iOS 9.0, the system font uses proportional digits. If you want monospaced digits, there's a variant font which you can obtain using +[UIFont monospacedDigitSystemFontOfSize:weight:]. This only works for the system font.
If you want to work with another font, you try to ask for a monospaced variant, but there may not be one. Given a UIFont, you can request its fontDescriptor, then ask that for a similar font descriptor that's monospaced (not just for digits) using -[UIFontDescriptor fontDescriptorWithSymbolicTraits:] and UIFontDescriptorTraitMonoSpace. You can then create a new font by passing the new font descriptor to +[UIFont fontWithDescriptor:size:].
However, I doubt there's a monospace variant of Impact. It's not suitable for your purpose.
I had the same problem. #KenThomases answer works. Here's the Swift version:
// replace whatever font your using with this font instead to stop the shaking
UIFont.monospacedDigitSystemFont(ofSize: 19, weight: UIFont.Weight.regular)
ie:
yourLabel.font = UIFont.monospacedDigitSystemFont(ofSize: 19, weight: UIFont.Weight.regular)
FYI there are other UIFont.Weight weights:
.black, .bold, .heavy, .light, .medium, .regular, .semibold, .thin, .ultraLight
According to this other answer the fonts below are system generated fonts that are also monospaced so they won't shake either:
Courier
Courier-Bold
Courier-BoldOblique
Courier-Oblique
CourierNewPS-BoldItalicMT
CourierNewPS-BoldMT
CourierNewPS-ItalicMT
CourierNewPSMT
Menlo-Bold
Menlo-BoldItalic
Menlo-Italic
Menlo-Regular
ie:
// no shaking
yourLabel.font = UIFont(name: "Menlo-Regular", size: 19)
If your using just numeric digits then HelveticaNeue is also monospaced and it doesn't shake but it's questionable. Read the comments below this answer before using this font.
ie:
// no shaking but apparently you can only use numbers not letters
yourLabel.font = UIFont(name: "HelveticaNeue", size: 19)
Use A monospaced font, also called a fixed-pitch, fixed-width, or non-proportional font, is a font whose letters and characters each occupy the same amount of horizontal space. Examples of monospaced fonts include Courier, Courier New, Lucida Console, Monaco, and Consolas

UIFont - how to get system thin font

UIFont has methods to get regular font (systemFontOfSize) or bold font (boldSystemFontOfSize), but how to get a "thin system font" available through storyboard?
Passing "system-thin" to UIFont Contructor doesn't work, this constructor only works for non system fonts.
You can use system font thin weight:
UIFont.systemFont(ofSize: 34, weight: UIFontWeightThin)
List of available weights for San Francisco:
UIFontWeightUltraLight
UIFontWeightThin
UIFontWeightLight
UIFontWeightRegular
UIFontWeightMedium
UIFontWeightSemibold
UIFontWeightBold
UIFontWeightHeavy
UIFontWeightBlack
As of iOS 11, UIFontWeight* was renamed to UIFont.Weight.*. More you can get here https://developer.apple.com/documentation/uikit/uifont.weight.
As of iOS 8.2, you can now use UIFont.systemFontOfSize(_ fontSize: CGFloat, weight weight: CGFloat):
UIFont.systemFontOfSize(19, weight: UIFontWeightLight)
iOS SDK provided constants for weights:
UIFontWeightUltraLight
UIFontWeightThin
UIFontWeightLight
UIFontWeightRegular
UIFontWeightMedium
UIFontWeightSemibold
UIFontWeightBold
UIFontWeightHeavy
Using system font is better than creating a font based on font name when you want to use system fonts since iOS can change their system fonts on iOS (like when they did with Helvetica Neue in iOS 7, and now, San Francisco in iOS 9).
So what I would suggest is to include TTF file of the font you want as use that ttf file as custom font and use the custom font in your app.
This is the special reason why I don't like Apple. Never go what Apple say. Always do what we want. Apple keep on changing Default font for every OS.
Also if you want to keep same font size and just change weight then use from targeted element font size. For example:
demoLabel.font = UIFont.systemFont(ofSize: demoLabel.font.pointSize, weight: UIFontWeightThin)
with this you can keep default label font size and just change weight.
As of iOS 11, UIFontWeightThin was renamed to UIFont.Weight.thin. More you can get here https://developer.apple.com/documentation/uikit/uifont.weight.
Swift 4.2 / Swift 5.0
label.font = UIFont.systemFont(ofSize: 15, weight: UIFont.Weight.thin)

Custom font causes delay in SpriteKit

I tried to change a label font to bodoni 72 but every time I test the app, it freezes for about 2 seconds before it starts. The default font is verdana and that works fine but as soon as I switch it, the app goes nuts. I even put the font file in the supporting files folder.
scoreLabel.fontName = "Bodoni 72"
That's the code but doesn't work. But the code below does...
scoreLabel.fontName = "Verdana"
If you use the incorrect font name in SpriteKit it causes a delay while it tries to find a match.
In this case "Bodoni 72" is the font family name, but it isn't the font name. If you open the Font Book application on your Mac and have a look at Bodoni 72 you will see that you can expand it to see the three actual fonts in this family - 'Book', 'Book italic' and 'Bold'.
If you change your code to read
scoreLabel.fontName = "Bodoni 72 Book"
then the delay will be gone.
That's not an issue with Xcode or Swift. That's an issue in your code. Instead of that, try setting the fontName of your label to "Bodoni", and your fontSize (the size of your font as a float) to 72.0.
See below:
scoreLabel.fontName = "Bodoni"
scoreLabel.fontSize = 72
If you want to set the color of a label (this might only be in SpriteKit's SKLabelNodes), you can use this:
scoreLabel.fontColor = UIColor.whiteColor //replace with your color

Improve UILabel text visibility in Swift

I am showing the text on an UIImage in UITableViewCell, but UILabel text is dull. How to improve label text brightness? I have added Label on Image. I am also using Shadow image in label to make the text more visible, but the text is more dull in iPhone 6 Simulator.
How to manage it? And any other way to achieve this
And image or a description of what kind of "improvements" you are looking for would help to help you out better.
But the 2 most important things are probably font and color.
if you want to change the textColor. Use
myUILabel.textcolor = UIColor(red: 16/255.0, green: 177/255.0, blue: 216/255.0, alpha: 1)
Obviously changing the RGB values to something that looks good in your app.
to change the font and fontsize use something like this:
myUILabel.font = UIFont(name: "BPreplay", size: 20)
Also it's always better to test on an actual device. Gives you a much better view on how it feels on the phone.

Resources