cocoonJS fonts

  • We kind need mor info, how the font get loaded, by whom? Automatically by cocoonJS that applies it to everything or is C2 that handles this?

  • Ok, we've been seeing some users having trouble with this, while for others it works just fine. After some digging, we think we've found a couple of issues.

    First of all, CocoonJS searches for fonts by filename, and not by the internal font name. This means that if the font name is "my super font!", but your file is named "my_super_font_0.ttf", Construct should ask CocoonJS for a font named "my_super_font_0". We know this is not "standards compliant", but it was the easiest way for us to add this feature.

    Also, there seems to be some trouble with some Construct exports we're getting, which instead of having a folder named "fonts", have font filenames that start with "fonts\" (which on Unix file systems is a valid part of a filename). This means CocoonJS doesn't see any "fonts" folder, so no ttf files are loaded.

    We are guessing the way Construct generates the zip file doesn't correctly generate folders, but we're not quite sure yet. If you want to check if a zip file is correctly constructed, just unzip it on an OSX machine, and you'll see if the "fonts" folder is created or not.

  • I can't seem to get this to work either, I have tried so many iteration of moving fonts and renaming them, I'm now just at a complete lost of what to do next.

    Currently I have the font imported into the "Files" directory in construct2 and it's name there is "Tw Cen MT Condensed Extra Bold.tff"

    Set my objects font to : "Tw Cen MT Condensed Extra Bold" and set an action OnLoad to : Set font fact to "tw cen mt condensed extr abold"

    Something I've noticed is that in the CocoonJs Log is saying :

    Custom font loaded: game/fonts/twcenmtcondensedextrabold.tff
    Custom font loaded: game/fonts/tw cen mt condensed extr abold.tff
    

    Even though I have only included one font Cocoon is loading two both in lower case and one without spaces. I have tried renaming the files in C2 to be lowercase and without spaces and tried setting the font face to same, all with same null result.

    Is this not working because the fonts are loaded into 'game/' and not just 'fonts/'

    I have tried webfont (but that's not supported) and I have tried using a stylesheet like the tutorial.

    Soooo.... has anyone got a bullet proof way to do this?

  • labithiotis 99.9% is your fault (it was in my case).

    Basically the font name (the name of the actual ttf) must be the same as the name of the font that construct2 picks up.

    If your objects font is: Tw Cen MT Condensed Extra Bold than you have to name it Tw Cen MT Condensed Extra Bold.ttf (case sensitive).

    You don't need to set the font name. Hope it helped.

  • 0+1

    Got it, only took me like forever <img src="smileys/smiley19.gif" border="0" align="middle" />

    Sooo.. I thought you had to place the fonts in the zip in a folder called fonts. Also when I was first doing this I must have got the case wrong.

    Thank you for your help.

    Just to recap for others on how to use a local font in CocoonJS:

    1) You need to import the font into the Files directory in your project (right click on Files and choose Import).

    2) The file-name should be Font + FontStyle and of the same case. Example I had a font called Tw Cen MT with a style called Condensed Extra Bold, so full file-name is Tw Cen MT Condensed Extra Bold.tff

    3) Every time you export to cocoonJS, open the zip and rename font file to be correct case (it always default to lower-case).

  • labithiotis so you mean to say it should be lower case? or its originally in lower case?

  • psyko666

    Yer, you have to make sure and in my case use some trial and error.

    you just need to make sure the fond you add (manually remember) to the exported zip is in the same case as shown when picking it inside construct 2.

    So in my example i used Tw Cen MT with a style called Condensed Extra Bold, so full file-name is "Tw Cen MT Condensed Extra Bold.tff"

  • labithiotis oh i see, thanks me, just clearing something up :)

  • Try Construct 3

    Develop games in your browser. Powerful, performant & highly capable.

    Try Now Construct 3 users don't see these ads
  • labithiotis

    i've followed everyone's steps here but still to no avail, after exporting it from construct 2 with all your suggestions,same filename capitalization etc. although i did not find any fonts folder, is it by default? is it wrong? am i doing it wrong? hoping for a reply thanks! <img src="smileys/smiley1.gif" border="0" align="middle" />

Jump to:
Active Users
There are 1 visitors browsing this topic (0 users and 1 guests)