Flash CS5 for Designers: TLF and ActionScript + Win 1 of 3 Signed Copies! Flash CS5 for Designers: TLF and ActionScript + Win 1 of 3 Signed Copies!
A lot has changed between how text was handled in Flash CS4 and Flash CS5. We think now is a good time to pull up a stool, sit down, and review, in very broad terms, what one needs to know about TLF before “wiring up” an exercise or project using ActionScript. Introduction With the new TextLayoutFramework (TLF), text is found in these things called containers. They either can be physically drawn on the stage using the Text tool and given an instance name or, as is more common, can be created at runtime. Most projects will start with you telling Flash to create a Configuration() object, which is used to tell Flash there is a container on the stage and how to manage the Text Layout Framework for the stuff in the container. Naturally, being stupid, the Configuration() object needs to be told exactly how to manage the text in the container. Step 1: New Document Step 2: ActionScript. Flash CS5: Cool 3D Text Effect, Embedding Fonts via TextFlow.fontLookup.
Text is loaded dynamically at runtime.
Thanks to the new TLF methods, the body of the text is split into separate lines. The lines are tweened in 3D and colorized creating a cool, wavy 3D effect. Moreover, fonts are embedded into TextFlow with the TextFlow.fontLookup property without TLFTextField class. Click the screen shot below or this link to open the applet in a new window: Download Download all source files corresponding to this effect: text3dfont.zip In the zip package, you will find a fla file with well-commented Timeline code and a custom AS3 class, TextSlicer. The TextSlicer AS3 Class and Related Tutorials Our custom AS3 TextSlicer class is important to this effect. You can find the list of properties and methods of the TextSlicer class in our earlier tutorialFlash CS5: Double 3D Text Effect with TLF Text. You will find the general overview of the TLF classes in the video:New AS3 Text Layout Classes in Flash CS5 - Tour and Example.
Handling image loading in TLF TextFlow and TextField. Recently, I was building a cms driven (Drupal 6 to be precise) website and faced the problem of detecting whether the content of TextField or TFL TextFlow has completed loading.
This example is based on TLF Editor from Tour de Flex, which I used as a base for the created editor/display component. 1. TLF TextFlow solution The solution I used is actually very simple. First, you need to analyze the TextFlow markup to get the number of images in text. Then, create a TextFlow instance and setup the necessary listeners. We handle all StatusChangeEvent.INLINE_GRAPHIC_STATUS_CHANGE events in recomposeOnLoadComplete function. Tag doesn’t have declared ‘width’ and ‘height’ explicitly to a number. The content displayed on the website has a lot of images, so need to know the height of the TextFlow object to be able to scroll it. 2. The whole idea is the same, but we need to setup a Loader instance for each image to handle errors and load events. Overview of Adobe's Text Layout Framework for the Flash Player. Rosenstrom blog - Part 4. On my quest to generate 3D text from non-embedded fonts, after extracting positive and negative shapes from characters, the next step is to analyze and extract the points which define the pixel boundary surrounding the extracted shapes.
There is a "brute" way to do this, simply by looping through every pixel in a BitmapData, and checking weather any surrounding pixels are transparent. This works, but the discovered pixels are not in a meaningful order. The goal is to create an algorithm which circumnavigates the extremities of shapes, storing the traversed points in sequence, eventually doing this: My original approach was to grab the first transparent pixel, then loop around its 8 surrounding pixels, run through some rules, then determine the next pixel to move to, until the "3x3 grid" would arrive at its starting point.
The "3x3" grid would move along the shape clockwise. My implementation was sluggish, and had a few bugs...