Jump to content

[TOPIC: topicViewTemplate]
[GLOBAL: userSmallPhoto]
Photo

Embedding custom fonts
Started by Eric Sep 30 2010 07:19 AM

- - - - -
49 replies to this topic
[TOPIC CONTROLS]
Page 1 of 2 1 2
This topic has been archived. This means that you cannot reply to this topic.
[/TOPIC CONTROLS]
[modOptionsDropdown]
[/modOptionsDropdown]
[reputationFilter]
[TOPIC: post.html]
#1

Eric

[GLOBAL: userInfoPane.html]
Eric
  • Contributor

  • 485 posts
  • Guests

You can embed a custom font in your app. This feature's been in for a little while, but wasn't documented. So I thought it'd be worth bringing it to your attention.

uid: 54 topic_id: 2289 reply_id: 302289


[TOPIC: post.html]
#2

secure411dotorg

[GLOBAL: userInfoPane.html]
secure411dotorg
  • Observer

  • 18 posts
  • Guests

Please provide an example showing a complete build.settings file for Android that includes a custom font. Or point to a reference that explains all the elements of the build settings.

Here was my wild guess trying to adapt the iphone version shown in the ansca example for embedding font

settings =
{
androidPermissions =
{
"android.permission.INTERNET"
},

android =
{
plist =
{
UIAppFonts =
{
"VeraMono.ttf"
}
},
},
}
uid: 10016 topic_id: 2289 reply_id: 8156


[TOPIC: post.html]
#3

Eric

[GLOBAL: userInfoPane.html]
Eric
  • Contributor

  • 485 posts
  • Guests

You don't need an entry on Android. I updated the docs to reflect that.
uid: 54 topic_id: 2289 reply_id: 8163


[TOPIC: post.html]
#4

jonbeebe

[GLOBAL: userInfoPane.html]
jonbeebe
  • Contributor

  • 511 posts
  • Corona SDK

That explains why I was going through the docs yesterday, noticed it and thought... whoah I didn't know you could do that!
uid: 7849 topic_id: 2289 reply_id: 8177


[TOPIC: post.html]
#5

Stephen Lewis

[GLOBAL: userInfoPane.html]
Stephen Lewis
  • Contributor

  • 716 posts
  • Enterprise

Can anyone verify that this works on an actual device? Following the instructions here I can see and use my custom font in the Corona Sim and the Xcode Sim, but when I build for an actual device the font is absent. (ie - buttons that use the font for text labels look correct on both sims, but on the iPhone itself the buttons are blank.)

uid: 9422 topic_id: 2289 reply_id: 13044


[TOPIC: post.html]
#6

tokyodan

[GLOBAL: userInfoPane.html]
tokyodan
  • Contributor

  • 260 posts
  • Guests

THis works for me. In simulaator AND on my iPhone 3GS. Here is my build.settings file:

settings = {
iphone = {
plist = {
UIApplicationExitsOnSuspend = true,
UIAppFonts = {
"SFDigitalReadout-Heavy.ttf"
}
},
},
}

And in my project folder along with all source (*.lua), graphics, and sound files is:

SFDigitalReadout-Heavy.ttf
uid: 295 topic_id: 2289 reply_id: 13186


[TOPIC: post.html]
#7

IgnacioIturra

[GLOBAL: userInfoPane.html]
IgnacioIturra
  • Contributor

  • 359 posts
  • Guests

Yes I can also confirm it works. Though you'll need iOS 3.2. It's worth noting if you're planning to support the original iphone (can't install 3.2.), you'd be better off with bitmap text.
uid: 10835 topic_id: 2289 reply_id: 13189


[TOPIC: post.html]
#8

Stephen Lewis

[GLOBAL: userInfoPane.html]
Stephen Lewis
  • Contributor

  • 716 posts
  • Enterprise

Thanks for the confirmation, tokyodan and Ignaciolturra.

It turns out the font I was trying to use had the extention ".TTF" as opposed to ".ttf", which is how I had it in my build.settings. I guess OSX (and the simulators) are smart enough to handle that, but iOS isn't.

Also, Ignaciol, thanks for the heads up about the compatibility issue with original iPhone. I'm on the fence about supporting it since, currently, my game runs at about half speed on it vs. 3GS and 4. I wonder if there's a way to detect which phone is being used and fallback to a system font if it's an original iPhone.
uid: 9422 topic_id: 2289 reply_id: 13241


[TOPIC: post.html]
#9

Stephen Lewis

[GLOBAL: userInfoPane.html]
Stephen Lewis
  • Contributor

  • 716 posts
  • Enterprise

My custom font is now working on the devices, but there's another problem. Text using the custom font is shifted up a few pixels. It looks particularly bad when using the font for button label text since the font creeps over the top edge of my button graphic.

I Googled around and it seems this is a problem for people trying to use custom fonts on iPhones after iOS 3, when Apple changed the UPM for fonts from 1000 to 2048. I don't understand the problem, or what the solution might be, all I know is the font is aligned correctly in the Corona simulator and OSX, but is misaligned vertically on my iPhone. Anyone else notice their custom fonts misaligned on an actual device? Is this a bug for Ansca?
uid: 9422 topic_id: 2289 reply_id: 13478


[TOPIC: post.html]
#10

joemauke

[GLOBAL: userInfoPane.html]
joemauke
  • Observer

  • 24 posts
  • Corona SDK

is there something Im missing? I have done everything pretty much to the letter what was written here. Was the font supposed to be in a certain folder?
uid: 10051 topic_id: 2289 reply_id: 13615


[TOPIC: post.html]
#11

IgnacioIturra

[GLOBAL: userInfoPane.html]
IgnacioIturra
  • Contributor

  • 359 posts
  • Guests

Yes, you have to copy it to your project's root folder as well.
uid: 10835 topic_id: 2289 reply_id: 14144


[TOPIC: post.html]
#12

joemauke

[GLOBAL: userInfoPane.html]
joemauke
  • Observer

  • 24 posts
  • Corona SDK

yes, did that as well as all the other directions to the letter
uid: 10051 topic_id: 2289 reply_id: 14145


[TOPIC: post.html]
#13

IgnacioIturra

[GLOBAL: userInfoPane.html]
IgnacioIturra
  • Contributor

  • 359 posts
  • Guests

The only other thing I can think of is that you have the name of the font wrong. It's not necessarily the name of the file, but how it shows in other programs. Try using the font in something else and see what it's called (Also try different fonts to try and narrow down the issue).
uid: 10835 topic_id: 2289 reply_id: 14150


[TOPIC: post.html]
#14

joemauke

[GLOBAL: userInfoPane.html]
joemauke
  • Observer

  • 24 posts
  • Corona SDK

I used FONTBOOK in osx to find the font name...although I used the sample code on showing native fonts on the device, and my font wasnt in there...no matter what the name was exactly. even the harrowprint exmple font provided didnt show, and my ipad has the latest iOS ver.
uid: 10051 topic_id: 2289 reply_id: 14153


[TOPIC: post.html]
#15

snarla

[GLOBAL: userInfoPane.html]
snarla
  • Contributor

  • 116 posts
  • Alumni

Hi, following up here in case someone else has a similar problem.

Another thing to check in your build.settings file is that the UIAppFonts entry needs to be a list, even if it only has one entry. In other words, it should look like this:

UIAppFonts = {
"SFDigitalReadout-Heavy.ttf"
}

This will not work:

UIAppFonts = "SFDigitalReadout-Heavy.ttf"
uid: 6787 topic_id: 2289 reply_id: 14434


[TOPIC: post.html]
#16

joemauke

[GLOBAL: userInfoPane.html]
joemauke
  • Observer

  • 24 posts
  • Corona SDK

Ok, so now the font finally shows up...thanks for the heads up on how to get it right in the build file, but it would appear that I am having the same issue as XenonBL where the text is fine on Corona Sim but on the device its shifted up. Is this a bug for ANSCA? I would hate to have to go through and change all this around when its just a bug to be fixed.

uid: 10051 topic_id: 2289 reply_id: 15230


[TOPIC: post.html]
#17

nicksantan

[GLOBAL: userInfoPane.html]
nicksantan
  • Contributor

  • 106 posts
  • Corona SDK

Dumb question: where can I find the build.settings file? Or do I create on in my project directory?
uid: 7472 topic_id: 2289 reply_id: 19126


[TOPIC: post.html]
#18

alanb

[GLOBAL: userInfoPane.html]
alanb
  • Enthusiast

  • 30 posts
  • Guests

@Nick: you create the build.settings file yourself in the root project directory.
uid: 22457 topic_id: 2289 reply_id: 19567


[TOPIC: post.html]
#19

Shaunathan

[GLOBAL: userInfoPane.html]
Shaunathan
  • Observer

  • 10 posts
  • Guests

dumber question, when I use a ttf font the font size is fixed, it doesn't matter how big I make the font in display.newText, it will stay the same size. Why is it doing that? It IS the correct font, but the size is unchangable.
uid: 20703 topic_id: 2289 reply_id: 21103


[TOPIC: post.html]
#20

DavidBFox

[GLOBAL: userInfoPane.html]
DavidBFox
  • Contributor

  • 179 posts
  • Corona SDK

Shaunathan, I had no trouble changing font size when using a custom font on a button. Want to paste in your code? Maybe there's a problem there.
uid: 9905 topic_id: 2289 reply_id: 21799


[TOPIC: post.html]
#21

rhalferty

[GLOBAL: userInfoPane.html]
rhalferty
  • Observer

  • 14 posts
  • Corona SDK

Does this work with the Windows Simulator? I am having trouble trying to get a custom font on my windows machine working. Of course this is Android only.
uid: 27076 topic_id: 2289 reply_id: 21991


[TOPIC: post.html]
#22

Shaunathan

[GLOBAL: userInfoPane.html]
Shaunathan
  • Observer

  • 10 posts
  • Guests

turns out it's the font, "linesquare rounded extended" on dafont.com it's a free font, so you can try it yourself. Perhaps it's a problem because it's a .ttf. Does Corona only work with .otf?

UPDATE:

Different .ttf worked fine. Maybe it has trouble with pixelized Flash compatible fonts?
uid: 20703 topic_id: 2289 reply_id: 22286


[TOPIC: post.html]
#23

DavidBFox

[GLOBAL: userInfoPane.html]
DavidBFox
  • Contributor

  • 179 posts
  • Corona SDK

Shanathan, I was able to get that linesquare rounded extended font to work in the simulator. Haven't tried it on an iPhone.

Three things to check.

1. Make sure you have a copy of the font in your library/fonts folder

2. Make sure you have a build.settings file at the same level as your main.lua file. It needs to have this code in it:

iphone =	{		plist=		{			UIAppFonts = {				"linesquare_rounded_extended.ttf",			},		},	},


Here the file name has to exactly match the actual font file.

3. When calling the font in your code, make sure you use the actual name of the font, as seen in FontBook and other apps. In this case, it's "Linesquare Rounded Extended" (case is important). For example,

local debugText = display.newText("Test message", 24, 0, "Linesquare Rounded Extended", 44)debugText:setTextColor(255, 70, 70)debugText.y = 24debugText.x = 54


uid: 9905 topic_id: 2289 reply_id: 22314


[TOPIC: post.html]
#24

Urme

[GLOBAL: userInfoPane.html]
Urme
  • Enthusiast

  • 32 posts
  • Guests

I've tried all possible solutions but I can't get my custom font working on the device, it works fine in the simulator but on the device no text will display at all :(
uid: 35378 topic_id: 2289 reply_id: 23405


[TOPIC: post.html]
#25

DavidBFox

[GLOBAL: userInfoPane.html]
DavidBFox
  • Contributor

  • 179 posts
  • Corona SDK

Urme, I've had mixed results with fonts. Some worked for me and some didn't. See if you can get any custom fonts to work, like the Harrowprint example described here.

If you can get that one to work, then you could try your own. But I've found that at least 2/3 of the fonts I've tried didn't work, maybe because they're not TrueType, or some other issue. You could then zip up your project, including the font, upload it to your website, and link to it here so others can take a look.
uid: 9905 topic_id: 2289 reply_id: 23451



[topic_controls]
Page 1 of 2 1 2
 
[/topic_controls]