Font Loading - TTF - Not always?

[jack95]

Why is it that some TTF fonts won’t load in the simulator?

For example, I have build.settings with:

-- Supported values for orientation: -- portrait, portraitUpsideDown, landscapeLeft, landscapeRight settings = { orientation = { default = "portrait", supported = { "portrait", } }, iphone = { plist = { UIAppFonts = { "Bebas Neue.ttf", "Continuum Bold.ttf", "True Crimes.ttf", "Dead Kansas.ttf", "HelveticaNeue-Light.ttf", "Sprite Graffiti.ttf" }, UIStatusBarHidden = false, UIPrerenderedIcon = true, -- set to false for "shine" overlay CFBundleIconFile = "Icon.png", CFBundleIconFiles = { "Icon.png" , "Icon@2x.png" , "Icon-114.png" , }, UIApplicationExitsOnSuspend = true, -- uncomment to quit app on suspend --[[-- iOS app URL schemes: CFBundleURLTypes = { { CFBundleURLSchemes = { "fbXXXXXXXXXXXXXX", -- example scheme for facebook "coronasdkapp", -- example second scheme } } } --]] } }, android = { versionCode = "1", versionName = "1.0", largeHeap = true, --usesExpansionFile = true, usesPermissions = { "android.permission.INTERNET", "com.android.vending.CHECK\_LICENSE", "com.android.vending.BILLING", --"android.permission.WRITE\_EXTERNAL\_STORAGE", } }, plugins = { --["plugin.openssl"] = { publisherId = "com.coronalabs", }, -- key is the name passed to Lua's 'require()' --["plugin.zip"] = { publisherId = "com.coronalabs", }, -- key is the name passed to Lua's 'require()' --["CoronaProvider.ads.AdMob"] = { publisherId = "com.coronalabs", }, }, }

and in my main.lua I have:

--require("loq\_profiler").createProfiler() --require "lib.strict" s = require("storyboard") s.g = { sprites = {} } widget = require("widget") ------------------------------------------------------------ -- Game UI - Backgrounds for devices ------------------------------------------------------------ display.setDefault( "anchorX", 0 ) display.setDefault( "anchorY", 0 ) ---- End Game UI for devices init --------------------------- --s.gotoScene( "scenes.test" ) local function checkFonts() local fonts = native.getFontNames() -- Display each font in the terminal console for i, fontname in ipairs(fonts) do print( "fontname = " .. tostring( fontname ), i ) end end checkFonts()

I have the font installed in Windows 7 and I have the ttf file in the main.lua directory. 

For some reason I can’t upload the font, so here’s a link to the zip of it:

http://www.filedropper.com/spritegraffiti

Why don’t certain fonts load?

[rob]

Perhaps the font is corrupt?

[jack95]

I don’t understand “corrupt”. This is not the only TTF to fail. If the OS accepts the font (I can use it in MS Word, for example), what is the validation criteria?

[roaminggamer]

@jack,

It is common for some fonts not to ‘load the way you expect’.  

Try this in your app:

for i, fontName in ipairs( systemFonts ) do print( "Font Name = " .. tostring( fontName[i] ) ) end

Run it on your device, and look at the log.  You will probably find font names that are similar to the ones you’re loading but slightly different.  

This tells you the font is loading, but the ‘internal’ name does not match the file name.  You can then do this:

1. Rename the TTF to match the one revealed by the print above.

2. Change your build settings code.

3. Refer to the font by its ‘internal’ name in your code.

 
Example:

-- If you see this in the log: Continuum-Bold -- Then rename the file to Continuum-Bold.ttf -- Change your build.settings to load Continuum-Bold.ttf -- And in code refer to it like this: "Continuum-Bold"

Final note: You may run into a really annoying case, where the ‘internal’ name if different for:

• iOS     and/or
• Android    and/or
• Window Simulator    and/or
• OS X Simulator

This happens occasionally.  You’ll just have to roll with it.  For example, say ‘Continiuum Bold.ttf’ is detected like this:

• iOS - Continuum-Bold
• OS X - ContinuumBold
• Window/Android - Continuum Bold

You could do this in your code:

\_G.onSimulator = system.getInfo( "environment" ) == "simulator" \_G.oniOS = ( system.getInfo("platformName") == "iPhone OS") \_G.onAndroid = ( system.getInfo("platformName") == "Android") \_G.onOSX = ( system.getInfo("platformName") == "Mac OS X") \_G.onWin = ( system.getInfo("platformName") == "Win") \_G.gameFont = "Continuum Bold" if(oniOS) then gameFont = "Continuum-Bold" else if(onOSX) then gameFont = "ContinuumBold" end

[roaminggamer]

Font loading is a twitchy thing.  Some fonts load fine in one OS, but not in Android or not in iOS.  

Desktop OSes generally have no problem.

Oh, and for fun, the OS may not give good feedback when it can’t load a font.  It just fails.  

However, once you’ve gotten it working on your test device(s) you should be good to go.

Lastly, this is not a Corona issue (in fact Font loading has improved a lot in the last 6 months), its a Cross-platform development issue complicated by some fonts doing a poor job of consistent naming (internally).

If you’re curious, download TTF Edit for Windows and open/edit a TTF file.  Look under the advanced section and you’ll be blown away by the amount of junk there is in a font ‘naming’ it.

-Ed

[jack95]

I have font listing i my main.lua (original post, after the build.settings). 

for i, fontName in ipairs( systemFonts ) do print( "Font Name = " .. tostring( fontName[i] ) ) end

This is the ONLY way I know to test if a font is recognized. Thanks for the tip on TTF Edit.

[roaminggamer]

Ah, sorry I missed that.

Yeah, like I said, font loading is much improved lately, but I still find I need to edit and fix some fonts with a tool like TTF Edit.

I don’t know why but some fonts are fine, others are garbage.  

Tip: I always select my fonts early in the project and verify that they work in a wide range of sizes, and on many devices, before I start using them.  

Tip2: I have the most issues with Font Families.  Ex: FONTA Bold, FONTA Italic, etc.  These almost always have internal name conflicts and only the last font I list in build.settings, gets loaded.  The others get wiped out.  

In this case, I either avoid the fonts, or custom edit their internal names.

[Joshua_Quick]

Once the font is installed on Windows, you then have to load the font by its font “Family Name”.  You can view the font family name when double click the font file on Windows.  Or you can do it as how jack95 has proposed.

Also, as of daily build #2597, you can now load the font file on Windows by its “file name” under you Corona project directory.  You no longer have to install the font on Windows.  Android supports this too.

   https://docs.coronalabs.com/daily/guide/system/customFont/index.html#windows-1

Mac and iOS unfortunately load fonts a bit differently.  You don’t load the font by file name.  Instead its by the “font name” which may or may not match the font “Family Name” you see on Windows.  It’s kind of an unfortunate platform difference, but it is what it is.  However, one nice way of handling it is to do what @roaminggamer mentioned above.  You can rename the font file to match the font name that supported on Mac/iOS so that you can load the font consistently between all platforms.  Both Windows and Android support loading a font file by its file name minus the extension (Corona will concatenate an .otf and .ttf extension in an attempt to find the font file).

I hope this helps!

[jack95]

I was able to successfully use my TTF using “TTF Edit” from Sourceforge - it’s an older java based application. The font was missing values for some polish characters, which is why it was probably “corrupt”. The tool was able to put in empty placeholders (repairing it). 2 years and it’s finally solved, THANKS SO MUCH  :D 

[rob]

Glad you solved it.  Its those types of issues I was referring to as corrupt.  Different applications and operating systems may be more more less sensitive to errors in the font file.  Fonts coming from lesser known foundries, which includes a lot of the free fonts, can have errors in them that can create issues.  Usually it’s alignment issues, like the bottom of descenders becoming the baseline, etc.

Rob

[Alan_PlantPot]

I’ve also found in the past that there can be issues if an OTF file extension is manually changed to TTF (or maybe it was the other way round). It was very frustrating because it was a font file found online so I didn’t even realise that the file had been changed.

[jack95]

I version all my production font files (in the main directory), as well as keeping original downloads in an artifacts folder along with relevant readme instructions.

[rob]

Perhaps the font is corrupt?

[jack95]

I don’t understand “corrupt”. This is not the only TTF to fail. If the OS accepts the font (I can use it in MS Word, for example), what is the validation criteria?

[roaminggamer]

@jack,

It is common for some fonts not to ‘load the way you expect’.  

Try this in your app:

for i, fontName in ipairs( systemFonts ) do print( "Font Name = " .. tostring( fontName[i] ) ) end

Run it on your device, and look at the log.  You will probably find font names that are similar to the ones you’re loading but slightly different.  

This tells you the font is loading, but the ‘internal’ name does not match the file name.  You can then do this:

1. Rename the TTF to match the one revealed by the print above.

2. Change your build settings code.

3. Refer to the font by its ‘internal’ name in your code.

 
Example:

-- If you see this in the log: Continuum-Bold -- Then rename the file to Continuum-Bold.ttf -- Change your build.settings to load Continuum-Bold.ttf -- And in code refer to it like this: "Continuum-Bold"

Final note: You may run into a really annoying case, where the ‘internal’ name if different for:

• iOS     and/or
• Android    and/or
• Window Simulator    and/or
• OS X Simulator

This happens occasionally.  You’ll just have to roll with it.  For example, say ‘Continiuum Bold.ttf’ is detected like this:

• iOS - Continuum-Bold
• OS X - ContinuumBold
• Window/Android - Continuum Bold

You could do this in your code:

\_G.onSimulator = system.getInfo( "environment" ) == "simulator" \_G.oniOS = ( system.getInfo("platformName") == "iPhone OS") \_G.onAndroid = ( system.getInfo("platformName") == "Android") \_G.onOSX = ( system.getInfo("platformName") == "Mac OS X") \_G.onWin = ( system.getInfo("platformName") == "Win") \_G.gameFont = "Continuum Bold" if(oniOS) then gameFont = "Continuum-Bold" else if(onOSX) then gameFont = "ContinuumBold" end

[roaminggamer]

Font loading is a twitchy thing.  Some fonts load fine in one OS, but not in Android or not in iOS.  

Desktop OSes generally have no problem.

Oh, and for fun, the OS may not give good feedback when it can’t load a font.  It just fails.  

However, once you’ve gotten it working on your test device(s) you should be good to go.

Lastly, this is not a Corona issue (in fact Font loading has improved a lot in the last 6 months), its a Cross-platform development issue complicated by some fonts doing a poor job of consistent naming (internally).

If you’re curious, download TTF Edit for Windows and open/edit a TTF file.  Look under the advanced section and you’ll be blown away by the amount of junk there is in a font ‘naming’ it.

-Ed

[jack95]

I have font listing i my main.lua (original post, after the build.settings). 

for i, fontName in ipairs( systemFonts ) do print( "Font Name = " .. tostring( fontName[i] ) ) end

This is the ONLY way I know to test if a font is recognized. Thanks for the tip on TTF Edit.

[roaminggamer]

Ah, sorry I missed that.

Yeah, like I said, font loading is much improved lately, but I still find I need to edit and fix some fonts with a tool like TTF Edit.

I don’t know why but some fonts are fine, others are garbage.  

Tip: I always select my fonts early in the project and verify that they work in a wide range of sizes, and on many devices, before I start using them.  

Tip2: I have the most issues with Font Families.  Ex: FONTA Bold, FONTA Italic, etc.  These almost always have internal name conflicts and only the last font I list in build.settings, gets loaded.  The others get wiped out.  

In this case, I either avoid the fonts, or custom edit their internal names.

[Joshua_Quick]

Once the font is installed on Windows, you then have to load the font by its font “Family Name”.  You can view the font family name when double click the font file on Windows.  Or you can do it as how jack95 has proposed.

Also, as of daily build #2597, you can now load the font file on Windows by its “file name” under you Corona project directory.  You no longer have to install the font on Windows.  Android supports this too.

   https://docs.coronalabs.com/daily/guide/system/customFont/index.html#windows-1

Mac and iOS unfortunately load fonts a bit differently.  You don’t load the font by file name.  Instead its by the “font name” which may or may not match the font “Family Name” you see on Windows.  It’s kind of an unfortunate platform difference, but it is what it is.  However, one nice way of handling it is to do what @roaminggamer mentioned above.  You can rename the font file to match the font name that supported on Mac/iOS so that you can load the font consistently between all platforms.  Both Windows and Android support loading a font file by its file name minus the extension (Corona will concatenate an .otf and .ttf extension in an attempt to find the font file).

I hope this helps!

[jack95]

I was able to successfully use my TTF using “TTF Edit” from Sourceforge - it’s an older java based application. The font was missing values for some polish characters, which is why it was probably “corrupt”. The tool was able to put in empty placeholders (repairing it). 2 years and it’s finally solved, THANKS SO MUCH  :D