Thoughts on Flex

Drag & Drop, Lists and [RemoteClass]

MysticEarth — Thu, 24 Sep 2009 08:44:18 +0000

The scenario:

List 1: DragEnabled = true;
List 1: DataProvider contains custom classes: MyClass (these classes do not extend any other class)
List 2: DropEnabled = true;

The problem:
When I dragged the item from List 1 to List 2, the MyClass item was converted to an Object. As I wanted to display different ItemRenderers based on the class I needed the items not to be converted to an Object.

The solution:
Using the [RemoteClass] MetaData the class isn’t being converted to Object but remains MyClass.

From the Flex Reference Library:
Use the [RemoteClass] metadata tag to register the class with Flex so that Flex preserves type information when a class instance is serialized by using Action Message Format (AMF). You insert the [RemoteClass] metadata tag before an ActionScript class definition.

Easy sound volume and fading in Flex with ExtendedSound

MysticEarth — Fri, 28 Aug 2009 13:28:55 +0000

Paul Bijl from mas•outreach created an easy to use Sound class for which gives you easy fading capabilities and volume setting without a SoundTransform and SoundChannel. The class itself creates these needed classes.

The ExtendedSound class enables easy setting of volume and gives you fading capabilities.

Download
ExtendedSound.1.0.zip

Add high resolution images to your PDF (AlivePDF)

MysticEarth — Fri, 28 Aug 2009 08:35:48 +0000

With AlivePDF you can create PDF files with Flex. It’s a great library with much options. But how to add images to your PDF? There are 2 basic options you can use to add images to the PDF:

Using an embedded JPG or PNG (remember: without transparency)myPDF.addImageStream( new EmbeddedImage() as ByteArray, 0, 0, 500, 500, 1, ResizeMode.NONE);

Using a DisplayObject from within your application (charts, buttons, vbox’s, etc.)myPDF.addImage(DisplayObject, 0, 0, 500, 500, ImageFormat.PNG);

When you add a DisplayObject to the PDF as seen above, it will generate a low resolution ImageSnapshot. But what if you want a high resolution ImageSnapshot of your, let’s say, charts? Then you need to create the ImageSnapshot yourself:

By using the JPEGEncoder
var image:ImageSnapshot = ImageSnapshot.captureImage(DisplayObject, 300, new JPEGEncoder());

By using the PNGEncoder
var image:ImageSnapshot = ImageSnapshot.captureImage(DisplayObject, 300, new PNGEncoder());

This wil return an ImageSnapshot, with a ByteArray in it’s data property (image.data). Now you can add this high quality snapshot to the PDF:

myPDF.addImageStream(image.data, 0, 0, image.width, image.height);

Try to avoid the Flex JPGEncoder when you want to encode high resolution images, it will take a long time and block your browser. Instead, use an Asynchronous JPG Encoder as explained (and source code) by Switch on the Code.

Note: when you use PNGEncoder, be aware of DisplayObjects which have transparency. If you want to add a snapshot to the PDF with transparency, it’ll return an error. If anyone has the solution to this problem (high resolution PNG snapshot without transparency), please let me know.