Here’s a little demo Flex app I put together. It’s another MXNA RSS reader (I know, I know, like there aren’t anough of those already). But really I didn’t start out making an RSS reader, I started playing with Ely Greenfield’s FishEye component. Then I figured it would be cool to have the icons I used for the FishEye component rotate a badass 3d cube thingy, which uses the awesome distortion classes from Alex Uhlmann. And of course it’s got to have the requisite web 2.0 reflection, which was made by Ben Stucki. Then I figured that I should have something sweet displayed in the rotating cube, and I remembered Josh Tynjala’s TreeMap component. And I remembered seeing a demo of an MXNA reader that Josh had made using that TreeMap component, so that’s how I ended up making another RSS reader.
Why is this important?
There’s been a lot of discussion recently about the Flex component developer community. Projects are starting, developers are coming out of the woodwork, the community’s buzzing. This little demo shows a combination of open-source Flex components from four different developers, put together by a fifth developer (me). All the code I used has been released by the authors for free use. It’s all available to browse through, learn from, improve, etc. Now if only it was all consolidated into one central location… <hint, hint>
And we’re only at the beginning. Keep an eye out for new Flex components, my prediction is that we’re going to see an avalanche of awesome components.
So anyway, here’s my little demo. It just loads the most recent posts on MXNA for whatever category you select (by clicking on one of the icons at the bottom).
Here’s the recipe:
- FishEye component from Ely Greenfield
- Custom modifications to add the bouncing functionality to the icons
- Reflection component from Ben Stucki
- Distortion effects from Alex Uhlmann
- TreeMap component from Josh Tynjala
Add them all together and this is what you get:
[Or launch it in it’s own window: here’s the link]
Source for this demo isn’t released yet, I put it together quickly, so it’s not quite up to my own standards.
Very nice. Remember, my treemap component is released under the GPL, so you’ll need to make sure everything is compatible.
Aha, so that means I HAVE to release the source code of the demo. No worries, I was planning on it once I had a little time to clean things up a bit. As long as you’re cool with that. If I don’t release the code right away it’s simply a matter of me being busy/lazy, so just give me a little prod via email if you want to push me along.
My head doesn’t like licensing stuff, don’t sue me!
Fantastic, Doug.
Very slick! One little thing I noticed–the reflection of the treemap doesn’t show the text, probably because you’re not embedding the font.
Excellent work.
I love it!
You ARE a Flex machine!
dude, cut it out,
This is too hot, you are giving flex a bad rep. People won’t be able to cope with this. I can hear the comments already: not web standards based, no affordance, no standard user experience. f- em all i say 😉
Ouch, i just burnt my fingers, this is so hot.
Wooha (as in the wooha of ‘scent of a woman’).
Doug this is fantastic, and actually exactly what I’ll be presenting on in my session at webDU in Sydney Australia. The number of community built components available is growing massively, and deserves a lot of focus. I’ll be sure to give this a big mention!
http://www.webdu.com.au/index.cfm?objectid=A04C5C97-13D4-B1F1-488244DBC0BFD4D9
Cheers,
Spaulds
dood..this is probably the wickedest example I have seen to date!!!
you are truly a flex guru.
quick question : those button icons (Fw, FX, Dw), etc….please tell me thats just css and not a png or jpeg….also when are you posting the source code!!!!!!!!
Look forward to seeing the source, you rock!
Doug, this is amazing! when do you think you are going to release the source?
Doug this is soooo cool.
I’m looking forward to the source!
sooooo cool!
Wow, very cool!! But why is it Flex 3 and not 2? And Cold Fusion 8 should be Coldfusion 8..
Looking forward to the source!
You rock!
Looking forward to the source!
This is sweet.
Quick question – how did you get the text to display above the image when you rollover an icon? This part has me stumped a bit…if you got the time….
Geez….do a little search chief…., I see you have posted it….
You da man…
Dear may i ask you one question
how you to add mouse event listen so that you could choice item, when you use fisheye compent, really diffcult
Hi Doug, what an app, big up MAN!!
Just one thing though please, I am trying to create a fisheye menu with icons similar to the fisheye menu above, but I don’t understand you code with regards to this matter. I just want the fisheye to be applied to a canvas with icons enclosed in the canvas, I am not ready to have the bouncing effects yet.
Please try and guide me through this process if you have time, I am trying to go through the current cource code at a snails pace to try and understand it but I am having no luck. I usually catch on quite well if someone specifies the paramaters and then I can work form there, but right now I am happy to admit that I am clueless right now.
But nonetheless, very nice app, super super MASH-UP!!
Stay well
Kind regards
Ali
Very nice examples, thanks for the list
Hi,
I love your application, great work!!! As Ali, I do have some troubles understanding the Fisheye code… What I’m looking for is fisheye with text and little icons, almost like you did it (just my icons shall be smaller and I’d prefer vertical layout).
Can you give me a hint, or share the piece of sourcecode which accomplishes just that with us/me?
Best,
Damian
Hi this is awesome! I am trying to plat around with the fisheye component but keep getting errors. Do you have the source? Beautiful work!
Could with please make available the source code ?
Thank you 🙂