Discover the power of TextAnim Maker and create awesome text transitions. Read on to find out more in this Quick Tip!
Step 1: What is TextAnim Maker?
TextAnim Maker is a Flash based Text Animation tool that creates stunning text animations right in your browser and displays the code you need to use to perform the animation in your project.
It works using its own class called TextAnim, developed by the people of flupie.net.
Step 2: How it Works
TextAnim Maker presents a clean interface showing the different options, controls and panels to customize your text effect.
It also shows a preview of the animation created and the resulting code of the transition.
Step 3: Options
The editor features a series of options (which are properties and methods in the class) which can be edited to modify the final effect, let's take a closer look at those options:
- Mode: The animation will start from the option selected here.
- Split: Splits the text into chars, words or lines.
- AnchorX, AnchorY: Uses the option as the registration point to animate.
- Text: The text to animate, it can contain HTML.
- Interval: Interval between the chars, words or lines animation.
- Delay: Time to wait before start.
- Blocks Visible: A block is the part of TextAnim that contains a text slice, hides them or shows them.
Step 4: Class and Documentation
You can download the TextAnim class from GoogleCode and read the documentation online at the developers' website.
Step 5: Example Animation
This is an example animation created in the editor, here is the code I used:
import flupie.textanim.*; var txtanim:TextAnim = new TextAnim(myTextField); txtanim.mode = TextAnimMode.EDGES_CENTER; txtanim.anchorX = TextAnimAnchor.RIGHT; txtanim.anchorY = TextAnimAnchor.BOTTOM; txtanim.interval = 15; txtanim.blocksVisible = false; txtanim.effects = myEffect; txtanim.start(); import caurina.transitions.*; function myEffect(block:TextAnimBlock):void { block.scaleX = block.scaleY = 0; block.rotation = -120; Tweener.addTween(block, {rotation:0, scaleX:1, scaleY:1, time:.5, transition:"easeoutback"}); }
Conclusion
TextAnim Maker is a great way to create your animations dynamically and quickly. Try it!
Thanks for reading!
Subscribe below and we’ll send you a weekly email summary of all new Code tutorials. Never miss out on learning about the next big thing.
Update me weeklyEnvato Tuts+ tutorials are translated into other languages by our community members—you can be involved too!
Translate this post