OpenFlux: Tree and TreeDataGrid Components (view source enabled)
Ok, so after getting a working OpenFlux DataGrid component I decided the next obvious step is to try and build a TreeDataGrid component. Although there is still more work to be done, I spent a few hours last night and was able to get a Tree and TreeDataGrid component working. There are definitely still bugs (don't even try sorting the DataGrid hint hint) but it's a great start.
The best part is 100% of the code from the Tree and DataGrid components were re-used for the TreeDataGrid. In fact, the TreeDataGrid isn't even a separate component, it's just a new view for the regular OpenFlux DataGrid.
I think this really shows off where OpenFlux's architecture shines. Moving the logic in to separate controllers allows you to easily mix and match functionality to build any component you desire quickly. If the Flex SDK was written in a similar way the AdvancedDataGrid wouldn't have had to be written from scratch.
Over the next couple weeks I plan on fixing the remaining issues and at that point I'll switch to blogging on how to use all this new functionality to build some really cool 3D components (OpenFlux/Plexiglass).
Feel free to view the source and post any feedback you have in the comments.
OpenFlux: Custom Expanding DataGridRow (view source enabled)
The current project I'm on in the mockups shows a DataGrid component that requires the ability to expand the row height to show more details on the selected item. Although this sounds simple to do, the Flex DataGrid component is a beast and if this isn't something you've been tasked before you're probably scratching your head on how to get started.
After our conversation on different possible ways to approach this task, I wondered how easy this would be to do with the OpenFlux DataGrid. My solution is simply a custom view for the DataGridRow that expands the height based on mouse over/selection.
I've included an example below with view source enabled.
OpenFlux DataGrid Component (with view source)
I previously wouldn't have even thought of developing my own DataGrid component from scratch but with OpenFlux's help it's super easy (Or at least easy enough to want to attempt it). Over the last couple days I've spent my spare time developing an extremely flexible DataGrid component and if you view source, compared to the standard Flex DataGrid, you'll see there isn't a lot of code behind it.
The component is actually a grouping of multiple sub components including DataGridColumn, DataGridHeader, DataGridRow, DataGridCell which all extend either List or ListItem giving instant selection and drag/drop functionality. You can easily hook up your own custom controllers and views to add any functionality you desire.
Be sure to play around with the example below and view source to see how it all works. My only note is I'm having some SVN issues so this isn't yet committed to the OpenFlux project.
OpenFlux + Degrafa = FluxCharts
Last night I started playing around with the new GeometryRepeater/PropertyModifier classes in Degrafa and decided it would be fun to create an OpenFlux chart component. The code consists of a Chart model class (currently just has a data Array property) and 3 mxml views. You can change the view at runtime to a pie, line or column chart.
The app is below with view source enabled. So far the component is really simple and doesn't even have a controller. I plan on developing it further but wanted to show it off at the early stage so you can see how simple it is to get started creating a custom OpenFlux component.
I will be posting updates as I add more functionality. Let me know any ideas you have for what you would like to see.
Customizing the OpenFlux ScrollBar
At the 360|Flex Day 1 Keynote, Mark Anders presented on Flex 4, Thermo and Flash Player 10 (video here). One of his demos was a custom scroll bar that was easily built with Flex 4/Thermo, but complicated with Flex 3. I've created a similar scroll bar using OpenFlux below with view source enabled. You'll be pleased to see how little code is involved. Making use of OpenFlux+Degrafa all customizations were done in MXML with not a drop of AS3 code required.
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