All Flex components disappear when the canvas height scale over the limit

Question

Using Flex 3, I had created a employer profile application where I could view 10 profiles in a page using repeater, however, when I tried to load 20 profiles in a page, all of the component go haywire, became non-function.

It would not happen if I set the application height to 100% but due to native scrollbar requirement, I use Swffit to enable web browser scrollbar and hide the Flex scrollbar and set the height of the flex application with exact viewable contents in pixel.

How do I solve the canvas height issue?

Answer 1

Have you tried placing the Canvas inside of some other container with an explicit height? That might be all you need.

eg:

<mx:VBox
    id                    = "theFakeContainer"
    verticalScrollPolicy  = "off"
    height                = "{EXPLICIT HEIGHT}"
>
    <mx:Canvas
        id                    = "theRealCanvas"
        verticalScrollPolicy  = "off"
        height                = "100%" />
</mx:VBox>

I'm not sure if this will work, but it seems like it is worth a try.

Answer 2

I have this part of the code as you have shown me.

I was think of creating a custom components with canvas and loop with the repeater or another idea is that I might use one of the working solution I have just thought of it to overcome the issue.