The environment is finally set up. I am going to assume you have created a MovieClip with the instance name "belly", another with the name "breast1" and a third with the name "breast2". Each of them with 50 frames.
At the very beginning of your code, you should have the line import expansion.Expansion;, to load the Expansion class, or just import expansion.*; to load the entire library.
Next, you'll want to create a new Expansion object. This object will be used to expand several parts of the character. Expansion takes a Stage object as a parameter. This is for internal purposes which you won't need to know about. You will always put "stage" in that parameter. You'll end up with this:
import expansion.*;
var myExpansion:Expansion = new Expansion(stage);After initializing the object, you can start to add expandable parts. Everything you want to expand can be added to the object using insertExpandable().
insertExpandable has 2 parameters: the first parameter is a reference to the MovieClip you want to expand. The second is the maximum size it can take. You can ignore the second parameter and it will just choose the total number of frames in your MovieClip.
However, you may want to make a secret, larger expansion by setting maxSize to a lower value than the entire length of the MovieClip.
Here's an example of how you could write the code
//Here we explicitly say breast1 has 50 frames
myExpansion.insertExpandable(breast1,50);
//Here we let the program count how many frames breast2 has.
myExpansion.insertExpandable(breast2);
//Here we tell the program that the belly only has 25 frames
//Let's save the next 25 frames for later
myExpansion.insertExpandable(belly,25);
When you insert a part into the Expansion class, the expansion class will give it an ID number. The ID is returned when you call the insertExpandable() function. You can store the ID in a variable for later use.
If you don't want to keep track of the ID of every single expandable part, you can just call getExpandableID() every time you want to use its value. If you give it the MovieClip you want, it will return the MovieClip's ID. For example:
var bellyID:int = myExpansion.getExpandableID(belly);Finally, if you want to stop a part from being expandable at any time, you can remove it from the Expansion object by calling removeExpandable() or removeExpandableAt(). For example:
//Remove breast1 by using it as a parameter here
myExpansion.removeExpandable(breast1);
//Remove breast2 by using its ID as a parameter
var breast2ID:int = myExpansion.getExpandableID(breast2);
myExpansion.removeExpandable(breast2ID);
Each expandable part has a "growth" number assigned to it. This number indicates how quickly a character expands. A value of 1 will expand at a rate of one belly frame per world frame. A value of 0.25 would expand slower, making you wait 4 world frames before the belly frame changes. A value of 2 would give you double the speed
You can also use negative values, like -1, -0.25 and -2. These values will make the expandable part get smaller instead of expanding.
To set the growth rate of each part, you can use the setGrowth() function. It has 2 parameters. The first parameter is the ID of the MovieClip you want to expand, the second parameter is the growth value you want to give it.
//Using the bellyID from earlier.
myExpansion.setGrowth(bellyID,1.0);
//Calling getExpandableID() to get the ID of breast1.
myExpansion.setGrowth(myExpansion.getExpandableID(breast1),0.5);
//The breasts expand half as quickly as the belly.
myExpansion.setGrowth(breast2ID,0.5);
You can also set the growth rate of all the expandable items at once by using the "growth" attribute of the Expansion object, like this:
myExpansion.growth = 1.0;If you want to read the growth attribute of any of the parts, you can call the getGrowth() function. It has just one parameter, which is the ID of the part you want to see the growth of.
var bellyGrowth:Number = myExpansion.getGrowth(bellyID);Now, just call the activate() function to start the expansion! The character will start expanding immediately. You can think of this function as the one that "starts time". If you call activate() with false as a parameter, the animation will stop.
myExpansion.activate();Having the program take full control of the character's size can be undesirable. You are allowed to change the size of every expandable object whenever you want, just by calling the setSize() function.
setSize() works the same as setGrowth(). The first parameter is the ID of the expandable part. The second parameter is the size you want it to be. You can use any number between 1 and the number of frames in the expandable part, including floating point values, like 1.5 and 20.33.
myExpansion.setSize(bellyID,20);
myExpandion.setSize(breast2ID,12.5);
Just like with the growth value, you can also read the current size of the MovieClip, with getSize(). And you can set all of the sizes of the expandable items at once by using the "size" property.
var bellySize:Number = myExpansion.getSize(bellyID);
myExpansion.size = 25;
Do you remember setting the maximum size using insertExpandable()? You can set it again at any time using setMaxSize(). You can also read the value by using getMaxSize(). And you can set the maximum size of all the expandable parts at once by using the "maxSize" property.
var bellyMaxSize:Number = myExpansion.getMaxSize(bellyID);
myExpansion.setMaxSize(myExpansion.getExpandableID(breast1),bellyMaxSize);
myExpansion.maxSize = 30;
If you ever want to know how many expandable parts you have in the Expansion object, you can read the "numExpandables" property. I don't know if you'll need it for anything, though.
var numberOfItems:int = myExpansion.numExpandables;If you happen to know the ID number of a MovieClip you want, but you don't have a reference to it, you can use the getExpandable() function. It returns the MovieClip associated with the ID number
var herBelly:MovieClip = myExpansion.getExpandable(bellyID);
Events are a way for some parts of Flash to broadcast messages to other parts of Flash. They're not easy to explain if you don't already know about them. But if you do, Expansion has two events you can listen for: "sizeChanged" and "checkpoint".
You can listen for the "sizeChanged" event by calling the addEventListener() function of the Expansion object. "sizeChanged" happens every time the size of one of the expandables changes its value. Here's an example of how it could work:
function checkSize(E:Event){
var exp:Expansion = E.currentTarget as Expansion;
var bellyID:int = exp.getExpandableID(belly);
var breast1ID:int = exp.getExpandableID(breast1);
var breast2ID:int = exp.getExpandableID(breast2);
trace("Belly size:",exp.getSize(bellyID));
trace("Breast 1 size:",exp.getSize(breast1ID));
trace("Breast 2 size:",exp.getSize(breast2ID));
}
myExpansion.addEventListener("sizeChanged",checkSize);
The other event is...
Sometimes, you may want to know when the character has reached a certain size. Maybe at that size, you want the character to react in a certain way. Let's say, if the belly reaches half of the maximum size, you want your program to tell you about it.
To mark a checkpoint, you can call the setCheckPoint() function. It has 5 parameters. The first parameter is the ID of the expandable part to check on. The second parameter is the size you want to watch for. The fifth parameter is the "direction" parameter. If it's 1, the checkpoint will trigger when the part is expanding. If it's -1, the checkpoint will trigger when the part is getting smaller.
The third and fourth parameters are "reaction" and "timer", which are related to the Expression class. They deal with how the character reacts to the expansion and for how long.
With this, you can make the program find out when the character has reached the maximum size and make something happen. You can call addEventListener() to watch for the checkpoint. This returns an ExpansionEvent object instead of an ordinary Event object. Here's an example:
var endSize:Number = myExpansion.getMaxSize(bellyID);
myExpansion.setCheckPoint(bellyID,endSize,"",0,1);
myExpansion.setCheckPoint(bellyID,1,"",0,-1);
myExpansion.addEventListener("checkpoint",finalSize);
function finalSize(E:ExpansionEvent){
var exp:Expansion = E.currentTarget as Expansion;
trace("Final size reached.");
trace("Final size reached.");
trace("Reverting to normal size.");
//Make the character revert
exp.growth = -1;
myExpansion.removeEventListener("checkpoint",finalSize);
myExpansion.addEventListener("checkpoint",smallSize);
}
function smallSize(E:ExpansionEvent){
var exp:Expansion = E.currentTarget as Expansion;
trace("Expansion complete.");
//Stop the program
exp.activate(false);
myExpansion.removeEventListener("checkpoint",smallSize);
}
The ExpansionEvent object contains some information about the expanding object: The size targeted by the checkpoint, the MovieClip being expanded, the reaction of the character and the time the character spends in that pose.
Well, now to make a simple expansion animation. Here's how it will work: The character starts expanding. When you click with the mouse, she starts reverting back to normal. When you click again, she'll start expanding again. Finally, when she's halfway expanded, a message will appear.
To do this, I assume what I said in the beginning: you have 3 MovieClips, named "breast1", "breast2" and "belly". Each with 50 frames. Here's the code:
//Load libraries
import expansion.Expansion;
import expansion.ExpansionEvent;
//Create Expansion object
var exp:Expansion = new Expansion(stage);
//Insert expandable objects
var bellyID:int = exp.insertExpandable(belly);
var breast1ID:int = exp.insertExpandable(breast1);
var breast2ID:int = exp.insertExpandable(breast2);
//Set growth to 1
exp.growth = 1;
//Set checkpoints at half of max size:
//One for expanding, one for reverting.
exp.setCheckPoint(bellyID,exp.getMaxSize(bellyID)/2,"",0, 1);
exp.setCheckPoint(bellyID,exp.getMaxSize(bellyID)/2,"",0,-1);
//Event listeners
exp.addEventListener("checkpoint",message);
stage.addEventListener("mouseDown",invertGrowth);
//Functions
function invertGrowth(E:Event){
exp.growth = -exp.getGrowth(bellyID);
}
function message(E:ExpansionEvent){
//You can access the Expansion object by
//reading the currentTarget of the event.
var temp:Expansion = E.currentTarget as Expansion;
if(temp.getGrowth(bellyID) > 0){
trace("GROWING. Halfway there");
} else {
trace("REVERTING. Halfway there");
}
}
I hope that was simple enough. Once you've learned the basics, you can use the Expansion reference page to find out the name of the function you want to use, or what parameters it has.
The Expression class is a little more difficult to use and even requires extra things to set up on the stage before using it. But it will also give you very many ways to control the character's poses, expressions and reactions.
© 2014 Doom the wolf. http://doom-the-wolf.deviantart.com