Share Posted September 22, 2010 Hi. I just bought TransformManager. I am working on a flex project. The project is a map editor. In my map editor, there is a component to create and manage objects. These objects are visual objects. I have an object viewer, that is a simple .as class. This class is loading an external swf, creating a movie clip and displays it. My goal is to be able to scale and move the loaded mc, instead of having to enter its coordinates manually. Here are some screenshots of the project: http://screencast.com/t/NWU1YjQxZ http://screencast.com/t/NmU3MTNhZD http://screencast.com/t/MzllN2Qw Here is the code of the component containing the viewer.as (ObjectViewer.mxml) <?xml version="1.0" encoding="utf-8"?> xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/mx" width="100%" height="100%"> And here is the viewer.as class (viewer.as) package net.louissi.Conflict.ObjectViewer { import com.greensock.transform.TransformManager; import flash.display.MovieClip; import flash.display.Sprite; import flash.geom.Rectangle; import mx.controls.SWFLoader; import mx.events.ResizeEvent; import net.louissi.Conflict.dataObjects.VisualObjectData; import net.louissi.Conflict.utils.Data; import net.louissi.Conflict.visual.VisualObject; public class Viewer extends Sprite { public function Viewer(loader:SWFLoader) { super(); this.loader = loader; this.content = loader.content as MovieClip; gridSpacing = 25; scale = 1; objectDisplay = new MovieClip(); limits = new MovieClip(); this.content.addChild(objectDisplay); this.content.addChild(limits); this.content.mask = limits; transformManager = new TransformManager(); /* transformManager.allowDelete = false; transformManager.allowMultiSelect = false; transformManager.forceSelectionToFront = false; transformManager.arrowKeysMove = false; transformManager.autoDeselect = true;*/ //render background and stuff drawWindow(); } public function updateObjectTransform(data:VisualObjectData):void{ if(objectClip){ objectClip.scaleX = data.scale; objectClip.scaleY = data.scale; objectClip.x = -data.centerX; objectClip.y = -data.centerY; } objectDisplay.x = centerX; objectDisplay.y = centerY; } public function resetObjectTransform():void{ if(objectClip){ objectClip.scaleX = 1; objectClip.scaleY = 1; objectClip.x = 0; objectClip.y = 0; } objectDisplay.x = centerX; objectDisplay.y = centerY; } public function loadObject(data:VisualObjectData,canTransform:Boolean = false):void{ resetObjectTransform(); if(objectClip){ objectDisplay.removeChild(objectClip); objectClip.destroy(); } //deal with the transform tool transformManager.removeAllItems(); objectClip = new VisualObject(data); objectDisplay.addChild(objectClip); updateObjectTransform(data); if(canTransform){ transformManager.addItem(objectClip); } } public function unLoad():void{ if(objectClip){ objectDisplay.removeChild(objectClip); objectClip.destroy(); } objectClip = null; } public function setScale(scale:Number):void{ this.scale = scale / 100; drawWindow(); } private function drawWindow():void{ w = loader.width; h = loader.height; centerX = w / 2; centerY = h / 2; content.graphics.clear(); limits.graphics.clear(); drawBackground(); drawObject(); } public function resizedWindow(e:ResizeEvent):void{ w = loader.width; h = loader.height; centerX = w / 2; centerY = h / 2; drawBackground(); drawObject(); } private function drawGrid():void{ var i:int; //draw the grid // --- > var spacing:Number = gridSpacing*scale; content.graphics.lineStyle(1,0xCCCCCC,1); for (i = centerX + spacing; i < w; i += spacing){ content.graphics.moveTo(i,0); content.graphics.lineTo(i,h); } // < --- for (i = centerX - spacing; i > 0; i -= spacing){ content.graphics.moveTo(i,0); content.graphics.lineTo(i,h); } // up for (i = centerY - spacing; i > 0; i -= spacing){ content.graphics.moveTo(0,i); content.graphics.lineTo(w,i); } // down for (i = centerY + spacing ; i < h; i += spacing){ content.graphics.moveTo(0,i); content.graphics.lineTo(w,i); } //draw the center cross content.graphics.lineStyle(1,0xEEEEEE,1); content.graphics.moveTo(centerX,0); content.graphics.lineTo(centerX,h); content.graphics.moveTo(0,centerY); content.graphics.lineTo(w,centerY); } private function drawBackground():void{ content.graphics.clear(); //update the background content.graphics.beginFill(0xAAAAAA,1); content.graphics.drawRect(0,0,w,h); content.graphics.endFill(); //update the object mask limits.graphics.clear(); limits.graphics.beginFill(0xAAAAAA,1); limits.graphics.drawRect(0,0,w,h); limits.graphics.endFill(); drawGrid(); } private function drawObject():void{ objectDisplay.x = centerX; objectDisplay.y = centerY; objectDisplay.scaleX = scale; objectDisplay.scaleY = scale; } private var transformManager:TransformManager; private var limits:MovieClip; private var objectClip:VisualObject; private var objectDisplay:MovieClip; private var objectData:MovieClip; private var gridSpacing:Number; private var centerX:Number; private var centerY:Number; private var scale:Number; private var w:Number; private var h:Number; private var zoom:Number; private var content:MovieClip; private var loader:SWFLoader; } } My problem is that the handles are not showing on the clip. I can move it around but thats it. I know there is a flex manager version of the transform tool, but it seems to only accept flex components as items. Any idea how to make it all work? Link to comment Share on other sites More sharing options...
Share Posted September 22, 2010 Could you e-mail or PM me an exported Flex project so that I can simply publish it and see the issue? I tried your code, but was missing the VisualObjectData class (at least). It doesn't need to be your production files - just something simple that reproduces the issue. Link to comment Share on other sites More sharing options...
Author Share Posted September 22, 2010 I sent you a PM, I need your email. Link to comment Share on other sites More sharing options...
Share Posted September 28, 2010 I just bought the component and have exactly the same issue. 1) .as class 2) Wrapped in a Flex project 3) Shows move cursor and allows for movement, but 4) Doesn't show handles and selection box Let me know what helped Louissi or if you would like me to send my source. Thank you so much! Link to comment Share on other sites More sharing options...
Share Posted September 28, 2010 Yes, please send me your source. Louissi wasn't able to send an example and I couldn't reproduce the issue. If I have a simple example that I can compile and see the problem, that would be a huge help in troubleshooting Link to comment Share on other sites More sharing options...
Share Posted September 28, 2010 Aha! Thanks for sending the sample. It helped me diagnose the issue relatively quickly. The problem was caused by the fact that Adobe decided to change the way children are added to DisplayObjectContainers in Spark components (Flex 4 only). Instead of remaining consistent with addChild()/removeChild()/setChildIndex(), they force the use of new addElement()/removeElement()/setElementIndex() methods. Yet another reason I'm not a fan of the Flex framework. Unbelievable. Anyway, I just updated TransformManager by adding conditional logic to sniff out whether the parent is a spark component or not. That seemed to fix the issue in your sample project. Thanks again for providing the files that helped diagnose things. Log into your GreenSock account to get the latest version: http://www.greensock.com/account/ Link to comment Share on other sites More sharing options...
Share Posted November 28, 2011 I'm seeing the same issue in a Flex 4.1 project. I'm trying to transform a Sprite nested inside of a parent Sprite. The parent Sprite is a child of a UIComponent. I have attached a sample MXML file that can be used to reproduce the issue. Link to comment Share on other sites More sharing options...
Share Posted November 28, 2011 Thanks for posting that example - very helpful. It looks like it's another bug in the Flex framework that causes raw UIComponents inside other raw UIComponents not to display properly, but I just posted an update that should work around that issue. Please download it and let me know if it works well for you. https://www.greensock.com/account/ Link to comment Share on other sites More sharing options...
Share Posted November 29, 2011 That fixed the problem. Fantastic! Thanks! Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now