1 Reply Latest reply on Nov 20, 2009 9:09 PM by Gregory Lafrance

    Actionscript 3 in Flex 3 Panel

    Pappajosh

      Forgive me, I'm fairly new to actionscript 3.

       

      I have some could that works fine in Flash and runs perfectly, as it does not affect any of the MXML.

       

      package
      {
           import com.friendsofed.isometric.DrawnIsoBox;
           import com.friendsofed.isometric.DrawnIsoTile;
           import com.friendsofed.isometric.IsoUtils;
           import com.friendsofed.isometric.Point3D;
           
           import flash.display.Sprite;
           import flash.display.StageAlign;
           import flash.display.StageScaleMode;
           import flash.events.MouseEvent;
           import flash.geom.Point;
      
           [SWF(backgroundColor=0xffffff)]
           public class DepthTest extends Sprite
           {
                private var world:Sprite;
                private var objectList:Array;
                
                public function DepthTest()
                {
                     stage.align = StageAlign.TOP_LEFT;
                     stage.scaleMode = StageScaleMode.NO_SCALE;
                     
                     world = new Sprite();
                     world.x = stage.stageWidth / 2;
                     world.y = 100;
                     addChild(world);
                     
                     objectList = new Array();
                     
                     for(var i:int = 0; i < 20; i++)
                     {
                          for(var j:int = 0; j < 20; j++)
                          {
                               var tile:DrawnIsoTile = new DrawnIsoTile(20, 0xcccccc);
                               tile.position = new Point3D(i * 20, 0.1, j * 20);
                               world.addChild(tile);
                               objectList.push(tile);
                          }
                     }
                     sortList();
                     world.addEventListener(MouseEvent.CLICK, onWorldClick);
                }
                
                private function onWorldClick(event:MouseEvent):void
                {
                     var box:DrawnIsoBox = new DrawnIsoBox(20, Math.random() * 0xffffff, 20);
                     var pos:Point3D = IsoUtils.screenToIso(new Point(world.mouseX, world.mouseY));
                     pos.x = Math.round(pos.x / 20) * 20;
                     pos.y = Math.round(pos.y / 20) * 20;
                     pos.z = Math.round(pos.z / 20) * 20;
                     box.position = pos;
                     world.addChild(box);
                     objectList.push(box);
                     sortList();
                }
                
                private function sortList():void
                {
                     objectList.sortOn("depth", Array.NUMERIC);
                     for(var i:int = 0; i < objectList.length; i++)
                     {
                          world.setChildIndex(objectList[i], i);
                     }
                }
           }
      }
      
      

       

      I'm working on creating a basic Isometric game, currently when this is run in flash 3 or flex 3 (in a Actionscript project - not MXML project) it looks like just some tiles, which is what I would like.

       

      However, I'm trying to get this code to be placed within a Panel so I can organize it better. Every time it doesn't not appear when loaded, but once again the AS3 is perfectly fine.

       

      So how do I got about placing this AS3 code in a MXML container like a panel?

       

      Thank you

        • 1. Re: Actionscript 3 in Flex 3 Panel
          Gregory Lafrance Level 6

          If this post answers your question or helps, please mark it as such.

           

          Sprites cannot be added directly to the stage. You need to wrap them in a UIComponent.

           

          ----- DepthTest.as -----

          package
          {
            import flash.display.Sprite;
            import flash.text.TextField;
            
            public class DepthTest extends Sprite{
              public function DepthTest(){
                this.graphics.beginFill(0xFFCC00);
                this.graphics.drawCircle(30, 30, 30);
                var label:TextField = new TextField();
                label.width = 200;
                label.text = "They call me mellow yellow...";
                label.x = 20;
                label.y = 20;
                this.addChild(label);
              }
            }
          }
          
          

           

          ----- MainApp.mxml -----

          <?xml version="1.0" encoding="utf-8"?>
          <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
            creationComplete="init();">
            <mx:Script>
              <![CDATA[
                import mx.core.UIComponent;
                import DepthTest;
                
                private function init():void{
                  var uic:UIComponent = new UIComponent();
                  var dt:DepthTest = new DepthTest();
                  uic.addChild(dt);
                  myPanel.addChild(uic);
                }
              ]]>
            </mx:Script>
            <mx:Panel id="myPanel" width="100%" height="100%"/>
          </mx:Application>