Matan Uberstein´s Auto Flash Class Panel

The Auto Flash Class Panel is an extension for Flash CS5  that will let You get rid of the tedious work of naming Your library items and believe Me when you working with small projects this is something that you can do by yourself without much effort but as projects get bigger and the amount of things you have to give a class name for working with them in ActionScript the task can really become tedious and cumbersome. Enter Matan Uberstein’s Auto Flash Class Panel.

The panel will let You select and give class names to your library items with a few clicks (literally), for installation You must have the Adobe Extencion Manager if you don’t have it already installed You can download it from here.  To start using the Auto Flash Class Panel you can get the version 2 here.

Once You have it installed fire up Flash and open the panel in Window>Other Panels>AutoFlashClassPanel the the panel is packed with a rich interface split into two sections (see Fig. 1), Selector and Classer. The Selector section automatically selects all the library items that match your criteria. Choose from MovieClips, Bitmaps, Sounds, Fonts or Buttons. Once you are happy with your selection of library items, you simply use the Classer section to automatically insert class, base class and tick the ‘export’ checkbox.

Fig. 1

One of the cool features is that the Class and package names are generated form your library folder structure so to get  your classes in the proper packages all you need to do is to sort your library items in those folders e.g. “com.swfgeek.robotlegs.views.MainAnimation” ( see Fig. 2).

Fig. 2

With one simple click your library is ready for export. Saves you the effort of right clicking on the library item going to properties, ticking the ‘export’ checkbox and typing in the package/class name. In the Classer section you can adjust the base class of your items( see Fig. 3)

Fig. 3

The Auto Flash Class Panel is also fully customizable, to modify how it works or add your custom base classes to the menu click the settings button and customize how you want the panel to work and function(see fig. 4).

Fig. 4

The panel was built with Robotlegs, AS3Signals, MinimalComps and FDT4. I’ve been using it  in my diary projects workflow for over a week now and it’s a really time saver, check out Matan’s post about it and be sure not to miss his upcoming presentation on Asset Loader this  17th of December.

Here’s a video by Matan on how to use the panel.

Don’t be shy and give it a try  You won’t regret it 😉

Using Flash Player 10.2 in FDT4

In this post I will tell You how you can start playing with the new features of the Flash Player 10.2 Beta in FDT 4. I started using “Flash Builder Burrito” for the examples that I’ve been posting but I really missed the quick code hints and mostly the auto-import features of FDT4 that let me explore the new SDK without leaving my code to read the documentation, that said let’s move on.

Figure 1.

1.- The first thing You need to do is go to the Hero Stable Builds table and download the Flex SDK  build 18623 from there.

I usually have all my SDKs located in the same place in my disk “C:\SDKs” but You can put it on the desktop for easy location, once you have downloaded it decompress the zip in the location you chose. (Note: These builds do not contain any Hero mobile features or runtimes but it appears that the flex.swc that should be located in \frameworks\libs  is also missing you’ll need to include this from a previous build or FDT will output errors when adding the SDK to your project ).

Figure 2.

2.- Open FDT4 and go to >Window>Preferences and open the FDT tab and select Installed SDKs from that menu as shown in figure 3.

Figure 3.

Click on the Add  button and the SDK definition Panel will pop up select the directory where You have downloaded the Flex Hero SDK, if you have a previous Flex Hero SDK installed be sure to give a different name I called mine Flex Hero ( Flash Player 10.2  Beta).

Figure 4.

3.- Go to >File>New>New Flash Project select Empty AS3 project give your project a name and click the next button that will take You to the Flash Project Settings  in the SDK Configuration select your newly added SDK( see figure 5.) you will see that the Player Version changes to 10.2, click finish.

Figure 5.

4.- Right click in the project You just created select properties, go to the FDT Compiler menu and change the -target-player from “playerVersion” to “11”  this will let you test your projects without getting any version errors.

EDIT:   In this step You don’t need to change the “-target-player” argument leave it as is it will use the 10.2 version but you need to add the “-swf-version=11” argument, that way it won’t show errors when compiling.( Thanks to John Olson for pointing it out).

Figure 6.

5.- That’s it now You can test and compile the features including in the beta of  the Flash Player 10.2 and get  all the coding comfort of FDT4.

Figure 7.

Flash Player 10.2 Beta (Native bitmap-based cursors)

One of the new features of the Adobe Flash Player 10.2 is the Native bitmap-based cursors this will let You get rid of the Mouse.hide(), onMouseMove() handler  or starDrag() to display a custom cursor in your Flash projects. You can now directly assign your own custom cursors. So here’s a sample extending Thibault Imbert’s

1.- First we embed the assets( the images that we will be using as our custom cursors) and  an int var that we will be using to switch our cursors.

[Embed (source="/assets/126.gif" )]
public static const NativeCursor:Class;
[Embed (source="/assets/cat1.png" )]
public static const CursorFrame1:Class;
[Embed (source="/assets/cat2.png" )]
public static const CursorFrame2:Class;
[Embed (source="/assets/cat3.png" )]
public static const CursorFrame3:Class;
[Embed (source="/assets/cat4.png" )]
public static const CursorFrame4:Class;
[Embed (source="/assets/cat5.png" )]
public static const CursorFrame5:Class
protected var _state : int = 0;

2.- Then on the class constructor we add the click mouse event listener so on each user click we toggle the cursor.

public function NativeCursorTest() {
  stage.addEventListener(MouseEvent.CLICK, _onClick);
  toggle();
}

3.- The methods that create our cursors this is exactly the same code that Thibault’s sample just divided in two methods so You can see the animated and static cursor working.

private function createNativeCursor() : void {
   // we create a MouseCursorData object
   var cursorData:MouseCursorData = new MouseCursorData();
   // we specify the hotspot
   cursorData.hotSpot = new Point(15,15);
   // we pass the cursor bitmap to a BitmapData Vector
   var bitmapDatas:Vector.<BitmapData> = new Vector.<BitmapData>(1, true);
   // we create the bitmap cursor (bitmaps should not be bigger than 32x32 pixels, this is an OS limitation)
   var bitmap:Bitmap = new NativeCursor();
   // we pass it to the bitmapDatas vector
   bitmapDatas[0] = bitmap.bitmapData;
   // we assign the bitmap to the MouseCursor object
   cursorData.data = bitmapDatas;
   // we register the MouseCursorData to the Mouse with an alias
   Mouse.registerCursor("myCursor", cursorData);
   // whenever we neeed to show it, we pass the alias to the existing cursor property
   Mouse.cursor = "myCursor";
}

private function createAnimatedCursor() : void	{
   // we create a MouseCursorData object
   var cursorData:MouseCursorData = new MouseCursorData();
   // we specify the hotspot
   cursorData.hotSpot = new Point(15,15);
   // we pass the cursors bitmap to a BitmapData Vector
   var bitmapDatas:Vector.<BitmapData> = new Vector.<BitmapData>(5, true);
   // we create the bitmap cursor frames (bitmaps should not be bigger than 32x32 pixels, this is an OS limitation)
   var frame1Bitmap:Bitmap = new CursorFrame1();
   var frame2Bitmap:Bitmap = new CursorFrame2();
   var frame3Bitmap:Bitmap = new CursorFrame3();
   var frame4Bitmap:Bitmap = new CursorFrame4();
   var frame5Bitmap:Bitmap = new CursorFrame5();
  // we pass it to the bitmapDatas vector
   bitmapDatas[0] = frame1Bitmap.bitmapData;
   bitmapDatas[1] = frame2Bitmap.bitmapData;
   bitmapDatas[2] = frame3Bitmap.bitmapData;
   bitmapDatas[3] = frame4Bitmap.bitmapData;
   bitmapDatas[4] = frame5Bitmap.bitmapData;
   // we assign the bitmap to the MouseCursor object
   cursorData.data = bitmapDatas;
   // we register the MouseCursorData to the Mouse
   Mouse.registerCursor("myAnimatedCursor", cursorData);
   // we just pass a frame rate
   cursorData.frameRate = 5;
   // whenever we neeed to show it, we pass the alias to the existing cursor property
   Mouse.cursor = "myAnimatedCursor";
}

4.- And finally our Mouse event listener and the toggle method that makes all that cursor magic switch happens.

private function _onClick(event : MouseEvent) : void {
	// we call the toggle function to switch between our mouse cursors
	toggle();
}

private function toggle() : void {
	switch (_state) {
	   case 0:
		// we set the static cursor
		createNativeCursor();
		_state = 1;
		break;
	   case 1:
		// we set the animated cursor
		createAnimatedCursor();
		trace(_state);
		_state = 0;
		break;
		default:
	}
}

Hope this helps You and in case you haven’t already go to adobe labs and download the Flash Player 10.2 beta.

Almost forgot here’s the example: ( You’ll need Flash Player 10.2 in your browser to see it).

Flash Player 10.2 Beta – StageVideo CPU Performance Test (Video)

Flash Player 10.2 Beta – StageVideo CPU Performance Test from Dave Gamez on Vimeo.

This is a example of the StageVideo API performance on Windows 7 (The microphone got messy on me so there’s no audio but anyway You get to see on the monitor how the new Flash Player 10.2 performs).

If You wan’t more info on how to start making some test on Your own reading the Getting Started with stage video article on the ADC by Thibault Imbert will be a good point to start.

Adobe Flash Player 10.2 Beta – Stage Video hardware acceleration (Video).

Adobe Flash Player 10.2 Beta – Stage Video hardware acceleration. from Dave Gamez on Vimeo.

A short screencap testing the Stage Video hardware acceleration and full screen mode with multiple monitors capabilities in Adobes´s Flash Player 10.2 using Google Chrome Task Manager (CPU Monitor) on Windows 7