How to use with ActionScript

In this tutorial we are going to use Creative TextFX together with ActionScript. You will see that you have full control over our components from ActionScript (you can instantiate, configure etc.). Firstly I want to remind you of the necessity of having the Creative TextFX Extension installed in order for this tutorial to work; if you encounter any problems while installing it, you can read the “How to install an extension” tutorial.

Click here to download the source file and the required files for solving this tutorial.

1. Open Flash and create a new file.

2. Open the Components panel and drag a Creative TextFX instance on the stage. Name the instance “my_text”. Open the Component Inspector panel; let's configure the effect a bit. Set it up like in the following image:

3. Now we have to insert to the stage a text area where we'll be able to type. Select the Text tool, and from the list choose Input text; make the changes shown here:

4. Draw the input text area on the screen and size it something like this (by dragging one of its corners, for instance):

5. The last modification we want to do to our text is to give the instance a name, so we can later refer to it in our ActionScript code. Name it “input_text”.

6. Now we'll create a button which will give us the possibility to start our animation. Don't worry, we'll create one of the simplest buttons Flash has ever seen. Draw a simple text field on the stage and write “Create Effect” inside. Use the same settings from the input text, just that you modify in the list before drawing the text field, Simple text instead of the Input text. Press F8 and convert it to a button called, let's say, “button” (that's original!).

The next step for our button is to name its instance as “Create_Effect”.

7. Select the button, open the Actions panel and paste the following code:

on (release) {
	_root.oldCTFX._visible = false;
	var mc_name = "my_text_"+random(1000);
	duplicateMovieClip(_root.my_text, mc_name, _root.getNextHighestDepth());
	_root[mc_name]._x = 50;
	_root[mc_name]._y = 100;
	_root[mc_name].text = _root.input_text.text;
	_root[mc_name].initEffect();
	_root[mc_name].startEffect();
	_root[mc_name].effectFinished = function() {
		trace("effect finished");
	};
	_root[mc_name].effectStarted = function() {
		trace("effect started");
	};
	_root.oldCTFX = _root[mc_name];
}

8.The last step would be to embed the font our component is going to use in our clip. If you have any problems doing this, the tutorial “How to embed fonts” is going to help you.

8.Preview your movie (CTRL+Enter).

Thank you for your time and I hope this tutorial was useful to you. I invite you to read the rest of our tutorials and check out our other products on www.extendstudio.com. If you have any questions please contact us at support@extendstudio.com.