Using a class in flashx.textLayout package prevents the constructor from accessing Stage

Text Layout Framework example: News layout” in the [Help] yields the run-time error #1009. Because using a class in flashx.textLayout package prevents the constructor from accessing the Stage instance.

Note: The code has already been fixed. But it is good to know how to access the Stage object when classes in flashx.textLayout package are used. (2010/06/20)

As the test script below shows, the Stage object is available after the DisplayObject.addedToStage event, which is dispatched twice.

package {
	import flash.display.Sprite;
	import flash.events.Event;
	import flashx.textLayout.elements.TextFlow;
	public class TextLayoutFormatTest extends Sprite {
		public function TextLayoutFormatTest() {
			var my_fmt:TextFlow;
			trace("constructor", stage, parent);
			addEventListener(Event.ADDED_TO_STAGE, onAdded);
		}
		private function onAdded(eventObject:Event):void {
			trace(stage, parent);
		}
	}
}

// [Output]:
constructor null null
[object Stage] [object Loader]
[object Stage] [object Stage]

As for the prior example in the [Help], TLFNewsLayout class, the statements in the constructor should be moved into a listener method of the DisplayObject.addedToStage event as follows:

package {
	import flash.display.Sprite;
	import flash.display.StageAlign;
	import flash.display.StageScaleMode;
	import flash.events.Event;
	import flash.geom.Rectangle;

	import flashx.textLayout.compose.StandardFlowComposer;
	import flashx.textLayout.container.ContainerController;
	import flashx.textLayout.container.ScrollPolicy;
	import flashx.textLayout.conversion.TextConverter;
	import flashx.textLayout.elements.TextFlow;
	import flashx.textLayout.formats.TextLayoutFormat;

	public class TLFNewsLayout extends Sprite {
		private var hTextFlow:TextFlow;
		private var headContainer:Sprite;
		private var headlineController:ContainerController;
		private var hContainerFormat:TextLayoutFormat;

		private var bTextFlow:TextFlow;
		private var bodyTextContainer:Sprite;
		private var bodyController:ContainerController;
		private var bodyTextContainerFormat:TextLayoutFormat;

		private const headlineMarkup:String = "TLF News Layout ExampleThis example formats text like a newspaper page with a headline, a subtitle, and multiple columns";

		private const bodyMarkup:String = "There are many such lime-kilns in that tract of country, for the purpose of burning the white marble which composes a large part of the substance of the hills. Some of them, built years ago, and long deserted, with weeds growing in the vacant round of the interior, which is open to the sky, and grass and wild-flowers rooting themselves into the chinks of the stones, look already like relics of antiquity, and may yet be overspread with the lichens of centuries to come. Others, where the lime-burner still feeds his daily and nightlong fire, afford points of interest to the wanderer among the hills, who seats himself on a log of wood or a fragment of marble, to hold a chat with the solitary man. It is a lonesome, and, when the character is inclined to thought, may be an intensely thoughtful occupation; as it proved in the case of Ethan Brand, who had mused to such strange purpose, in days gone by, while the fire in this very kiln was burning.The man who now watched the fire was of a different order, and troubled himself with no thoughts save the very few that were requisite to his business. At frequent intervals, he flung back the clashing weight of the iron door, and, turning his face from the insufferable glare, thrust in huge logs of oak, or stirred the immense brands with a long pole. Within the furnace were seen the curling and riotous flames, and the burning marble, almost molten with the intensity of heat; while without, the reflection of the fire quivered on the dark intricacy of the surrounding forest, and showed in the foreground a bright and ruddy little picture of the hut, the spring beside its door, the athletic and coal-begrimed figure of the lime-burner, and the half-frightened child, shrinking into the protection of his father's shadow. And when again the iron door was closed, then reappeared the tender light of the half-full moon, which vainly strove to trace out the indistinct shapes of the neighboring mountains; and, in the upper sky, there was a flitting congregation of clouds, still faintly tinged with the rosy sunset, though thus far down into the valley the sunshine had vanished long and long ago.";

		public function TLFNewsLayout() {
			addEventListener(Event.ADDED_TO_STAGE, initialize);
		}
		function initialize(eventObject:Event):void {
			removeEventListener(Event.ADDED_TO_STAGE, initialize);
			stage.scaleMode = StageScaleMode.NO_SCALE;
			stage.align = StageAlign.TOP_LEFT;

			// Headline text flow and flow composer
			hTextFlow = TextConverter.importToFlow(headlineMarkup,TextConverter.TEXT_LAYOUT_FORMAT);
			hTextFlow.flowComposer = new StandardFlowComposer();

			// initialize the headline container and controller objects
			headContainer = new Sprite();
			headlineController = new ContainerController(headContainer);
			headlineController.verticalScrollPolicy = ScrollPolicy.OFF;
			hContainerFormat = new TextLayoutFormat();
			hContainerFormat.paddingTop = 4;
			hContainerFormat.paddingRight = 4;
			hContainerFormat.paddingBottom = 4;
			hContainerFormat.paddingLeft = 4;

			headlineController.format = hContainerFormat;
			hTextFlow.flowComposer.addController(headlineController);
			addChild(headContainer);
			stage.addEventListener(flash.events.Event.RESIZE, resizeHandler);

			// Body text TextFlow and flow composer
			bTextFlow = TextConverter.importToFlow(bodyMarkup,TextConverter.TEXT_LAYOUT_FORMAT);
			bTextFlow.flowComposer = new StandardFlowComposer();

			// The body text container is below, and has three columns
			bodyTextContainer = new Sprite();
			bodyController = new ContainerController(bodyTextContainer);
			bodyTextContainerFormat = new TextLayoutFormat();
			bodyTextContainerFormat.columnCount = 3;
			bodyTextContainerFormat.columnGap = 30;

			bodyController.format = bodyTextContainerFormat;
			bTextFlow.flowComposer.addController(bodyController);
			addChild(bodyTextContainer);
			resizeHandler(null);
		}

		private function resizeHandler(event:Event):void {
			const verticalGap:Number = 25;
			const stagePadding:Number = 16;
			var stageWidth:Number = stage.stageWidth - stagePadding;
			var stageHeight:Number = stage.stageHeight - stagePadding;
			var headlineWidth:Number = stageWidth;
			var headlineContainerHeight:Number = stageHeight;

			// Initial compose to get height of headline after resize
			headlineController.setCompositionSize(headlineWidth, headlineContainerHeight);
			hTextFlow.flowComposer.compose();
			var rect:Rectangle = headlineController.getContentBounds();
			headlineContainerHeight = rect.height;

			// Resize and place headline text container
			// Call setCompositionSize() again with updated headline height
			headlineController.setCompositionSize(headlineWidth, headlineContainerHeight );
			headlineController.container.x = stagePadding / 2;
			headlineController.container.y = stagePadding / 2;
			hTextFlow.flowComposer.updateAllControllers();

			// Resize and place body text container ;
			var bodyContainerHeight:Number = (stageHeight - verticalGap - headlineContainerHeight);
			bodyController.format = bodyTextContainerFormat;
			bodyController.setCompositionSize(stageWidth, bodyContainerHeight );
			bodyController.container.x = (stagePadding/2);
			bodyController.container.y = (stagePadding/2) + headlineContainerHeight + verticalGap;
			bTextFlow.flowComposer.updateAllControllers();
		}
	}
}

The result of the TLFNewsLayout class

The result of the TLFNewsLayout class

NTT DoCoMo SH-07B Standby Widgets

Today, the NTT DoCoMo has released some new products and services for this summer. One of them, “SH-07B” which is released from SHARP Corporation, has new function called “Standby Widgets” that was implemented by Yoshihiro Shindo (BeInteractive!, it’s me) and Yusuke Nakahara who belongs to the CD-IM. It was directed by Naoki Mima who belongs to the Rightninc, Inc. What I mentioned in my presentation at the FITC Toronto 2010 is about this.

“Standby Widgets” is a function that enables you to customize your standby screen. You can add, remove, or lay out built-in widgets as you like. There are some built-in widgets like bookmarks, calendar, and manner mode switch. Also you can change widget’s color to your favorite color. For phone and mail, it has a list that you can access recent calls or mails easily.

In all honesty, it’s not an amazing new function. However, a point is why the team has invited me. Can you make sense? Yes, it’s written by Flash (FlashLite). A special customized FlashLite engine has been provided by the device team, and all of “Standby Widgets” is running on it. This is our first answer of a question “Can we make better UI if we could use Flash?”.

Many Japanese mobile phone is high-spec actually, but its UI ruins the value of it, I think. In my view, this project is to improve it. Also I feel this project provides fun future to not only users of device but also Flash developers in the world.

TETRIS on the beat !

Tetrision

SiON TETRISizer – wonderfl build flash online

This is new demonstration of my AS3 software synthesize ‘SiON’. This work may remind someone of ‘LUMINES’ (of cause this is one of my favorite games). The SiON can bring its feeling to your flash.
In this flash, I also use various libraries, betweenas3, froce55ing, minimalcomps and papervision3d.
I would like to say thank you for all authors of these useful libraries.

Enjoy !

AS3 software synthesizer SiON Development Center in spark project

Decrement versus Increment in Loop 2

Adobe’s “Optimizing Performance for the Flash Platform” recommends that “Use reverse order for while loops” in its “Miscellaneous optimizations” section. And in my last post, decrement was not explicitly faster than increment with the following code to compare them:

while (--i > -1)

while (++i < MAX_NUMBER)  // MAX_NUMBER is a constant

Difference was very little in my Mac OS environment. But in Internet Explorer 7 and Firefox 3/Flash Player 10/Windows Vista, decrement was faster up to twenty percent than increment. After several trials, speed of operation between decrement and increment seems to be almost the same. The condition of loop does not care if expression is decrement or increment.

The difference came from value to be compared with a counter variable. The new sample script for increment below does not use a constant in the condition. Then its speed seems to be almost identical to the decrement's.

while (++i < <the literal number>)