Dealing with automatic adding scrollbars

Question

Hello, everybody.

I have such problem: I'm creating a container and it's content at runtime. Here's a rough structure:

--VBox

----Form

-------FormItem

...

-------FormItem

----ControlBar

I have fixed maxHeights for the form container to keep it in bounds of screen. But when I get vertical scrollbar, the horisontal also appears (seems like it's not enough place for this VScrollBar).

To escape this problem, I've created a listener for horisontal scroll appearing, so if it appears, I'll increase container a bit, so it would feet the other scrollbar normally:

form.addEventListener(Event.ADDED, function(event:Event):void{
if(event.target is HScrollBar){
    while(form.horizontalScrollBar && form.horizontalScrollBar.visible && !(form.width > form.maxWidth)){
        form.width += 10;
        form.validateDisplayList();
    }
}
});

I've tried also validateNowand other similar methods. What I have here: 1. The HScrollBar is being added. 2. We increase a bit the width of container, so it disappears. 3. When it disappears, the validating throws the null-pointer exception when it tries to measure the non-existing scrollbar. I've also tried to add validateProperties before validation, but it didn't worked either.

Can anyone help to get rid of this annoying scroll? :)

Answer 1

The problem is - if your scrollPolicy is set to auto Flex does not take scroll dimensions into consideration while calculating layout. So when scroll appears it is displayed over the content that it's already there. And when the content is hidden by the scroll a horizontal scroll appears so all content can be accessed via scrolling. The way I usually deal with that is to always set paddingRight (or right when parent is Canvas) style property to 20 (scroll usual width is 16) so when the scroll appears it doesn't overlap anything.