Hi folks,

I'm building my first Flex app, which is a typical simple quiz. Intro state, string of questions, then a result.

I'm stuck right now in that my transitions are not running. I suspect it has something to do with the fact that I extended the Application class and typed my main application mxml file to that class so that I could keep Actionscript separate from MXML in two separate files. The app will switch states successfully but it won't run the transition effects on a state change, and so my endEffect event is not firing...

It may be that I have something else wrong altogether.

Here is the application MXML file:

PHP Code:
<?xml version="1.0" encoding="utf-8"?>
<classes:QuizApplication 
    xmlns:local="*" 
    xmlns:mx="http://www.adobe.com/2006/mxml" 
    xmlns:classes="classes.*"
    layout="absolute" 
    currentState="landingState"
    >
    
    <mx:HTTPService id="questions" url="./data/questions.xml" />
    
    
    <classes:states>
        <mx:State name="landingState"/>
        <mx:State name="landingStateOut" basedOn="landingState"/>
        <mx:State name="question">
            <mx:RemoveChild target="{text1}"/>
            <mx:RemoveChild target="{startButton}"/>
            <mx:AddChild relativeTo="{vbox1}" position="lastChild">
                <local:FormHolderVBox id="formHolder" applicationVO="{applicationVO}" width="348" height="248" />
            </mx:AddChild>
        </mx:State>
        <mx:State name="resultState"/>
        <mx:State name="betweenQuestions1" basedOn="question">
            <mx:RemoveChild target="{formHolder}"/>
            <mx:RemoveChild target="{vbox1}"/>
        </mx:State>
    </classes:states>
    
    <classes:transitions>
        <mx:Transition id="advanceTransition0" fromState="landingState" toState="landingStateOut">
            <mx:Fade
                duration="2000" 
                id="fadeToBetween"
                alphaFrom="1"
                alphaTo="0"
                effectEnd="continueAdvance();"
            />    
        </mx:Transition>        
        <mx:Transition id="advanceTransition1" fromState="question" toState="betweenQuestions" effect="{fadeToBetween}" />        
        <mx:Transition id="advanceTransition2" fromState="question" toState="betweenQuestions">
            <mx:Fade 
                id="fadeToQuestion"
                alphaFrom="0"
                alphaTo="1"
            />    
        </mx:Transition>        

    </classes:transitions>


    <mx:Canvas x="45" y="41" width="392" height="361" id="canvas">
        <mx:VBox x="21" y="47" height="291" width="348" id="vbox1">
            <mx:Text text="Take this quick quiz to find out what type of shopper you are!" width="347" height="40" fontSize="12" id="text1"/>
            <mx:Button label="Start the Quiz" id="startButton"/>
        </mx:VBox>
    </mx:Canvas>
    <mx:Text text="What kind of shopper are you?"  fontSize="21" fontWeight="bold" fontFamily="Arial" x="45" y="41"/>
    
</classes:QuizApplication>
and here is the QuizApplication class:

PHP Code:
package classes
{
    import classes.events.AdvanceEvent;
    
    import flash.events.MouseEvent;
    
    import mx.collections.ArrayCollection;
    import mx.containers.Canvas;
    import mx.controls.Button;
    import mx.core.Application;
    import mx.events.FlexEvent;
    import mx.events.EffectEvent;
    import mx.rpc.events.ResultEvent;
    import mx.rpc.http.mxml.HTTPService;

    public class QuizApplication extends Application
    {
        [Bindable]
        public var startButton:Button;
        
        public var canvas:Canvas;
        
        public var questions:HTTPService;
        
        //[Bindable] ?
        public var questionVOs:ArrayCollection;
        [Bindable]
        public var applicationVO:ApplicationVO;
        
        //CONSTRUCTOR
        public function QuizApplication()
        {
            super();
            this.addEventListener(FlexEvent.APPLICATION_COMPLETE, init);
            // go ahead and create singleton of DataClass to store globals
            applicationVO = new ApplicationVO();
        }
    
        //METHODS
        
        private function init(e:FlexEvent):void
        {
            startButton.addEventListener(MouseEvent.MOUSE_UP, handleStartQuiz);
            questions.addEventListener(ResultEvent.RESULT, handleQuestionData);
            questions.send();
            
            // set up listeners for app business 
            canvas.addEventListener(AdvanceEvent.FORWARD, advanceToQuestion);
            //canvas.addEventListener(AdvanceEvent.BACKWARD, advanceToQuestion);
        //    canvas.addEventListener(AdvanceEvent.CONTINUE, continueAdvance);
            
            // set to start with question 1
            applicationVO.currentQuestion = 0;
            
        }        
        
        
        
        // EVENT HANDLERS
        
        private function handleStartQuiz(e:MouseEvent): void
        {
        //currentState = "question"; // states hard-coded in mxml
        trace("should set state to landingStateOut");
        trace("currentState now is "+currentState);
        currentState = "landingStateOut";
        trace("currentState now is "+currentState);        
        }
        
        private function handleQuestionData(e:ResultEvent): void
        {
            applicationVO.questionVOs = new ArrayCollection();
            
             // loop through XML's ArrayCollections and create an ArrayCollection of QuestionVO's, one for each question in XML
             for each (var question:Object in e.result.questions.question)
            {
                var newVO:QuestionVO = new QuestionVO();
                newVO.questionID = question.id;
            //    trace("question.id is "+question.id);
                newVO.questionText = question.text;
            //    trace("question.text is "+question.text);
                newVO.answers = new ArrayCollection();
                for each (var answer:Object in question.answers.answer)
                {
                    newVO.answers.addItem(answer);
                //    trace("answer is "+answer);
                }
                applicationVO.questionVOs.addItem(newVO);
             } 
//         trace("!!!! dataClass.questionVOs.[2].questionText is "+dataClass.questionVOs[2].questionText); 
//         trace("!!!! dataClass.questionVOs.[2].answers object is "+dataClass.questionVOs[2].answers.toString()); 
        }
        
        private function advanceToQuestion(e:AdvanceEvent):void
        {
            trace("should transition to next question now");
            e.stopImmediatePropagation();    
            if (e.type == "forward")
            {
                //somehow call the transition AdvanceTransition
                applicationVO.currentQuestion++;
                currentState = "betweenQuestions1";
            }
            else
            {
                applicationVO.currentQuestion--;
                currentState = "betweenQuestions1";
            }
        }
        
        public function continueAdvance():void
        {
            trace("should transition now from betweenQuestions2 to question state");
            //currentState = "question";
        }
        
        
    }
} 

Can anyone point out what I've got wrong that could cause the Transitions not to work? I thought they were simply supposed to execute on a state change from A to B, for which you've indicated set up a Transition from state A to B.

Many thanks!