iOS Branding Fonts

The BrandingFontsProvider is based on Apple’s Topography section of the Human Interface Guidelines. It uses the same names and defaults, as in the Specifications > Large (Default) section of the guide.

As the SDK uses both UIKit and SwiftUI, both UIFont and Font may be used in various views. For consistency and ease of use, SDK encapsulate the font styles in a universal way, using a custom class Branding.FontDefinition.

For correct scaling, integrators must also provide a UIFont.TextStyle which will be used for both, UIFont and Font (converted to Font.TextStyle)

For example: BrandingFontsProvider.largeTitle style by default is defined as:

  • Font.system(.largeTitle)
  • UIFont.systemFont(ofSize: 30)
  • With scaling based on UIFont.TextStyle.largeTitle / Font.TextStyle.largeTitle

The custom Branding.FontDefinition can be initialized in one of two ways:

  • A name, size, and style of the font can be provided. Note that the name must incorporate both the font family name and the specific style information for the font (similar to Font.custom(_:size:relativeTo:) or UIFont(name:size:))
  • Instances of Font and UIFont objects, as well as the style.

Integrators can override all or some font styles. The default style will be used for styles that were not overridden.

Fonts Usage in Capture

In Capture, the following font styles are used:

Style nameUsage Description
largeTitletext over camera view (capture progress feedback on Capture screen)
title2larger title text (e.g. tip title on Tips screen, or selected document type option on Capture screen)
title3smaller title text (e.g. Crop screen title)
bodynormal screen text (e.g. tip description on Tips screen)
subheadlinePrimary and Secondary action button labels
footnotesmaller text (e.g. Crop, Add Page, and other buttons on Preview screen)
captionvery small text (e.g. page count on Capture screen)

Steps:

  1. Follow the Apple’s Adding a Custom Font to Your App guide to register custom fonts in your app. If your custom fonts are already registered with your iOS app, you can skip this step.

  2. Create a custom BrandingFontsProvider implementation and override the styles you want.

  3. Test capture with custom fonts, to ensure that all elements are displayed correctly. The testing must include changing the font size via the device’s Settings > Accessibility, and ensuring that the fonts are displayed correctly when Larger Accessibility Sizes setting is on and font sizes are increased.

Example

In the following example the fonts for Primary and Secondary action buttons are customized, as well as the font used for buttons on Preview screen. All other fonts are left with their default values

class MyFonts: BrandingFontsProvider {
    
    var subheadline: SensibillCapture.Branding.FontDefinition {
        Branding.FontDefinition(name: "Zapfino", size: 14, style: .subheadline)
    }
    
    var footnote: SensibillCapture.Branding.FontDefinition {
        Branding.FontDefinition(name: "DINCondensed-Bold", size: 12, style: .footnote)
    }
}

let branding = Branding()
branding.fonts = MyFonts()
// ...