Question

I’ve just dropped a TabNavigator into my application:

    <mx:TabNavigator width="100%" height="100%"
        backgroundColor="#F7F7F7">

        <custom:SomeCustomContainer label="Details" />

        <mx:Canvas label="Reporting" width="100%" height="100%">
        </mx:Canvas>

    </mx:TabNavigator>

And when the app first loads, everything seems fine:

everything working http://img.skitch.com/20090818-dimqrp3ghd89fp9eftipafajk3.jpg

Until I click the ‘Reporting’ tab. Then, sometimes, the the rest of the application (that is, everything outside of the TabNavigator) goes white:

alt text http://img.skitch.com/20090818-tgud6797qcx18fwxwkik38nrp9.jpg

Everything seems to go back to normal when Flash is asked to do a redraw (for example, the browser window looses then regains focus).

So, err… Is this normal? Is there some simple way to fix it?

Edit: I’ve tried a variation on Joel’s suggestion:

// Where 'this' is the main Application
ChangeWatcher.watch(this, ["myTabNavigator", "selectedIndex"], function() {
    invalidateDisplayList()
});

And it mostly works… Except for a small portion of the ApplicationControlBar, which remains white:

control bar is still white http://img.skitch.com/20090903-fbif9r67jg9wx1rkiwad7sbey6.png

Answer 1

Setting the historyManagementEnabled property of the TabNavigator to false works for me.