In my last post I briefly mentioned that I would discuss how to tweak the classes that are shipped with the latest version of the Metaliq component set to be compliant with mtasc. The steps that I will take assume that you have purchased a license of the Metaliq component set and have the latest version with the source code. It also assumes you already have mtasc and swfmill setup. If you don’t know what these tools are, or how to set them up, you can go to their respective homepage or find numerous tutorials to help you get up to speed. I actually use FlashDevelop which comes pre setup with both of these tools. The following steps will create a project in FlashDevelop and allow you to start compiling the Metaliq components with mtasc. You should be able to easily translate this to Eclipse or other script editor of choice.
- Create a new Library Project and name it “Metaliq”. Make sure to check “Create directory for project”.
- In the Project Explorer, open up the properties panel for the project. Under “Test Movie”, change the pulldown option to “New Window”.
- Go to the Build tab and delete the Post-Build Command Line text and hit Apply.
- Go to the Compiler Options tab and click on IncludePackages. A button with a “…” will appear, click on that. Delete the text in that window and hit OK.
- Set UseMain to true.
- Set TraceMode to FlashOut. Hit OK and close out of the properties panel.
- Find where your Metaliq source code is and copy the “com” folder over to the “classes” directory of your new project. Make sure to copy it and not move it since we will be editing the source.
- From the Metaliq source, go to the “flas” directory and copy Button.fla to the “library” directory of your new project.
- Open Button.fla in Flash (there should be nothing on the stage). Go to the publish settings and add the following class path: “../classes/” (without the quotes). Save, compile and close.
-
In the “classes” directory of your project, create a new class named “ButtonTest.as” and add the following code:
import com.metaliq.controls.Button;
import com.metaliq.skins.FocusRect;
import com.metaliq.skins.gskin1.ButtonBackground;
class ButtonTest {
// content holder
var content:MovieClip;
function ButtonTest() {
// create dummy variables to pull in required classes for mtasc
var fr:FocusRect;
delete fr;
var bb:ButtonBackground;
delete bb;
content = ButtonTest.parent.createEmptyMovieClip("content", 0);
var sample_btn:Button = content.createClassObject(Button, "sample_btn", content.getNextHighestDepth(), {
icon:"icon1",
label:"Hello world!",
labelPlacement:"right",
selected:false,
toggle:true,
enabled:true,
visible:true,
minWidth:15,
minHeight:15,
_x:10,
_y:10,
_width:150
});
configButton();
}
private function configButton():Void {
content.sample_btn.addEventListener("click", onButtonClick);
}
private function onButtonClick(evtObj:Object):Void {
if (evtObj.target._name == "sample_btn") {
trace("you clicked the button");
}
}
// APPLICATION INITIALIZATION
static var application:ButtonTest;
static var parent:MovieClip
/**
* Application entry point
*/
static function main(scope:MovieClip) {
parent = scope;
// create the content
application = new ButtonTest();
}
}
If you look at the class above, you will notice a main method that gets called by mtasc. This main method creates an instance of the ButtonTest class which in turn begins the setup for instantiating a Metaliq component through code. We are using the createClassObject method to instantiate the Button component. The parameters passed are className, instanceName, depth, and an initObject which sets the defaults for the component. Besides the Button class, two other classes are imported in for mtasc. Once you get through with the following steps, remove those imports and the instantiations of those classes to see the error that mtasc throws. It will clearly ask you to force compilation of those classes. The easiest way to do that is by adding in the import statement for each class and then creating a reference to the class by instantiating it. I immediately delete the instance so it doesn’t take up memory.
- In FlashDevelop’s Project Explorer, right-click on ButtonTest.as and select “Always Compile”. And right-click on Button.swf and select “Add to Library”.
These previous steps are the basis for setting up a project in FlashDevelop to compile with mtasc and swfmill. The next steps will be getting the Metaliq classes to compile with mtasc.
- Hit F5 (Test Movie). You should see an error pop up. Double click on the error to bring up the class that is causing the error.
- The error is “unknown variable” in FocusRect.as. If you look in the constructor, there is an onEnterFrame function. Within this function, a call to the draw method is made. The simplest way to fix this is to add “this.” in front of “draw()” to scope the method properly.
- Hit F5 again and then do the same for the next error.
- The next error is “return type cannot be Void”. If you double click on this error, it will open up UIObject to around line 90 within the glicInit method. If you notice, the return type for glicInit is Boolean but the first line returns nothing. mtasc doesn’t like this. To fix it, change if (initted) to if (!initted) , delete the return and put the rest of the method within the brackets.
- Your next error will go back to “unknown variable”. You know how to fix these.
- Another error you will get is “Object should be MovieClip”. This is an easy one to fix. Wrap the object that is causing the error in MovieClip() to typecast it.
- The next error is “Object should be String”. Just add String() around the offending objects.
- The next error is “unknown variable m”. If you look above the error, you will see that m gets declared within an if statement. To fix the error, declare the m above the if statement and set m in the if statement.
-
The next time you hit F5, mtasc should finally compile nicely. The button probably will just be text at this point (text acting as a button with no background). To see the background behind the button, you have to do something very random. I have gone through and converted all of the classes to be mtasc-friendly and this was the only part that still doesn’t make complete sense to me, but it works. In BaseButton.as, add the following code to around line 88:
public function set background(p_bg:String):Void { super.background = p_bg; };
For some reason, even though BaseButton extends UIObject, without the above statement the call to set background does not automatically go up the chain to UIObject without explicitly forcing it to. If you compile now, you should see the background behind the button. You now have a fully working example of a Metaliq component being compiled with mtasc.
- Continue along with these steps and slowly and surely you will start to make headway through the rest of the classes. Be forewarned there are a lot of errors to fix to make the entire component set mtasc compliant. But once you do, your life will be much simpler and your compiling will be MUCH faster.
Enjoy and feel free to comment with questions below.
The link (which hasn’t added any real documentation yet) is:
Surprisingly enough, I actually get a lot of hits on this site for my FlashPaper component.
What’s funny is that I’ve never once thought about charging for it, but today I realized that another company was charging an outlandish amount of money for much less functionality.
The company is Zanzibar Fiction and here is their pricelist. And yes… that’s up to $500 that they’re charging for deactivating the select and print buttons!! I just don’t get it.
But anyway, one thing that they added that my component didn’t have was color schemes for the FlashPaper interface. So to hopefully prevent anyone from spending that crazy amount of money, I decided to add it to my component… but make it even better. They offer 8 color choices (and they are all very ugly) and my component now lets you select any tint color and percentage that you like for the interface.
Oh and by the way it’s still free!
Description:
The FlashPaper component simplifies the process of working with the FlashPaper API and adds functionality either not documented or not provided in the API.
Installation:
- Unzip FlashPaper_0.8.zip
- DoubleClick on FlashPaper.mxp to install with the Extension Manager.
Documentation:
FlashPaper Component Documentation
Download FlashPaper