Custom Fonts - AS2-ish, I guess

Hi everyone. I’m trying to put an exciting font in my game, and when I say exciting I mean battletoads-hovercar-level exciting. Yeah, I know!

Anyway, I’ve been designing my font diligently in paint, and it’s starting to look really nice – but here’s the problem. I have no idea how to compile my drawings (of many colours) into one font, and then import that font into flash so that I can embed it in my .swf.

I have a font making program, but it only supports monochrome fonts for some reason – I want an exciting font which has many colours, like every flash game ever, pretty much.

How do I do this? Do I make the numbers into graphics directly in flash, and then make them show instead of using dynamic text? Help!

Well there is way but it will take awhile. Go here http://www.fontifier.com/ and print the template. Scan the template, import your font letters, print the template, and scan it again. I’m sure you know how to install the font on your computer, but even if you don’t:

C >> Windows >> Fonts >> Paste your file

Hope this helped. :/

That seems like the worst possible way you could ever think of doing something like this. I don’t use as2, but I think it goes a bit like:

class TextBox extends MovieClip{

    function TextBox(string:String){

          for(var i:Number = 0; i < string.length; ++i)
              addChar(string.charAt(i), i*50);

     }

     function addChar(string:String, x){

          attachMovie(string, string + getNextHighestDepth(), getNextHighestDepth()).x = x;

     }

}

I don’t know how much of that is valid AS2, I didn’t want to check it because I started to feel a little dirty writing it, but you should get the idea.

Originally posted by rarapompoms:

That seems like the worst possible way you could ever think of doing something like this. I don’t use as2, but I think it goes a bit like:

class TextBox extends MovieClip{

    function TextBox(string:String){

          for(var i:Number = 0; i < string.length; ++i)
              addChar(string.charAt(i), i*50);

     }

     function addChar(string:String, x){

          attachMovie(string, string + getNextHighestDepth(), getNextHighestDepth()).x = x;

     }

}

I don’t know how much of that is valid AS2, I didn’t want to check it because I started to feel a little dirty writing it, but you should get the idea.

I suggest you read the post again and use Google Translate. He wants to embed a self-made font in Flash. [Wrong link, my fault. I wanted to post a Google Translate’s link but I don’t want to start an arguement, let alone continuing it, so I’ll leave this space blank.]

You seriously think that printing off a template, scanning it back in again, pasting the characters on, printing it off again and then scanning it in once more, then paying for it to be converted into a font is a more sensible solution?

I never said that my solution is the best did I? Howeverm if he installs the font on his computer he will be able to use again whenever he wants.

Fontifier is the worst possible option you could have suggested and I am truely astounded you’re still recommending it.

Excuse me for the link, it’s my fault. The link was ment to be Google Tranlaste’s link but I accidentaly pasted the Fontifier one. I admit it, that was my fault. I’ll edit the post.

Anyway, I would be pleased if you explained how the code works and how it will solve the problem. I still don’t see how your code will compile all his drawings into a new font. I guess you can explain.

He has drawn his font in paint. From his use of the plural “drawings” I assume he has saved each character as a different file (the class will need a little modification if this isn’t true). He needs to import all of these files into Flash and name them “a”, “b”, “c” etc for the character that they represent. When he makes a new Textbox (var t:TextBox = new TextBox(“text”);) the class will take each character of the supplied string, find the corresponding image and attach it to the screen. It doesn’t need to be compiled into a font at all. If you read his post he actually suggest this himself at the end

How do I do this? Do I make the numbers into graphics directly in flash, and then make them show instead of using dynamic text? Help!

Ok… sorry to cause problems, for a start! Thanks for both of your help.

What I’ve ended up doing is finding out what the numbers in the score are, and then trying to attach them. I’m not going to lie – rarapompom’s script utterly baffled me, so I went for something closer to my knowledge level. Unless you feel like explaining your script, that is – I’ve tried to work it out but it keeps slipping over my head!

say the score on my game is 54 – I firstly divide by 10, then do Math.floor. This gives me the first digit.
I then multiply the first digit by 10 (to get 50) and subtract it from the original score (leaving 4) – this gives me the second digit.

So I have 5 as my value for digit1, and 4 as my value for digit2. How do I then attach these pictures? I want to be able to do something along the lines of root.attachmovieclip(“(digit1).png”). Can anyone help me out with the syntax of how to do this?

Many thanks!

You might try something like this, though I’m not sure if it will work:

_root.attachMovie(digit1.toString() + ".png”)

Thanks, Frogman… alas, my problems continue.

I tried what you said, and met with no success. I then used this script based on the help of everyone here (botched together myself and wrong):

                var digit10:String;
		digit10 = String(digit10s+".png");
		trace(digit10);
		
		var tens = _root.HUD.attachMovie(digit10, digit10 + _root.HUD.getNextHighestDepth(), _root.HUD.getNextHighestDepth());

The trace returns “0.png” which is the name of the correct number for that digit of the score. Any ideas how to attach that picture?

Anyone? Help! D:

Think it’s attachBitmap (to an empty MovieClip). I’m not sure the exact syntax, but check out flash help.

Hi
I don’t know if there’s some “automatic” way of doing it in Flash… but how about this.

- Have all your characters sepparated on different movieclips (with its linkage) like “font_a”, “font_b”, ….. “font_z”, “font_0”, “font_1”, ….. “font_9”, …
- Assuming all your characters have the same width, use something like this:

MovieClip.prototype.customFont = function(str){
	for(n=0;n<str.length;n++){
		ch = this.attachMovie("font_"+str.charAt(n),"char_"+n,this.getNextHighestDepth());
		ch._x = n*ch._width;
	}
}

you can then call the function with:

createEmptyMovieClip("text01",1000);
text01.customFont("some String");

The function is easily editable if you want your string to have some maximum length… In that case calculate the proper Y position of the character.

About numbers…. there is a function Number.toString();

var score:Number = 123;
text01.customFont(score.toString());

what do you think ?

PS: this DOES works,.. i’ve tried it myself before posting it

Thanks Moonkey, but unfortunately the attachBitmap function doesn’t have all the functionality I need for this particular part of my game… And MaToMaStEr, thanks for that code. I unfortunately won’t be using it, as I’ve come up with a different solution, and I’ll write it down here just in case anyone reads through this with the same problem in future.

I created a miniclip called digits and then attached each individual number to a new frame in that movieclip. I now just use the gotoAndStop(digit10) after using the method I outlined above to find the different digit values.