[flexcoders] Screen Flicker Between States Issue

[David Terry]

Hi Guy,

Well my application UI development is moving along slowing, but at least
it is going somewhere.  Seems like anything I want to do I need to spend
a few hours reading first.

I don't understand why I am getting a screen flicker between states.  

Moving from the login, to register, to main state works correctly.  But
when I am on the main state and move to the 'first' basedOn state
(either one does this and it is only on the first time) I get a screen
flicker.

Where am I going wrong?

Many thanks,
~David T.


Here is my app...

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml";
layout="absolute"       xmlns:comp="assets.components.*"
currentState="Login">

        <mx:Style source="../assets/css/main.css"/>
        
        <mx:states>
                <mx:State name="Register">
                        <mx:AddChild position="lastChild">
                                <comp:signup1 horizontalCenter="0"
verticalCenter="0" addedEffect="Fade" styleName="myAppBar"/>
                        </mx:AddChild>
                </mx:State>
                <mx:State name="Login">
                        <mx:AddChild position="lastChild">
                                <comp:login horizontalCenter="0"
verticalCenter="0" addedEffect="Fade">
                                </comp:login>
                        </mx:AddChild>
                </mx:State>
                <mx:State name="Main">
                        <mx:AddChild position="lastChild">
                                <mx:Canvas x="0" y="-1" width="100%"
height="100%" id="canvas1" creationCompleteEffect="Fade">
                                        <mx:ApplicationControlBar
height="60" styleName="myMainAppBar" width="100%" x="0" y="0">

                                                <mx:HBox width="50%"
height="100%" horizontalAlign="left" verticalAlign="middle">
                                                        <mx:Image
source="assets/images/ops_icon.gif" autoLoad="true"
scaleContent="false"/>
                                                        <mx:Label
text="Online Publishing System" styleName="myMainTitleStyle"/>
                                                </mx:HBox>
                                                <mx:HBox width="50%"
horizontalAlign="right" verticalAlign="middle" height="100%">
                                                        <mx:Label
text="Version 1.0.0.0" styleName="myVersionStyle"/>
                                                </mx:HBox>
                                        </mx:ApplicationControlBar>
                                        <mx:ApplicationControlBar
width="100%" height="63" styleName="myMainAppBar" horizontalCenter="0"
bottom="-10">
                                        </mx:ApplicationControlBar>
                                        <mx:Accordion x="10" y="78"
width="200" height="200">
                                                <mx:Canvas
label="Campaign" width="100%" height="100%">
                                                        <mx:LinkButton
x="10" y="10" label="Start New Campaign" id="linkbutton1"
click="currentState=&quot;Pub_Wiz_1&quot;"/>
                                                        <mx:LinkButton
x="10" y="40" label="LinkButton" id="linkbutton2"/>
                                                </mx:Canvas>
                                        </mx:Accordion>
                                </mx:Canvas>
                        </mx:AddChild>
                </mx:State>
                <mx:State name="Pub_Wiz_1" basedOn="Main">
                        <mx:AddChild relativeTo="{canvas1}"
position="lastChild">
                                <comp:pub_wiz_1 x="218" y="78"
addedEffect="Fade">
                                </comp:pub_wiz_1>
                        </mx:AddChild>
                        <mx:SetEventHandler target="{linkbutton2}"
name="click" handler="currentState=&quot;Pub_Wiz_2&quot;"/>
                </mx:State>
                <mx:State name="Pub_Wiz_2" basedOn="Main">
                        <mx:AddChild relativeTo="{canvas1}"
position="lastChild">
                                <comp:pub_wiz_2 x="218" y="78"
addedEffect="Fade">
                                </comp:pub_wiz_2>
                        </mx:AddChild>
                        <mx:SetEventHandler target="{linkbutton2}"
name="click" handler="currentState=&quot;Pub_Wiz_1&quot;"/>
                </mx:State>
        </mx:states>

</mx:Application>