September 3, 2010

Using Custom fonts in your iOS application

Posted in iPhone development tagged , , , , , at 12:18 am by tetontech

I have found that there are quite a few postings out there about how to use custom fonts in your application.  It is unfortunate that I didn’t find  a single one that actually helped me use a custom font.  Most of them echoed each other and gave misleading or erroneous advice.  Because of this I am going to post how to actually use a custom font in your app.

First, you must be aware that custom fonts are added on a per-application basis.  You can not add a font to your iOS device and have it be available for all of your applications.

Second, no code needs to be added in order for you to use the custom font or fonts in a QuickConnectFamily hybrid iOS application or any other application that uses the UIWebView.

Third, no @font-face CSS call is needed in your application.

Fourth, this example will show two custom fonts being added and used.  The first is the Freshman font, the second is the PF Handbook Pro Normal font.  Both of these are available as ttf files.

OK.  So here is how we do it.

  1. Drag your ttf files into the Resources group of your project selecting the copy checkbox.
  2. Open your applications’ info.plist found in the Resources group.
  3. Control-click on any of the properties and select New
  4. Select ‘fonts provided by application’
  5. Expand the resource just created by clicking the triangle button on the left of the description
  6. Enter Freshman.ttf in the Value column (You would put the name of your font file here)
  7. Control-click the Freshman.ttf row and select Add Row
  8. Enter PFHandbookProRegular.ttf in the Value column(You would put the name of another font you want to use here)
  9. Use the font in your CSS or directly in an inline style.  Both now work.

Hopefully this will clear things up regarding using custom fonts.

About these ads

21 Comments »

  1. Thank you very much for this. Found it just as I was going to figure out how to do this for my next project. Keep up the good work!

  2. That’s pretty cool, thanks

  3. Jonas said,

    Hi,

    This instruction exists in other forums aswell and it doesn’t work for me. I have an iPad with IOS 4.2.1 and Xcode 3.2.5. The systems “sees” the font, but displays Arial instead. If I list all the fonts in the system, it is there. If I remove the font from the project or rename it, nothing is displayed. But as long as the font is installed the systems know of it, but won’t display it.

    The result is the same on the real device and in the simulator.

    When I add the font to resource-folder I get a box asking me about paths and encodings etc. Any idea what to chose there?

    Thank you.

    • tetontech said,

      I’m not sure what you mean by the box. Where is the box?

  4. Marko said,

    does this work with .otf fonts?

    • tetontech said,

      I haven’t actually tried it with .otf fonts so I can’t say for sure.

    • keith said,

      yes otf fonts will work

  5. Sound and Code Creations LLC said,

    Have any of you noticed longer loading times for you apps after using custom fonts?

  6. brennannovak said,

    I was using this exact solution but recently upon upgrading to iOS 5 it stopped working… dang!

    • tetontech said,

      I’ll check it out. If you beat me to a solution please let me know. I’m kinda swamped right now with iOS 5, the new SDK, Android dev, and getting my Doctorate.

    • rakkarage said,

      from apple forums

      “Engineering has determined that this issue behaves as intended based on the following information:

      The ability to display an arbitrary face in a font is new to iOS 5. Prior to that, you could only display the regular, bold, italic and bold italic faces in a font (independent of how many faces the font had).

      The following code:
      UIFont* aFont = [UIFont fontWithName:@"HelveticaNeue-CondensedBlack" size:22.0];
      NSLog(@”%@”, aFont ? aFont : @”NULL FONT”);

      In iOS 4.3 returns
      NULL FONT

      in iOS 5 returns
      font-family: “HelveticaNeue-CondensedBlack”; font-weight: bold; font-style: normal; font-size: 22px”

      so make sure you dont have .ttf at the end, and use the right name, and have it in the UIAppFonts list, and it works for me in ios5

      • rakkarage said,

        for example Ubuntu-b.ttf loads as:
        Ubuntu-Bold
        instead of
        Ubuntu-B or Ubuntu-B.ttf
        so its a new feature but it ‘names’ them different now

  7. yotes said,

    Great thanks a lot!

  8. david said,

    i have tried to use ttf font (ios 5)
    but it didn’t work(maybe the font didn’t had the characters i was looking for,i haven’t checked it.., i just assumed, it had)
    so i used instead, ttc font
    works perfect, thanks for this tutorial :-)

  9. Ranga Reddy said,

    Hey, really thanks for the info U had provided but i have one question with which i had very hard time.
    i was going through this link: “http://iosfonts.com/”
    which has the list of font families which is supported by iOS 5,,,,,,,,
    Do we need to include the TTF files for this font families also?
    if Yes where do i find these?
    but when i included these font families in my project without adding TTF files , i can still run the app with different fonts in simulator, i am using iOS 5 SDK.

    i was under impression that we need to use only TTF files if we need to use the fonts other than which is provided in the above link i, e other than which is supported by iOS 5.

    Let me know the real logic behind that as soon as possible. thanks in advance.

    • tetontech said,

      It has been a while since I looked at font support. I could be wrong but it seems to me that if the files are supported by iOS 5 the TTF files shouldn’t be needed. Then again I haven’t tested this. These fonts should already be installed on the device.

  10. [...] Custom Fonts [...]

  11. wiralim said,

    THX u

  12. Shamsher Singh said,

    Purrfect.
    Thx a million. Am using iOS.6 xCode 4.5
    God Bless You.

  13. Custom Apps said,

    Thx for sharing this useful info…

  14. Ark-kun said,

    Fonts can easily be dynamically loaded from any location and any byte stream. See the article here: http://www.marco.org/2012/12/21/ios-dynamic-font-loading

    NSData *inData = /* your font-file data */;
    CFErrorRef error;
    CGDataProviderRef provider = CGDataProviderCreateWithCFData((CFDataRef)inData);
    CGFontRef font = CGFontCreateWithDataProvider(provider);
    if (! CTFontManagerRegisterGraphicsFont(font, &error)) {
    CFStringRef errorDescription = CFErrorCopyDescription(error)
    NSLog(@”Failed to load font: %@”, errorDescription);
    CFRelease(errorDescription);
    }
    CFRelease(font);
    CFRelease(provider);

    * You don’t have to put the font in your bundle.
    * You don’t have to explicitly register the font in your info.plist.


Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

Follow

Get every new post delivered to your Inbox.

Join 307 other followers

%d bloggers like this: