3 Replies Latest reply on Jul 10, 2007 5:43 PM by ntsiii

    Canvas disappears! (A glitch in Flex 2?)

      I've recently been having some problems with Flex2. I have a resizing canvas that holds my main controls. I need an animated background behind the canvas that I want to be loaded from a .swf into an SWFLoader. The thing is, every time I add ANY objects behind the canvas the canvas does NOT appear.

      <?xml version="1.0" encoding="utf-8"?>
      <mx:Application xmlns:mx=" http://www.adobe.com/2006/mxml" layout="absolute" backgroundGradientColors="[#1AB5FF, #1AB5FF]" width="1024" height="100%" creationComplete="MyXML.send()">
      <mx:State name="Home">
      <mx:RemoveChild target="{SplashScr}"/>
      <mx:RemoveChild target="{Enter}"/>
      <mx:SetProperty name="width" value="100%"/>
      <mx:SetProperty name="height" value="100%"/>
      <mx:AddChild position="lastChild">
      <!-- This all works UNLESS a control is added HERE --!>
      <mx:Canvas x="0" y="0" width="100%" height="100%" verticalScrollPolicy="on">
      <mx:Canvas width="842" height="792" backgroundColor="#679BE6" borderStyle="solid" borderColor="#ffffff" borderThickness="8" horizontalCenter="0" y="20" id="Main">
      <mx:Canvas borderStyle="solid" borderColor="#FFFFFF" left="6" top="6" bottom="6" right="6">
      <mx:Spacer id="Spacer1" x="422.5" y="63" width="179" height="20"/>

      <mx:Transition id="Splash" fromState="*" toState="*">
      <mx:Sequence targets="{[SplashScr,Enter]}">
      <mx:Fade duration="10" targets="{[Main]}"
      alphaFrom="0.3" alphaTo="0.3"/>
      <mx:Blur duration="10" targets="{[Main]}"
      blurXFrom="10.0" blurXTo="10.0"
      blurYFrom="10.0" blurYTo="10.0"/>
      <mx:Fade duration="1000" targets="{[SplashScr,Enter]}"
      alphaFrom="1.0" alphaTo="0.0"/>
      <mx:Parallel targets="{[Main]}">
      <mx:Resize duration="1000" targets="{[Main]}"
      heightFrom="42" heightTo="792"
      widthFrom="26" widthTo="842"/>
      <mx:Blur duration="1000" targets="{[Main]}"
      blurXFrom="10.0" blurXTo="0.0"
      blurYFrom="10.0" blurYTo="0.0"/>
      <mx:Fade duration="1000" targets="{[Main]}"
      alphaFrom="0.3" alphaTo="1.0"/>
      <mx:Glow duration="1000" targets="{[Cap1, Cap2, Cap3]}"
      alphaFrom="0.0" alphaTo="1.0"
      blurXFrom="1.0" blurXTo="6.0"
      blurYFrom="1.0" blurYTo="6.0"
      strength="0.6" color="#000000"/>

      import mx.core.UIComponent;
      function init(){
      var s:Shape = new Shape();
      var u:UIComponent = new UIComponent();
      u.addChild( s );
      this.addChild( u );
      var bd:BitmapData = Bitmap( this.theImg.content ).bitmapData;
      s.graphics.beginBitmapFill( bd, null, true );
      s.graphics.drawRect(0,0, 300, 300);
      s.visible = false;

      import flash.utils.Timer;
      import flash.events.TimerEvent;
      import flash.display.Sprite;

      public function TimerExample() {
      var myTimer:Timer = new Timer(1000, 2);
      myTimer.addEventListener("timer", timerHandler);

      public function timerHandler(event:TimerEvent):void {
      Spacer1.y = Main.y + Main.height;


      <mx:SWFLoader source="./Images/SplashVersion2.swf" scaleContent="false" autoLoad="true" width="100%" height="100%" x="0" top="0" id="SplashScr"/>
      <mx:Button x="784" y="554" label="Enter" width="160" height="36" fontFamily="Verdana" fontSize="16" color="#ffffff" cornerRadius="18" fillColors="[#BDD0EC, #2E4885]" borderColor="#ffffff" fillAlphas="[1.0, 1.0]" themeColor="#ffffff" id="Enter" creationCompleteEffect="EnterFadeIn" click="currentState='Home'; TimerExample();"/>

      I've removed most of what I think is irrelevent. My deadline is for the 6th so this has really put me behind schedule.

      ANY help is GREATLY appreciated! :D