Lesson 5

By now, you should be familiar with creating shapes and adding instances to your movie. I know you all have something to say to the world, so let's start adding some text!

Ming uses special font files called fdb files which are created through special tools(flash generator templates and Dave's makefdb utility). Here are some fonts to get you started, you will need to place one of them in the directory your ming file that uses it is.

http://www.webwizardsways.com/flash/ming-fonts

(WebTv users, after you get the popup saying you can't use it, click show last to get the URL)

Once you have a fdb font file, you are ready to start.

A) Begin as always by opening our html page and begining our php code block

<html> 
<body> 
<?php

B) Now add our shapes from previous lessons

$myShape1=new SWFShape(); 
$myShape1->setLine(5,0,0,255); 
$myShape1->drawLine(440,0); 
$myShape2=new SWFShape(); 
$myShape2->setLine(1,0,0,0); 
$myShape2->setRightFill(0,255,0); 
$myShape2->drawLine(50,0); 
$myShape2->drawLine(0,50); 
$myShape2->drawLine(-50,0); 
$myShape2->drawLine(0,-50); 
$myShape3=new SWFShape(); 
$myShape3->setLine(1,0,0,0); 
$myShape3->setRightFill(255,0,255); 
$ra = 40; 
$x = 40; 
$y = 40; 
$a = $ra * 0.414213562; // = tan(22.5 deg) 
$b = $ra * 0.707106781; // = sqrt(2)/2 = sin(45 deg) 
$myShape3->movePenTo($x+$ra, $y); 
$myShape3->drawCurveTo($x+$ra, $y-$a, $x+$b, $y-$b); 
$myShape3->drawCurveTo($x+$a, $y-$ra, $x, $y-$ra); 
$myShape3->drawCurveTo($x-$a, $y-$ra, $x-$b, $y-$b); 
$myShape3->drawCurveTo($x-$ra, $y-$a, $x-$ra, $y); 
$myShape3->drawCurveTo($x-$ra, $y+$a, $x-$b, $y+$b); 
$myShape3->drawCurveTo($x-$a, $y+$ra, $x, $y+$ra); 
$myShape3->drawCurveTo($x+$a, $y+$ra, $x+$b, $y+$b); 
$myShape3->drawCurveTo($x+$ra, $y+$a, $x+$ra, $y);

C) Next, we set the fdb font we want to use, and place it's filename in the quotes

$myFont=new SWFFont("ParkAvenue_BT.fdb");

D) Now that we have a font, we can define our text and set it to use our choosen font

$myText=new SWFText(); 
$myText->setFont($myFont);

E) Next, set the color for the text, and it's height 
$myText->setColor(255,255,0); 
$myText->setHeight(40); 
F) Now we add the text itself 
$myText->addString(" My First Flash!");

G) Next, we define our movie and add our previous shapes as always

$myMovie=new SWFMovie(); 
$myMovie->setDimension(460,80); 
$myMovie->setBackground(255,0,0); 
$firstLine=$myMovie->add($myShape1); 
$firstLine->moveTo(10,10); 
$secondLine=$myMovie->add($myShape1); 
$secondLine->moveTo(10,70); 
$firstSquare=$myMovie->add($myShape2); 
$firstSquare->moveTo(15,15); 
$secondSquare=$myMovie->add($myShape2); 
$secondSquare->moveTo(395,15); 
$firstCircle=$myMovie->add($myShape3); 
$firstCircle->moveTo(190,0);

H) Then, we add an our instance of the text to our movie as we did with shapes previously

$firstText=$myMovie->add($myText);

I) Move the text just as you do shapes, luckily, the text object has some attributes we can use to position it.

Here we are setting the left to right position by taking half the width of our movie and subtracting half the width of our text (see the getWidth statement). Then, after experimentation, we found that the words needed to be moved over a bit more to fit in our circle shape, so we added 10 more. 
The top to bottom is dependant upon the height you set in the text definitions above, and the font used, and is measured to the bottom of your text. Some fonts have extra long lower loops (like g and y) while others have extra long upper loops.

Experimentation, or adding buffer space, is the only answer. I found 50 to work for the font used in this lesson.

$firstText->moveTo((460/2-($myText->getWidth(" My First Flash!"))/2)+10,50);

J) Finally, we save our movie, close our php code block, and add the standard html to display the generated swf file.

$myMovie->save("lesson5.swf"); 
?> 
<OBJECT classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://active.macromedia.com/flash2/cabs/swflash.cab#version=4,0,0,0" ID=objects WIDTH=460 HEIGHT=80> 
<PARAM NAME=movie VALUE="lesson5.swf"> 
<EMBED src="lesson5.swf" WIDTH=460 HEIGHT=80 TYPE="application/x-shockwave-flash" PLUGINSPAGE="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash"> 
</OBJECT> 
</BODY> 
</html>

Next lesson, we will learn to use gradient fills in our shapes.

Code summary for lesson 5:

<html> 
<body> 
<?php 
$myShape1=new SWFShape(); 
$myShape1->setLine(5,0,0,255); 
$myShape1->drawLine(440,0); 
$myShape2=new SWFShape(); 
$myShape2->setLine(1,0,0,0); 
$myShape2->setRightFill(0,255,0); 
$myShape2->drawLine(50,0); 
$myShape2->drawLine(0,50); 
$myShape2->drawLine(-50,0); 
$myShape2->drawLine(0,-50); 
$myShape3=new SWFShape(); 
$myShape3->setLine(1,0,0,0); 
$myShape3->setRightFill(255,0,255); 
$ra = 40; 
$x = 40; 
$y = 40; 
$a = $ra * 0.414213562; // = tan(22.5 deg) 
$b = $ra * 0.707106781; // = sqrt(2)/2 = sin(45 deg) 
$myShape3->movePenTo($x+$ra, $y); 
$myShape3->drawCurveTo($x+$ra, $y-$a, $x+$b, $y-$b); 
$myShape3->drawCurveTo($x+$a, $y-$ra, $x, $y-$ra); 
$myShape3->drawCurveTo($x-$a, $y-$ra, $x-$b, $y-$b); 
$myShape3->drawCurveTo($x-$ra, $y-$a, $x-$ra, $y); 
$myShape3->drawCurveTo($x-$ra, $y+$a, $x-$b, $y+$b); 
$myShape3->drawCurveTo($x-$a, $y+$ra, $x, $y+$ra); 
$myShape3->drawCurveTo($x+$a, $y+$ra, $x+$b, $y+$b); 
$myShape3->drawCurveTo($x+$ra, $y+$a, $x+$ra, $y); 
$myFont=new SWFFont("ParkAvenue_BT.fdb"); 
$myText=new SWFText(); 
$myText->setFont($myFont); 
$myText->setColor(255,255,0); 
$myText->setHeight(40); 
$myText->addString(" My First Flash!"); 
$myMovie=new SWFMovie(); 
$myMovie->setDimension(460,80); 
$myMovie->setBackground(255,0,0); 
$firstLine=$myMovie->add($myShape1); 
$firstLine->moveTo(10,10); 
$secondLine=$myMovie->add($myShape1); 
$secondLine->moveTo(10,70); 
$firstSquare=$myMovie->add($myShape2); 
$firstSquare->moveTo(15,15); 
$secondSquare=$myMovie->add($myShape2); 
$secondSquare->moveTo(395,15); 
$firstCircle=$myMovie->add($myShape3); 
$firstCircle->moveTo(190,0); 
$firstText=$myMovie->add($myText); 
$firstText->moveTo((460/2-($myText->getWidth(" My First Flash!"))/2)+10,50); 
$myMovie->save("lesson5.swf"); 
?> 
<OBJECT classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://active.macromedia.com/flash2/cabs/swflash.cab#version=4,0,0,0" ID=objects WIDTH=460 HEIGHT=80> 
<PARAM NAME=movie VALUE="lesson5.swf"> 
<EMBED src="lesson5.swf" WIDTH=460 HEIGHT=80 TYPE="application/x-shockwave-flash" PLUGINSPAGE="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash"> 
</OBJECT> 
</BODY> 
</html>

Notes about lesson 5

If you put it in a different directory, perhaps one set aside just for fonts, use relative urls.

2) Font in a directory named fonts in the same directory as the ming script, use "fonts/font_name.fdb"

3) Font in the directory above the directory containing the ming script, use "../font_name.fdb"

4) Font in a directory named fonts located in the same parent directory as the directory containing the ming script, use "../fonts/font_name.fdb" Just your basic relative url.