Using Custom Fonts in IDWise SDK

ℹ️

Note

Custom fonts are supported on all platforms except for Web. IDWise Web SDK does not currently support custom fonts.

To integrate a custom font into your application, please follow these steps:

  • Go to Theme Designer and provide the font name in the properties Font Family (Android) and Font Family (IOS) . For example "roboto". Note here that you should specify the Font Family name and not add the file extension (ttf or otf) in this configuration. You can use the same font or different fonts for each platform:

  • You need to embed the font files in your app. You may need to supply font file for each style for example "roboto-Regular.ttf", "roboto-Bold.ttf". To embed the font files, follow the steps depending on your platform:

📘

info

On iOS, the font name may differ from the font file name. To find the actual font name, use the following iOS code snippet.

for family in UIFont.familyNames {  
  print("\(family)")  
  for name: String in UIFont.fontNames(forFamilyName: family) {  
    print("== \(name)")  
  }  
}

Android

  • Add font file in the project's font directory. For example app/src/main/res/fonts/roboto.ttf.

iOS

  1. In your iOS XCode project, Add the font file to your XCode project. Select File > Add Files to <Your Project Name> from the menu bar, or drag the font file from Finder and drop it into your XCode project.

  2. Make sure the font file is a target member of your app:

  3. You need to make fonts group/folder in your project under your project directory as shown below:

  4. Register Your Font File with iOS. After adding the font file to your project, you need to let iOS know about the font. To do this, add the key Fonts provided by application to Info.plist (the raw key name is UIAppFonts). XCode creates an array value for the key; add the name of the font file as an item of the array. Be sure to include the file extension as part of the name as shown in the following screenshot:

  5. Each font file you add to your project must be listed in this array covering all the needed styles.

Flutter

You need to embed the font in both your generated Android Studio project and XCode project so the font works both for your Android and iOS app

  • In your Android Studio project:

    1. Add font file in the project's font directory. For example app/src/main/res/fonts/roboto.ttf
  • In your iOS XCode project:

    1. In your iOS XCode project, Add the font file to your XCode project. Select File > Add Files to <Your Project Name> from the menu bar, or drag the font file from Finder and drop it into your XCode project.

    2. Make sure the font file is a target member of your app:

    3. You need to make fonts group/folder under Runner directory as shown below:

    4. Register Your Font File with iOS. After adding the font file to your project, you need to let iOS know about the font. To do this, add the key Fonts provided by application to Info.plist (the raw key name is UIAppFonts). XCode creates an array value for the key; add the name of the font file as an item of the array. Be sure to include the file extension as part of the name as shown in the following screenshot:

    5. Each font file you add to your project must be listed in this array covering all the needed styles.