Sometimes, though, Flex just won't let me have things my way. I almost always want a chart legend to be centered and the legend items rendered horizontally, so I'll wrap a Legend control in an HBox like this:
<mx:HBox width="100%" horizontalAlign="center" >
<mx:Legend dataProvider="{theChart}" direction="horizontal" />
</mx:HBox>
This has worked for me 99% of the time. The other 1% of the time, no matter how I configured my mxml, Flex would render my chart legend vertically. The problem took a while to figure out, but the solution was simple.
In the Legend class, calcColumnWidthsForWidth gets called twice, once with preferredWidth and again with unscaledWidth. For some reason, the unscaledWidth is Math.floor(preferredWidth). The problem with that is calcColumnWidthsForWidth has calculated the layout for the larger value, and now we've just taken away up to 0.99 pixels of the space it was counting on. For example, Flex might calculate that it needs a width of 914.32 pixels to lay out the legend items horizontally, but in another calculation, it thinks only 914 is available, so it will lay out the legend items vertically instead.
To get around this, extend the Legend class, override the measure function and round up the preferredWidth. Since we don't have access to preferredWidth, do this to measuredWidth to achieve the same effect:
override protected function measure():void {
super.measure();
measuredWidth = Math.ceil(measuredWidth);
}
