Plexiglass: 3D Components Made Easy at 360|Flex
In the time since 360|Flex Atlanta, Ben and I have made a lot of progress on OpenFlux. The majority of my focus has been on what's called Plexiglass. It consists of an alternate view class, 3D layouts and cameras allowing you to create 3D components with as little as a couple lines of mxml or css.
We've still got a ways to go, OpenFlux is still in alpha release, but I'm really happy with what we've done so far and I can't wait to show it off. My session at 360|Flex will give you a great idea on what's currently possible, how to get started and future plans. Not to mention some sweet demos with full source code provided.
I'll also be looking to the crowd to drum up discussion on where to go next with the project. Although OpenFlux has been quoted as "Flex 4 Now", Plexiglass is definitely beyond the scope of the Flex 4 SDK. We've got a pretty solid core, I've experimented with Flex 4 compatibility and I think with the communities help this project can go a long way.
Below is a quick example (took 5 minutes) of a regular OpenFlux List component using the FlowLayout and an OpenFlux List using Plexiglass with the SpiralLayout. You can see by the source code, Plexiglass is really easy to get started with.
If you are interested in learning more come check out my session on Monday afternoon. On Sunday there is also free training on OpenFlux with Ben Stucki and I'll also be there to show you how to build a 3D component (e-mail info@360flex.com to RSVP).
Lastly: This will be my third time going to 360|Flex. The previous 2 (Seattle, Atlanta) I had a blast, learnt a lot, meet a bunch of great people and it sounds like this one is going to be even better. I look forward to seeing you all there and if you see me around please come say hi.
Updated: PlexiGlass (OpenFlux 3D) Example
Since my previous entry I've made some major speed improvements, added back in the 52 cards and added 2 new 3d layouts similar to the ones in Pavan Podila's Element Flow.
We've still got some work ahead of us before this goes public but I definitely can't wait to see OpenFlux get used and see what new 3D layouts others contribute.
As we get closer to release I'll be posting more examples and howtos on getting started with OpenFlux.
Click the image below to try out the example.
PlexiGlass (OpenFlux 3D) Example
I've ported over Doug McCune's CoverFlow component as 3D layouts in OpenFlux. You can switch between horizontal, vertical and carousel layout in the same List component along with a few other adjustable properties. It's highly likely there are a few bugs and I had to limit it to 20 cards (52 cards was crazy slow) but this should give you a great idea of where OpenFlux is going.
A regular OpenFlux layout class manages the the x/y positions of the item renderers. PlexiGlass layout classes goes a step further and manage z position, x/y rotations and the camera.
We've still got some cleaning up to do but the code for this example will be included once PlexiGlass goes public. Click the image below to try out the example.
OpenFlux Example: Deck of Cards
By now I'm sure a lot of you have heard about Ben Stucki's latest project called OpenFlux. If not, check out the blog entry Ben wrote introducing it or listen to the latest The Flex Show episode discussing it.
I'm really excited for OpenFlux, have been contributing to the project quite a bit and I'm hoping to spend a lot more of time over the next while helping get OpenFlux to a stable release and posting examples on my blog so others understand what's possible.
The general difference between an OpenFlux component and the current Flex components is that the logic is separated in to a MVC architecture. This allows you to easily swap out one part of a component while keeping the functionality of the others. A List component goes a step further and separates the layout logic so you can easily invent new ways to layout your list items.
In this example I've created a cool (but possibly not too practical) OpenFlux List component that displays a deck of cards. Although it looks nothing like a standard List component, it is a List and has the same functionality that you would expect a List to have. For example, the cards are selectable and as you select multiple cards their suit/rank is displayed in a separate standard List.
To get the List working how I wanted all I had to do was use the Image component as my item renderer and create a custom layout class (which is now included with OpenFlux, called StackLayout). The StackLayout has gap and selectMode properties that you can play around with. Click the image below to try the working example.
You can checkout the latest OpenFlux source code, including code for the example, at the OpenFlux SVN webpage.
My Experience at 360|Flex Atlanta
This is my second time attending 360|Flex and my first time speaking at it. Overall I had an amazing time and can't wait for the next one. I showed up by myself, knowing hardly anyone and left with a ton of new friends (beer helped with that).
The conference is full of brilliant approachable people who are eager to swap knowledge. As an independent developer who works from home, I really enjoyed meeting others face-to-face. Talking to fellow developers about Flex is a lot more rewarding compared to forcing my fiancee to listen to my "cool" programming breakthroughs.
Back at home before the conference, many people asked if I was nervous about speaking. I responded with no (only half lying to them) and that I was more excited than anything. When I previously went to the Seattle conference I got to experience the community vibe and felt that everyone is just appreciative of the knowledge you have to share. Also, as Doug McCune has said, it's ok to say you don't know the answer to something because there is usually someone in the crowd who will gladly answer for you.
Also, I owe my left nut to the guy who let me borrow his Mini-DVI to VGA Adapter. Thanks so much dude! It would have been a fairly pointless session without it.
One of my favorite sessions was building your personal brand that Doug McCune and Juan Sanchez bravely took on in place of Jesse Warden. Although I give huge props to the two of them for being able to whip up a lot of useful tips (in only 20 minutes!), I really enjoyed the input from the crowd. I think this is where 360|Flex shines. Whether or not you are a speaker, everyone brings something to the table and everyone's opinion helps take the discussion further than it would without them.
As the Atlanta conference was ending, I was already getting excited hearing about when/where the next conference will happen. I really hope Tom and John were able to step away from their lovely blue registration table for at least a few moments to see how well their conference turned out.
To all of the great people I met at 360|Flex Atlanta, please keep in touch and I hope we'll be meeting up again at a future conference.
Recent Posts
- Introducing the Swiz [URLMapping] Metadata Processor
- Skinning MinimalComps with Degrafa
- Using MXML without Flex (Example and Source)
- Here’s 5 3D Layouts for Flex 4
- OpenFlux Independant From Flex
Categories
- 360Flex
- Anywhere.FM
- Club Penguin
- DataGrid
- Degrafa
- Disney
- Flex
- FluxCharts
- Google AdSense
- MinimalComps
- MXML
- MySQL
- OpenFlux
- PayPal
- PlexiGlass
- SEO
- Uncategorized