fun with flash
by Orion Elenzil · 02/19/2009 (12:45 am) · 12 comments
i enjoy making simple graphical toys, and have been on a several-year quest for a platform in which to write them other than native windows GDI code. the GDI generally has the sorts of features i want (eg drawLine, fillPolygon) but suffers from a lack of portability and ease-of-viewing.
a couple years ago i explored java applets as a possible solution,
but was very disappointed in the fragility of the deployments and the burdensomeness of the development environments. i also looked a bit at the flash authoring environment back then and just couldn't reconcile myself to the backwards timeline-oriented paradigms of Flash 6 or 7 or whatever it was.
more recently i experimented with SVG (scalable vector graphics) which are quite appealing because the language is just javascript, which i'm a big fan of and because it has a very small dev-environment (ie a text editor and a browser) and fast "compile" times. however i felt the performance wasn't quite there.
most recently i learned that Flash can now be written with just a text editor and compiled with a FOSS tool: mxmlc. i hadn't realized that you could develop flash without a bulky IDE, so i decided to give it a go. here is my very first project, which includes some instructions on how you, too, can set up a command-line-only flash development environment. (it's not hard)
and so here is the first interesting flash project i've made, a very simple graphical toy. it's a remake of a Windows GDI-based toy i made several years ago, and as such gives me a good feel for the comparative performance. Frankly, i'm a bit underwhelmed with Flash's performance. Even calculating the transforms due to rotation by hand each frame, the win GDI vastly outperforms flash. I'm not sure how much of the difference is due to graphics overhead (eg beveled edges, transparency, spline-based rendering, AA, "lines" which are actually complex polygon-based shapes, etc) and how much is due to the script nature of ActionSCript vs. C.
so i'm not sure my quest is at an end.
i may try implementing the same thing in Processing,
and perhaps again in Silverlight, if i can find anything resembling a simple "Hello World" type example for Silverlight and if it has a command-line dev environment option.
so. but meanwhile, i'm still pretty stoked that these days it's possible to write a toy even as simple as this one and know that anyone on just about any computer will be able to see it!
screenies.
a couple years ago i explored java applets as a possible solution,
but was very disappointed in the fragility of the deployments and the burdensomeness of the development environments. i also looked a bit at the flash authoring environment back then and just couldn't reconcile myself to the backwards timeline-oriented paradigms of Flash 6 or 7 or whatever it was.
more recently i experimented with SVG (scalable vector graphics) which are quite appealing because the language is just javascript, which i'm a big fan of and because it has a very small dev-environment (ie a text editor and a browser) and fast "compile" times. however i felt the performance wasn't quite there.
most recently i learned that Flash can now be written with just a text editor and compiled with a FOSS tool: mxmlc. i hadn't realized that you could develop flash without a bulky IDE, so i decided to give it a go. here is my very first project, which includes some instructions on how you, too, can set up a command-line-only flash development environment. (it's not hard)
and so here is the first interesting flash project i've made, a very simple graphical toy. it's a remake of a Windows GDI-based toy i made several years ago, and as such gives me a good feel for the comparative performance. Frankly, i'm a bit underwhelmed with Flash's performance. Even calculating the transforms due to rotation by hand each frame, the win GDI vastly outperforms flash. I'm not sure how much of the difference is due to graphics overhead (eg beveled edges, transparency, spline-based rendering, AA, "lines" which are actually complex polygon-based shapes, etc) and how much is due to the script nature of ActionSCript vs. C.
so i'm not sure my quest is at an end.
i may try implementing the same thing in Processing,
and perhaps again in Silverlight, if i can find anything resembling a simple "Hello World" type example for Silverlight and if it has a command-line dev environment option.
so. but meanwhile, i'm still pretty stoked that these days it's possible to write a toy even as simple as this one and know that anyone on just about any computer will be able to see it!
screenies.
About the author
#2
Interesting first app. If you stare at it, it's quite hypnotizing.
I get an error when I run it though. I think if you declare mTick as follows, it would squash it.
02/19/2009 (10:13 am)
Hey Orion. I do Flex development at my day job. Nothing quite as psychedelic as you have going on here, but it's a great tech and there's a lot of work out there in the Flash/Flex world.Interesting first app. If you stare at it, it's quite hypnotizing.
I get an error when I run it though. I think if you declare mTick as follows, it would squash it.
[Bindable] private var mTick :Number = 0;
#3
I suspect that you'd get better performance with Silverlight.
I'm sure you can (with some effort) figure out how to compile a Silverlight app with just the SDKs (that is, without the IDE), but there's a full featured FREE version of the IDE available. The best place to get started with Silverlight is here: http://silverlight.net/GetStarted/
If you don't get around to porting it to Silverlight I might just have to do it for you! ;)
02/19/2009 (10:16 am)
Another interesting demo!I suspect that you'd get better performance with Silverlight.
I'm sure you can (with some effort) figure out how to compile a Silverlight app with just the SDKs (that is, without the IDE), but there's a full featured FREE version of the IDE available. The best place to get started with Silverlight is here: http://silverlight.net/GetStarted/
If you don't get around to porting it to Silverlight I might just have to do it for you! ;)
#4
It always seems to me that it is a tool made for hiding the design of an application : when I had to modify an existing flash module made by another person, I spend more time trying to find where is stored the bad code, than fixing the bad code (although I'm used to use Director for more than 10 years) !
Nicolas Buquet
www.buquet-net.com/cv/
02/19/2009 (10:42 am)
I will follow your progress too : I have always been scared by flash UI.It always seems to me that it is a tool made for hiding the design of an application : when I had to modify an existing flash module made by another person, I spend more time trying to find where is stored the bad code, than fixing the bad code (although I'm used to use Director for more than 10 years) !
Nicolas Buquet
www.buquet-net.com/cv/
#5
02/19/2009 (12:21 pm)
Nice work!
#6
Patrick, changed & recompiled.
is the error you get during compilation or execution ? (if that's the right terminology). I notice i'm using the Flash 10 player, i wonder if that's why i don't see an error. I'm a total newb at actionScript. Does mTick need to be bindable because handler_EnterFrame() accesses it directly ? What about mThings[] and mThingsv[] ?
Is it possible to add a dynamic field to say a new Shape instance ?
Eg i'd like to do something like:
Josef,
thanks for the Silverlight getting started tip, i'll give it a check.
I suspect that trying to do this stuff sans-IDE is probably not a sustainable approach, whether Silverlight or Flash.
02/19/2009 (1:40 pm)
thanks for the comments, All !Patrick, changed & recompiled.
is the error you get during compilation or execution ? (if that's the right terminology). I notice i'm using the Flash 10 player, i wonder if that's why i don't see an error. I'm a total newb at actionScript. Does mTick need to be bindable because handler_EnterFrame() accesses it directly ? What about mThings[] and mThingsv[] ?
Is it possible to add a dynamic field to say a new Shape instance ?
Eg i'd like to do something like:
var s :Shape = new Shape; s.myField:Number = 0;but get errors in compilation.
Josef,
thanks for the Silverlight getting started tip, i'll give it a check.
I suspect that trying to do this stuff sans-IDE is probably not a sustainable approach, whether Silverlight or Flash.
#7
Now why didn't I ever think of that??
02/19/2009 (9:18 pm)
"and here are some words to make the summary 100 characters long"Now why didn't I ever think of that??
#9
I'm playing with Flash recently, and I have found a method that greatly improves performance.
It consists on pre-rendering all vector shapes to arrays of BitmapData objects, and during the main loop we just draw Bitmaps feeded with that data instead of those vector shapes.
Having it already pre-calculated when we draw every frame obviously saves a lot of processing time.
Many Flash games I have seen on web reportedly use this method.
02/20/2009 (7:13 am)
It looks nice.I'm playing with Flash recently, and I have found a method that greatly improves performance.
It consists on pre-rendering all vector shapes to arrays of BitmapData objects, and during the main loop we just draw Bitmaps feeded with that data instead of those vector shapes.
Having it already pre-calculated when we draw every frame obviously saves a lot of processing time.
Many Flash games I have seen on web reportedly use this method.
#10
As for [Bindable]. It allows you to wrap a variable in curly braces in the MXML file and bind it as a data source. For instance, say you have a combobox in your app and you want to populate it with data that is received from a web service. You simply put your Bindable declared variable in the dataProvider tag of the combobox and it will stay populated with whatever is stored in that variable.
Or, in a game application, you could create a healthbar from a reskinned Flex progress bar and keep it up to date by binding it to a Bindable 'Health' variable.
02/20/2009 (9:14 am)
Quote:I notice i'm using the Flash 10 player, i wonder if that's why i don't see an error.I'm using FlashPlayer 9, so that's probably why you don't see it. Although my suggestion didn't fix the error anyways. I'd have to take a closer look to see why it's causing the error in FlashPlayer 9.
As for [Bindable]. It allows you to wrap a variable in curly braces in the MXML file and bind it as a data source. For instance, say you have a combobox in your app and you want to populate it with data that is received from a web service. You simply put your Bindable declared variable in the dataProvider tag of the combobox and it will stay populated with whatever is stored in that variable.
Or, in a game application, you could create a healthbar from a reskinned Flex progress bar and keep it up to date by binding it to a Bindable 'Health' variable.
#11
Patrick - thanks for re-testing. i should probably downgrade to Flash 9 to make sure the stuff i make is compatible w/ the current internets.
Bindable - gotcha. Similar in concept to torque's Con::AddVariable() to link a C-side variable to a script one.
02/20/2009 (10:49 am)
Daniel - indeed;, i was wondering if it would be faster if the little squares were bitmaps instead of vectors shapes. curiously, the CPU use seems to be related to pixel fill. ie, when the window is small the CPU use drops way down. i find this pretty surprising, as it seems to imply that Flash is using a software rasterizer for stuff like drawRect(). does anyone know if that's the case ?Patrick - thanks for re-testing. i should probably downgrade to Flash 9 to make sure the stuff i make is compatible w/ the current internets.
Bindable - gotcha. Similar in concept to torque's Con::AddVariable() to link a C-side variable to a script one.
Employee David Montgomery-Blake
David MontgomeryBlake