Today someone asked on flexcoders if you can make the Panel component dock the ControlBar component to the top of the Panel instead of the bottom of the Panel. The short answer is no, you can’t. The longer answer is you can extend Panel and make a few minor adjustments and then yes, you can.
Here’s an extension of the Panel class that allows you to specify a new property: controlBarPosition, which can either be “top” or “bottom”.
The one caveat about this class is that if you set the control bar to be placed at the top, you should set the roundedBottomCorners style of the Panel to false. Otherwise the bottom corners of the control bar will be drawn rounded as well, which looks kind of weird if they’re not at the bottom of the panel (if you’re curious why take a look at the source of mx.skins.halo.HaloBorder, around line 470).
Or you could just use an ApplicationControlBar… a use for which the ApplicationControlBar was intended. 😉
Great work however.
hmm, using an ApplicationControlBar and docking it to the top of a Panel? I know an ApplicationControlBar is supposed to dock to the top of an Application, but I don’t think you can get it to dock to the top of a Panel. Let me know if I’m wrong.
Nope, ApplicationControlBar goes to the bottom of a panel.
Yep. In order to get an ApplicationControlBar to dock to the top of a panel I would stick it in a VBox. Until now 🙂
Ah yes… I stand corrected… for which I apologize. You would need to put the AppplicationControlBar within a VBox to do what I was trying to describe. Good catch.
Hi! I’ve tried to use your component, but I have errors in flex3:
1178: Attempted access of inaccessible property controlBar through a reference with static type com.dougmccune.controls:ExtendedPanel.controls. ExtendedPanel.as line 59
As a beginner I can only guess what’s wrong 😉
“private var controlBar:ControlBar;” delete the error, but the ControlBar doesn’t work properly at the top.
Hi
I had the same problem as kasztan …
tnx for the contribution though
greetz
P
I’ve posted the code that I extend Doug’s code to work with Flex3. Seems like calculation / instantiation of viewMetrics changed in Flex3 and that’s what preventing this code not to display properly. Check it out here: http://www.myot.ca/blog/2008/01/05/extended-panel-richtexteditor-ability-to-dock-controlbar-on-the-top/
Pingback: Extending Flex Panel With ActionScript | dougrdotnet
Pingback: SOG knives