Fun with code (since 2006)

Query Graphics Data – Live demo


01.17.13 Posted in Actionscript 3 by

I wanted to post the demo of the example I posted the other day as a video. It is using the new Query Graphics API we are introducing in Flash Player 11.6/AIR 3.6. Make sure you have Flash Player 11.6 and check the demo below. Just click anywhere to sample the graphical objects from the MovieClip then reconstruct it at runtime:

Get Adobe Flash player

Here is the very simple code below, note that the API is now called readGraphicsData. You can download the full source code here:

package
{
	import flash.display.IGraphicsData;
	import flash.display.Sprite;
	import flash.events.Event;
	import flash.events.MouseEvent;
	
	[SWF(width="900", height="400", frameRate="30", backgroundColor="#FFFFFF")]
	public class TestGrabby extends Sprite
	{
		private var b:BigBilbo = new BigBilbo();
		private var v:Vector.<IGraphicsData>;
		private var result:Vector.<IGraphicsData>;
		private var copy:Sprite = new Sprite();
		private var inc:int;
		private var count:int;
		
		public function TestGrabby()
		{
			b.scaleX = b.scaleY = .7;
			copy.scaleX = copy.scaleY = .7;
			b.x = 240;
			b.y = 200;
			addChild( b );
			
			copy.x = 650;
			copy.y = 200;
			addChild ( copy );
			
			stage.addEventListener(MouseEvent.CLICK, onClick);
		}
		
		private function onClick(e:MouseEvent):void
		{	
			// reset
			inc = 0;
			stage.removeEventListener(Event.ENTER_FRAME, onFrame);	
			copy.graphics.clear();
			
			// sample
			v = b.graphics.readGraphicsData(true);
			count = v.length;
			result = new Vector.<IGraphicsData>(count, true);
			stage.addEventListener(Event.ENTER_FRAME, onFrame);	
		}
		
		private function onFrame (e:Event):void
		{
			if ( inc < count )
			{
				result[inc++] = v.shift();
				copy.graphics.drawGraphicsData(result);
			} else stage.removeEventListener(Event.ENTER_FRAME, onFrame);
		}
	}
}

I hope you guys will like it!



21 Responses to “Query Graphics Data – Live demo”

  1. javid says:

    good ! tnx

  2. Gary Paluk says:

    Great new feature in my opinion. Thanks

  3. javid says:

    I try it but give me an error :

    Exception fault: ReferenceError: Error #1069: Property readGraphicsData not found on flash.display.Graphics and there is no default value.

    What should i do?

  4. Thibault Imbert says:

    Hi Javid,

    Are you sure you are running Flash Player 11.6?

    Thibault

  5. ozgur says:

    what is the use case of this feature? I see that you can generate sprite sheets at run time with it, but what else, please?

  6. Thibault Imbert says:

    Hi ozgur,

    Many different things, sprite sheet is one, another very useful is for serialization/deserialization of display objects. With this feature , you can describe entirely a display object and save it as an XML file for instance and save that to reuse later. AMF does not support display object, this feature allows you to circumvent this limitation.

    Also, lets say you wanted to export any display object to SVG or any other format, you can do this with this feature given that the display object is entirely described.

    Thibault

  7. Senthil Kumaran says:

    Also we can burst any movieclip… :)

  8. Interesting stuff, keep it up!

  9. David Barlia says:

    This really looks superb. Great to see support for gradients has made it in. Any other changes to the list of supported graphics features?

  10. Senthil Kumaran says:

    Can we apply transformation to Graphics data before drawing?

  11. Elliot Geno says:

    Does Bitmap fills work as well? Also how fast is it? Just glancing at the code, it appears you slow it down to show what it can do. But is it almost instantaneous or is it a pretty expensive task?

  12. Eiven says:

    I find it interesting for
    triangulation of 2D Polygons.

  13. Rackdoll says:

    HI Thibault,
    Do you have some performance numbers for us on this subject ?

    THnx in advance!
    Rackdoll

  14. Reacol says:

    Your entire work to advance Flash Player forward is really awesome ;) Thank YOU!!! Happy NEW YEAR!!!

  15. [...] Cool so now that I was able to render filled triangles and bezier curves (and soooooo close to cubic curves too – need help on this one though), I thought it should be easy to tie it in to the new readGraphicsData command as seen here: Query Graphics Data [...]

     
  16. ben w says:

    Hi Thibault, had a quick bash at some rendering of the graphics data on the GPU:
    http://blog.bwhiting.co.uk/?p=423
    Still a long way to go but initial results are promising.
    b

  17. Thibault Imbert says:

    Hi Ben,

    Really cool example of use of the feature. Keep me posted ;)

    Thibault

  18. Patrick says:

    does anyone know why Create Projector has been disabled since FP 11.2?
    we use that all the time to create exe’s to play flash locally for users that can’t play swfs…this was an important option for us to have.

  19. This is great, although the resulting ByteArray is quite large, are you guys working on a better compression?

  20. civet says:

    I modified line48~49 to:
    result.length = 0;
    result[0] = v[inc++];
    and do not set result to fixed-length
    also work!

  21. [...] Update: This feature has shipped in Flash Player 11.6/AIR 3.6 – See here. [...]

     

Leave a Reply

Open Sort Options

Sort comments by:
  • * Applied after refresh

ByteArray.org
Fun with code since 2006.