Typography

RSS for tag

Implement good typography technique, make the most of the advanced features in Apple system fonts, and integrate custom fonts.

Posts under Typography tag

32 Posts
Sort by:

Post

Replies

Boosts

Views

Activity

Typographic question for space character
In this UIKit app, I have to display numbers (from 1 to 100), in a label., on several lines, with 8 numbers on each line. Order is computed by the app for a specific purpose. The numbers are separated by space. Label font is Helvetica Neue 15.0. I want to get them aligned vertically. So, I have a padding so that they are all the same length of 4. Problem: the space have smaller width (half in fact) than digits, so alignment is disrupted: Of course, I can use fixed width fonts (like Menlo), but I've not found one that fits (the zero is barred, which is not looking great in the app). I have tried using class func monospacedDigitSystemFont( ofSize fontSize: CGFloat, weight: UIFont.Weight ) -> UIFont and apply to label.text. To no avail as it modifies only digits, not space char. I have found a workaround, padding with 2 spaces instead of one, but is there another solution ? So I am looking for a space character that would have the same width as a digit. There existe thin space (https://en.wikipedia.org/wiki/Whitespace_character) but not larger space. Does it exist ?
4
0
192
3w
Recognizing Font Uninstall on visionOS
My visionOS app can install custom fonts. My visionOS app also lists these fonts as available within the application, and I can see them in a list using CTFontManagerCopyAvailableFontFamilyNames I manually track which fonts have been installed. So far, so good. But here’s my problem: When a user uninstalls a font via Settings, I have no way to tell. That’s because CTFontManagerCopyAvailableFontFamilyNames will still list that font because it’s still available within the application. How can I track these changes in my app when a font is uninstalled via Settings?
0
0
195
4w
Inconsistent "New York" font returned between devices
I'm seeing a discrepancy in the metrics of the "New York" system font returned from various Macs. Here's a sample (works well in Playgrounds): import Cocoa let font = NSFont(descriptor: .preferredFontDescriptor(forTextStyle: .body).withDesign(.serif)!, size: NSFont.systemFontSize)! print("\(font.fontName) \(font.pointSize)") print("ascender: \(font.ascender)") let layoutManager = NSLayoutManager() print("lineHeight: \(layoutManager.defaultLineHeight(for: font))") When I run this on multiple Macs, I get two types of different results. Some – most Macs – report this: .NewYork-Regular 13.0 ascender: 12.3779296875 lineHeight: 16.0 However, when I run on my own Mac (and also on the one of a colleague), I get this instead: .NewYork-Regular 13.0 ascender: 14.034145955454255 lineHeight: 19.0 It's clearly the same font in the same point size. Yet the font has different metrics, causing a layout manager to also compute a significantly different line height. So far I've found out that neither CPU generation/architecture nor macOS version seem to play a role. This issue has been reproducible since at least macOS 14. Having just migrated to a new Mac, the issue is still present. This does not affect any other system or commonly installed font. It's only New York (aka the serif design). So I assume this must be something with my setup. Yet I have been unable to find anything that may cause this. Anybody have some ideas? Happy to file a bug report but wanted to check here first.
2
0
257
2w
What is the criterion for Font Book's "English" Language group
I've created a font family, but Font Book refuses to include it in the English language set, despite my best efforts. The font has every glyph in the OpenType "Std" set, plus several others. I've checked various boxes for Latin 1 and Macintosh Character Codepages; plus Unicode ranges for Basic Latin, additional Latin, etc, etc. I've compared it to several other fonts that are in the English set, and I can't see anything that they have that my fonts don't. (In fact, many of them seem to have much less!) I've created other fonts that are in the English set, but I've no idea what the difference is. Given that macOS relies on these Language sets, in order to hide the thousands of unnecessary fonts that are permanently installed in the OS, there ought to be some guidance on how to do this.
0
0
125
Nov ’24
Is there a way to opt a Catalyst app into supporting preferred text size?
As of macOS Sequoia 15.1 (and probably earlier), in System Settings under Accessibility -> Display, there's a Text Size option that looks an awful lot like Dynamic Type on iOS: I have an iOS app with robust support for Dynamic Type that I've brought to the Mac via Catalyst. Is there any way for me to opt this app into supporting this setting, maybe with some Info.plist key? Calendar's Info.plist has a CTIgnoreUserFonts value set to true, but the Info.plist for Notes has no such value.
0
0
208
Oct ’24
Text with standard font style appears smaller on iPadOS than on iOS
I used standard font styles in an iOS app. For example .font(.headline). I hoped that developing this way would allow the adoption of the app to other platforms, relatively easy. However, when trying to run for iPadOS, the text did not increase in size to occupy the more abundant space offered by larger screen, but it actually shrank. Overall, the app does not look great "automatically". Why does it happen? What is the best practice for cross platform development with SwiftUI (with regards to font sizes). I want to make as little as possible human interface design decisions on my own and just let SwiftUI take care of everything. (But I also want the results to look as Apple would consider great looking)
0
0
216
Oct ’24
The usage license of Apple fonts
Hello, I am an app developer from China. We are developing a mobile game that will be released on iOS and Android platforms (as well as some PC and Mac platforms). The game is a commercial app. My question is: we would like to use the "PingFang" Chinese font in our game software. Do we need to obtain a license, and how should we go about obtaining it? (For example, through which channels should we apply for the license, and what are the associated fees?)
0
0
236
Oct ’24
Registering variable fonts programatically
Is there an API to register .ttf files that have variables fonts (ie one or more axes specified). CTFontManagerRegisterGraphicsFont() makes only the default variation available. The same file when specified in UIAppFonts of Info.plist makes all the variants available (confirmed by querying UIFont.fontName(forFamilyName:)) This is mostly required for registering fonts that are bundled as part of a Swift package.
0
0
356
Sep ’24
How does font caching / resources for each app work?
I'm a font developer. In the development process, I will revise a font and overwrite the OTF file that is currently enabled (registered) with macOS. If I then launch an app, it will immediately use the revised version of the font; while apps that are already loaded will continue to use the old version. This suggests that each app is loading new and separate font data, rather than getting it from some existing cache in memory. Yet macOS does have a "font cache" of some sort. Some apps, like TextEdit, seem to only load the fonts that they need to use. However, other apps, like Pages, load every enabled (registered) font on the OS!! (According to the Open Files list in Activity Monitor.) Given that /System/Library/Fonts/ is 625 Mb, and we can't disable any of it, isn't that a lot of data to be repeating? How many fonts is too many fonts? I can't find much documentation about the process.
0
0
262
Sep ’24
Icon Fonts failing review submission with ITMS-90853: Invalid font
Hello. Icon fonts such as Font Awesome 6 and react-native-vector-icons are being rejected submission with the automated Invalid Binary error. ITMS-90853: Invalid font - There was an error validating the font named 'FontAwesome6Free-Solid' at 'private-app-name/FontAwesome6_Solid.ttf'. ‘glyf’ table instructions. These fonts have previously worked over the course of the last 3 years without issue and just stopped working on Monday. GitHub is filled with related issues and bug reports. This is likely affecting thousands of apps.
2
0
579
Sep ’24
SF Mono, open source?
I know that the general San Francisco (SF) fonts (Text, Display, Pro, etc.) are exclusive to Apple, its products, and its affiliates. But when it comes to SF Mono, I am unsure of its official status. Is it open source? I know many companies often release their monospace font under the OFL license (i.e., Twilio Sans Mono, Intel One Mono, Ubuntu Mono (et al), Roboto Mono (et al), and more). As I've previously said, I also know that Apple is very protective it its brand. The thing that really confuses me is that the page for Microsoft's Open Source projects (opensource.microsoft.com) actually uses SF Mono! Are Apple and MS collaborating on this? There is no repository on GitHub or the Apple Developer website, but why is a competitor to Apple using their font? (I am using Windows, so the SF fonts aren't installed on my device, they use the font from their own CDN on their website)
1
0
692
Aug ’24
NSAttributedString draw in rect
I need to draw an attributed string into a given rectangle. The string's height should be the same as the rectangle's height. This should work with any font a user chooses. To make it a bit more complicated, the string should also fill the rect if it consists only of uppercase characters or only of lowercase characters. I am using NSLayoutManager to find the "best" font size for the selected font and the given recht and it works quite good with some fonts but with others it doesn't. Seems like the computed font size is always a bit too small and for some fonts it seems like the baseline must be corrected. Unfortunately I didn't find a way to calculate a baseline offset that really works with any font. I attached some sample images showing the issue. Just posting this to make sure I am not running in the complete wrong direction. Any help would be highly appreciated. Thanks!
13
0
858
Aug ’24
Custom fonts stop showing sometimes when you switch applications in SwiftUI
I have loaded custom fonts into my SwiftUI project in Xcode to a folder, with the target membership set to the correct build, I have included the correct names inside the info.plist in the fonts provided by application section, and included them in the code using the correct names as such: extension Font { static let mainFont: (FontWeights, CGFloat) -> Font = { fontType, size in switch fontType { case .hairline: Font.custom("TT Norms Pro Thin", size: size) case .thin: Font.custom("TT Norms Pro ExtraLight", size: size) case .light: Font.custom("TT Norms Pro Light", size: size) case .regular: Font.custom("TT Norms Pro Regular", size: size) case .medium: Font.custom("TT Norms Pro Medium", size: size) case .semiBold: Font.custom("TT Norms Pro DemiBold", size: size) case .bold: Font.custom("TT Norms Pro Bold", size: size) case .heavy: Font.custom("TT Norms Pro ExtraBold", size: size) case .black: Font.custom("TT Norms Pro Black", size: size) } } static let serifFont: (SerifFontWeights, CGFloat) -> Font = { fontType, size in switch fontType { case .semiBold: Font.custom("Butler Free Bd", size: size) } } } extension View { func mainFont(_ fontWeight: FontWeights? = .regular, _ size: CGFloat? = nil) -> some View { return font(.mainFont(fontWeight ?? .regular, size ?? 16)) } func serifFont(_ fontWeight: SerifFontWeights? = .semiBold, _ size: CGFloat? = nil) -> some View { return font(.serifFont(fontWeight ?? .semiBold, size ?? 16)) } } Most of the time this works and the font shows, but if I switch applications, often some of the fonts disappear and the standard iOS font shows. Sometimes, but rarely, it also already doesn't show correctly on launch. I also tried simpler ways to include the font and different font files, but it causes the same behavior. What could be the reason for this erratic behavior?
1
0
557
Aug ’24
Are default fonts under UIFont.familyNames licensed for use by iOS developers?
This is a follow-up to my previous question: How to attribute/credit Apple Fonts added to app? In that previous post, I misremembered what I did and said I found fonts via macOS' FontBooks, when instead I came acrossUIFont.familyNames. Since these are included via UIKit, the legal implications should be different. I looked at various license agreements that govern iOS app development but haven't found anything mentioning fonts. Since these are included as part of UIKit, its reasonable to assume that developers are allowed to include these fonts--but in what ways? Am I allowed to let users create, say, documents with these fonts? Am I only allowed to display these fonts? There are 84 fonts, and judging by their FontBook entries, there is a wide range of licenses and restrictions. It seems unnecessarily harsh to have every iOS developer verify each one and figure out which they can legally keep if they want to offer their users access to all (for, say, a text-editing app). There must be some overarching rule that supersedes/encapsulates them, but this rule isn't clear to me after hours of research. I'm not a lawyer, and I don't think Apple expects every app developer to consult their lawyers on whether they can use system fonts. I'm about to send an email to Apple's legal team (I will post their response here if allowed), but in the meantime I want to hear what other devs think about this. In Xcode, entering UIFont.familyNames returns the following: ["Academy Engraved LET", "Al Nile", "American Typewriter", "Apple Color Emoji", "Apple SD Gothic Neo", "Apple Symbols", "Arial", "Arial Hebrew", "Arial Rounded MT Bold", "Avenir", "Avenir Next", "Avenir Next Condensed", "Baskerville", "Bodoni 72", "Bodoni 72 Oldstyle", "Bodoni 72 Smallcaps", "Bodoni Ornaments", "Bradley Hand", "Chalkboard SE", "Chalkduster", "Charter", "Cochin", "Copperplate", "Courier New", "Damascus", "Devanagari Sangam MN", "Didot", "DIN Alternate", "DIN Condensed", "Euphemia UCAS", "Farah", "Futura", "Galvji", "Geeza Pro", "Georgia", "Gill Sans", "Grantha Sangam MN", "Helvetica", "Helvetica Neue", "Hiragino Maru Gothic ProN", "Hiragino Mincho ProN", "Hiragino Sans", "Hoefler Text", "Impact", "Kailasa", "Kefa", "Khmer Sangam MN", "Kohinoor Bangla", "Kohinoor Devanagari", "Kohinoor Gujarati", "Kohinoor Telugu", "Lao Sangam MN", "Malayalam Sangam MN", "Marker Felt", "Menlo", "Mishafi", "Mukta Mahee", "Myanmar Sangam MN", "Noteworthy", "Noto Nastaliq Urdu", "Noto Sans Kannada", "Noto Sans Myanmar", "Noto Sans Oriya", "Optima", "Palatino", "Papyrus", "Party LET", "PingFang HK", "PingFang SC", "PingFang TC", "Rockwell", "Savoye LET", "Sinhala Sangam MN", "Snell Roundhand", "STIX Two Math", "STIX Two Text", "Symbol", "Tamil Sangam MN", "Thonburi", "Times New Roman", "Trebuchet MS", "Verdana", "Zapf Dingbats", "Zapfino"]
0
0
508
Jul ’24
Issues Supporting All Accessibility Features with a Custom Font
I am in the process of adding my company's brand font to our SwiftUI app. I am able to implement the font using the provided public APIs so that text styles / dynamic type and the font weight modifier in SwiftUI work correctly. However we are unable to implement custom font in such a way that text styles / dynamic type, the font weight modifier, and the bold text accessibility setting all work at the same time. Am I missing an implementation detail so that all these features work correctly? Font Setup The font files were modified to better support SwiftUI: The font style name metadata was modified to match the name the .fontWeight(...) modifier expects. This was done with Typelight. The font weight value (100/200/300) was modified so that the underlying weight value matches the value the .fontWeight(...) modifier expects. See "Using custom fonts with SwiftUI" by Matthew Flint. The font files were imported via the Info.plist. Examples Font Weight Comparison San Fransisco: Text("#100") .font(.largeTitle) .fontWeight(.ultraLight) Overpass by Name: Text("#100") .font(.custom("Overpass-UltraLight", size: 34, relativeTo: .largeTitle)) Overpass by Weight: Text("#100") .fontWeight(.ultraLight) .font(.custom("Overpass", size: 34, relativeTo: .largeTitle)) Legibility Weight Test When using the .fontWeight(...) modifier, the custom font does not change weights when the bold text accessibility setting is enabled. Dynamic type size works as expected. Normal legibility weight: Bold legibility weight: Dynamic Type Size: Use UIFont Using UIFont to load the custom font files and initializing a Font with the UIFont breaks dynamic type: Bold type also does not work: Custom Modifier Creating a custom modifier allows us to support dynamic type and manually handle bold text. However it creates a conflicting API to SwiftUI's .fontWeight(...) modifier. struct FontModifier: ViewModifier { enum UseCase { case paragraph case headline } enum Weight { case light case regular case heavy } @Environment(\.legibilityWeight) var legibilityWeight var useCase: UseCase var weight: Weight init(_ useCase: UseCase, _ weight: Weight) { self.useCase = useCase self.weight = weight } var resolvedHeadlineWeight: String { let resolvedLegibilityWeight = legibilityWeight ?? .regular switch weight { case .light: switch resolvedLegibilityWeight { case .regular: return "Light" case .bold: return "Semibold" @unknown default: return "Light" } case .regular: switch resolvedLegibilityWeight { case .regular: return "Regular" case .bold: return "Bold" @unknown default: return "Regular" } case .heavy: switch resolvedLegibilityWeight { case .regular: return "Heavy" case .bold: return "Black" @unknown default: return "Heavy" } } } var resolvedParagraphWeight: Font.Weight { switch weight { case .light: return .light case .regular: return .regular case .heavy: return .heavy } } var resolvedFont: Font { switch useCase { case .paragraph: return .system(.largeTitle).weight(resolvedParagraphWeight) case .headline: return .custom("Overpass-\(resolvedHeadlineWeight)", size: 34, relativeTo: .largeTitle) } } func body(content: Content) -> some View { content .font(resolvedFont) } } GridRow { Text("Aa") .modifier(FontModifier(.paragraph, .regular)) Text("Aa") .modifier(FontModifier(.paragraph, .heavy)) Text("Aa") .modifier(FontModifier(.headline, .regular)) Text("Aa") .modifier(FontModifier(.headline, .heavy)) } Font Environment Value The font environment value does not contain font weight information when the fontWeight(...) modifier is used.: struct DumpFontTest: View { @Environment(\.font) var font var body: some View { Text("San Fransisco") .onAppear { print("------------") dump(font) } } }
3
1
936
Aug ’24