handles and selection box not showing

[Louissi 0 Likes (Newbie)]

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?

[GreenSock 18,577 Likes (Superhero)]

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.

[Louissi 0 Likes (Newbie)]

I sent you a PM, I need your email.

[MediaDave 0 Likes (Newbie)]

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!

[GreenSock 18,577 Likes (Superhero)]

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

[GreenSock 18,577 Likes (Superhero)]

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/

[pbsjburgess 0 Likes (Newbie)]

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.

[GreenSock 18,577 Likes (Superhero)]

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/

[pbsjburgess 0 Likes (Newbie)]

That fixed the problem. Fantastic! Thanks!