NEW VERSION OF COMPONENT RELEASED HERE
This is a project that I released a while ago when i was keeping the blog at blog.3r1c.net. I've since expanded and want to release it again, as I know people used it, and they may have lost the source.
This component allows you to flow child containers logically in a vertical or horizontal manner. Try to click the buttons inside the container, and watch how they animate to a larger size, and the rest of the items flow gracefully. In the following demo you can also adjust the vertical scroll position, horizontal scroll position, width and height of the container on the fly, and watch all of the children dynamically update.
Here is the source
and
Here is the demo
Feel free to use this in any project you want, but if you do gimme a link in here cuz I'd love to see it in the wild!
Thanks again and feel free to leave comments
Eric
flashape
on Feb 18th, 2009
@ 11:30 am:
Pretty sweet…it gets a little jumpy here and there, I think maybe using a different resize effect besides bounce would make it smoother.
eric
on Feb 18th, 2009
@ 11:35 am:
Right, I just wanted to illustrate that even if you used a bounce effect the others would flow gracefully regardless.
Thanks for the comment!
A Different Eric.
on Feb 21st, 2009
@ 1:06 am:
Thank you for posting this again. I went to get it last week and spent way too long trying to get this component from the defunct 3r1c.net.
Like any number of folks, I wanted the component to resize based on the size of the components — to increase or decrease in size, rather than simply “scroll” or “not scroll”, so I naively made two changes that seem to work:
1. In FlowContainer.mxml, change the width and height binding for the “fc” component to “minWidth” and “minHeight”, respectively.
2. In FlowContainer.as, add this code to the end of updateDisplayList:
if(_direction == FlowContainerLayout.HORIZONTAL)
height = child.y + child.height + getStyle(”paddingBottom”);
else
width = child.x + child.width + getStyle(”paddingRight”);
I haven’t done much in the way of robustness testing or anything, but if I’m using my FlexBuilder profiler correctly, it doesn’t affect the execution time much (presumably since the size is invalidated when the components are positioned differently, anyway)… and it seems to work with the FlowContainer example.
Have you or anyone else figured out a solution to the dynamically resizing flow-layout container?
Thanks again.
Eric G. (A different Eric)
eric
on Feb 21st, 2009
@ 9:06 pm:
@ (other) Eric - My intention was that if anyone wanted this to happen they’d implement the code themselve to do so. The purpose of this component was to take a % or absolute width and height and flow based upon that, rather than dynamically resizing based on content. Just like any other component in the framework, you can use it’s inherent properties to get what you need done (as I’ve seen you have done) I’m glad the component has been useful to you, and feel free to email me with more questions @ eric@appdivision.com if you feel to.
Hillel Coren
on Apr 27th, 2009
@ 2:50 am:
I just wanted to say thank you. I’m working on a multi-select AutoComplete component (http://hillelcoren.com/2009/04/07/flex-autocomplete-version-0981/) and I’ve just incorporated your container. I was initially using the ToolBar class but was having all sorts of issues. Using your container instead instantly fixed everything.
Thanks!!