Search This Blog

Showing posts with label UI. Show all posts
Showing posts with label UI. Show all posts

Saturday, April 14, 2007

CursorManager, DisplayObject, Sprite, Movie Clip

The cursor is basically treated as if its a DisplayObject, which in practice means that its a Sprite, MovieClip, Bitmap or Shape. Most of the examples I've seen use embedded assets, most often a bitmap. But it can be any class that can sit on the display list.

Of course, you're not able to access your specific instance of the class as the CursorManager creates it internally and its not exposed. So, you have to be tricky. Either you create a class that's a monostate (all of the instances of the class share a common state) or have your custom class listen for some particularly events that you're able to get into the display list and to your class. Personally, I'd go for the monostate (more predictable).

You'll need to create a class that inherits from DisplayObject, Sprite would be a good choice. In your class, I'd add a static member that stores the current "size" or "scale". And in the ENTER_FRAME event, have your sprite copy that value into the sprite's scaleX and scaleY members. Basically, it's manual binding (you could probably do some more traditional binding as well, but I'm assuming here that you'd probably be using ENTER_FRAME anyway for some animation).

Pass off your custom cursor sprite class to the CursorManager to use... internally, it will construct an instant as necessary (based on priority of cursors, etc.). On your end, just modify the static state (scale) as necessary. The result will be a cursor that resizes (because the CursorManager's instance of the class is using the same static state that you're manipulating).

If you're embedding an SWF, just embed it and use it inside of your custom class (add it as a child, etc.).

Tuesday, April 10, 2007

Flex App with no Scrollbars

  • minWidth="0" minHeight="0"
  • provide width, height in percentage
  • verticalScrollPolicy="off" horizontalScrollPolicy="off"
  • wordWrap="true" for TextArea Component
  • truncateToFit="true" for Label Component

Flex Preloader

package myComponents
{
import mx.preloaders.*;
import flash.events.ProgressEvent;

public class DownloadProgressBarSubClassMin extends DownloadProgressBar
{
public function DownloadProgressBarSubClassMin()
{
super();
// Set the download label.
downloadingLabel="Downloading app..."
// Set the initialization label.
initializingLabel="Initializing app..."
// Set the minimum display time to 2 seconds.
MINIMUM_DISPLAY_TIME=2000;
}

// Override to return true so progress bar appears
// during initialization.
override protected function showDisplayForInit(elapsedTime:int,
count:int):Boolean {
return true;
}

// Override to return true so progress bar appears during download.
override protected function showDisplayForDownloading(
elapsedTime:int, event:ProgressEvent):Boolean {
return true;
}
}

}

You can use your custom class in a Flex application, as the following example shows:


mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
preloader="myComponents.DownloadProgressBarSubClassMin">

mx:Application>

CSS Style Example for Preloader:

ProgressBar {
borderColor: #cc0066;
barColor: #000000;
trackColors: #009999, #99ffcc;
color: #000000;
paddingLeft: 7;
paddingRight: 11;
textIndent: 14;
trackHeight: 21;
verticalGap: 20;
}