Flex: getting scroll bars on the controls I want and only in viewable area

Question

Flex scroll bars are giving me a really hard time. I want to control exactly which boxes they appear for but after hours of trying random things, my best solution (see below) seems a bit kludgy and unreliable. If I force a scroll bar to appear, (*ScrollPolicy="on") the scroll bar appears disabled, because it spans the entire size of the box, even though that is out of bounds of the viewable area.

I have this one box at the top of the page that runs off the side of that screen, and that's fine--let it run off the side and don't give it a scroll bar. But I have this other box which runs off the side, which is also acceptable, but I want scroll bars to serve that region and only that region and I want those scroll bars to appear in the viewable area. That is, I don't want to have to move the horizontal scroll bar so that it will allow me to see the vertical scroll bar.

---

Now the best I could do is as follows: I found the parent of the main box you see in my diagram (which is actually the great-great-grandparent) that never gets bigger than the viewable area, which is an mx:Canvas. Then I force the size of the parent of the box containing my stuff down to the size of the parent mx:Canvas, which then causes the scroll bars to appear where I want. So, it's something like:

<mx:Canvas id="main_canvas" width="100%" height="100%">

a lot of other tags that are parents

  <mx:Box width="100%" height="100%" maxHeight="{main_canvas.height}" maxWidth="{main_canvas.width}"> <!--box containing the box that should show scroll bars-->
    <mx:Box width="100%" height="100%"> <!--box that should show scroll bars-->

the rest of the tags

The above tags are an abstraction, btw. Due to the enormous number of experiments I've conducted trying to get the scroll bars where I want them, there's a very tall hierarchy of mx:*Boxes, mx:Canvases and even an mx:VDividedBox.

It seems to work, but it's probably needlessly complicated, and I have a feeling that customers will find a way to make it fail.

I'm using the 3.5 SDK.

Answer 1

In the end, the best I could do was wrap whatever I wanted to have scrollbars in an mx:Canvas and then set its maxWidth to a parent component's width that is limited to the width I want, and finally put an mx:Box inside the mx:Canvas. At least, that seemed to work in most cases when controls are vertically stacked and I want a horizontal scrollbar to span the whole width of that mx:Canvas. Usually this was enough and somehow the vertical scrollbar issue sorted itself out, but on a couple of occassions, I had to resort to Flex: getting the height of a collection of controls to calculate the maxHeight of some of the child aggregate controls, which I find a bit kludgy.