How to fix ComboBox dropdown issue in fullscreen?

Short version: ComboBox's dropdown works and renders p开发者_StackOverflowroperly before fullscreen, but not during or after.

I'm not totally sure how to ask this, so I've actually made a page demonstrating the error, with a very simple Flex app, and all three directions you need to experience the problem yourself.

For those of you not daring enough to follow my link above, I'll do my best to explain here. I've built a rather extensive Flex application (not the one in the link) that has some graphs and charts and checkboxes and other controls for those charts. At the bottom of app in a few of the application States, there is a ComboBox (like a <select> tag in HTML). Because this is at the very bottom, when you click it to access it's dropdown menu, Flex thoughtfully has it come out of the top.

This works well until Fullscreen mode. Upon entering fullscreen, I scale everything up with a stage.scaleMode = StageScaleMode.SHOW_ALL. Now when you click on the ComboBox, the dropdown is astonishingly large, and actually drops beneath the ComboBox, causing it to mostly disappear off-screen. The best part is, once you exit fullscreen mode, the dropdown insists on continuing to drop below the ComboBox, which is positioned at the bottom of the app, and so continues to be cut off. Has anyone else run into this beast, stared into it's great maw, and come away victorious?

You can get the code from the View Source in the link, and thank you so much for your time.

---

I have a workaround for a minor part of the problem, plus some details on why the other part of the problem is happening. Maybe someone else can figure out the rest.

First, a General Note

A Flex 3.5 ComboBox uses the following boolean expression (lines 1572-73) to determine whether it should turn its drop down list into a drop up list:

point.y + _dropdown.height > screen.bottom && 
point.y > screen.top + _dropdown.height

where point.y is the global coordinate for the bottom of the ComboBox. Basically, "if it's gonna hit the bottom, and not gonna hit the top, then...". Otherwise, if it is also going to hit the top, then it defaults back to throwing the thing through the floor, as we're seeing in the case at hand. With that in mind...

A Partial Workaround

I was able restore the application to its normal functionality once it exits Full Screen mode by adding the following code into the toggleFullscreen() button handler, when coming out of Full Screen mode:

    ...
    screen.height = height;
    screen.width = width;

    myComboBox.dropdown.invalidateSize(); // myComboBox being the id for the ComboBox
}

Explanation: One thing that was happening (probably an effect of something else) was that the values for the screen property in the systemManager were not getting reset properly. So, when that boolean statement from above was being evaluated, it was still using Full Screen values, and hence kept dropping the list through the floor. This code just manually resets the screen and recalculates the size of the dropdown list.

It's not much, but at least it's something. Otherwise...

Some Details on the Full Screen Problem

I noticed two problems going on here:

1. When that boolean expression from above is evaluated in Full Screen mode, some of the values are scaled while some are not. Namely, point.y and _dropdown.height are unscaled, whereas screen.bottom is scaled (relatively). So, the first part of the expression always comes out false, and thus the ComboBox proceeds to render the list down, even though there really is no room. I have no clue why this is happening, but it is. I tried to no avail to manipulate these values indirectly without adverse consequences, but I also had a feeling that even if I got the expression to evaluate correctly, it wouldn't fix the other problem of...
2. The fact that when the drop down list renders it looks like it's being double scaled. That is, instead of the 3.5 scaling which the ComboBox had on my monitor, the drop down list looked like it had 3.5*3.5 scaling. I didn't get to play too much with this, but I will say that when I manually applied a transformation matrix to unscale the ComboBox, the size at which the drop down list was rendered looked like it matched the original (full screen-scaled) ComboBox. Maybe someone else can mess around with this.

That's as far as I got. I'm not entirely convinced that a solution playing with the transforms won't go anywhere, but if writing your own custom dropDownFactory will solve the problem, I'll at least say I'm pretty sure it'd be less tedious.

Good luck.

---

I had some issues with the dropdown of a CB, seems kind of unrelated, but I had to apply changes directly to the dropdown like myCombo.drowpdown.[insert whatever property] cause it wasn't applying changes made to the combobox to the drop down. Maybe you can try that in your app and see if it helps.