One of the nice capabilities of the iPad and 3.2 iPhone SDK is the ability to add your own custom fonts to your application. With Titanium 1.2, this is supported but requires you to make a few minor modifications that I thought I’d outline here. Unfortunately, if you scour the web at this point, there’s virtual no documentation on how to do this with the Apple SDK either.
1. First, you’ll need to copy your TTF or OTF font to your application Resources directory. Make sure it’s a font you have the legal right to redistribute.
2. In your project build/iphone/build directory, edit the file named Info.plist.template in your favorite text editor. Add the following to the file near the bottom (it’s XML so be careful).
UIAppFonts
blah.otf
I named my font blah, but make sure you use the correct filename.
3. Now, to use the new font, create a normal Titanium UI Label and provide your font name that you see in Font Book (see screenshot).
Here’s a code snippet:
var label = Ti.UI.createLabel({text:”junction regular”,
font:{fontSize:98,fontFamily:”junction regular”},
top:10,
width:”auto”
});
win.add(label);
Notice that what you name the font file and what you use for fontFamily is totally not related. You must use the name of the font embedded in the font file when referencing it in Titanium, regardless of what you name it.
In the future, we’re likely going to make this a little easier and cross-platform as more devices support custom fonts.
As an update for those using 1.3+, we’ve changed the way that custom Info.plist files are handled in Titanium. You’ll want to copy the Info.plist that is generated for your project under build/iphone into your project root folder. You can edit this file to add any custom Info.plist changes. From now on, Titanium compiler will always use this Info.plist.
Follow us on social