[skitzer]

I need to create a selection rectangle on the stage that works as such:

1. Mouse down on stage activates mouse move
2. As the mouse moves, a rectangle is drawn
3. Mouse up highlights all objects that are within the boundaries of the rectangle


I have parts 1 and 2 working fine, but have been unable to think of an effective way to do part 3. All I can think of is to loop through all items on the stage and check if their positions are within the boundaries of the selection rectangle, but that seems really inefficient to me. Does anyone know a better way to do this?

Thanks in advance.

[Scottae]

I don't think there is any easy way to do it. There is nifty getObjectsUnderPoint method, but that doesn't help you. You can use the methods of the Rectangle class to help your determine if an objects x and y are within your selection area. Specifically the contains method. Or you can use the getBounds method to get the bounding rectangle for the object and then pass it off to the containsRect method.

[skitzer]

Okay...I'm not quite sure what you mean regarding either of those options, but I'll look into it.

I thought about the hitTestObject method, but I don't think that helps me much either.

[skitzer]

A bit late, but thought I'd share my solution. I added ENTER_FRAME listeners for every object and in the handler, I check if there was a collision with hitTestObject. It works...not sure of a better solution.

[Scottae]

That's not a good option for a couple of reasons:

1. Having enter frame performing a hittest on all objects is going to throttle the CPU. Maybe not with one or two items, but having many doing it will.
2. You have to put that enter frame on all objects. That is a hassle to keep up with. What happens if you forget?

You only want to highlight items once you release the mouse. Here's a quick example. (You need some items on stage to test):

Actionscript:

var glow:GlowFilter = new GlowFilter(0xFFFF00, 1, 16, 16, 5);

var rect:Rectangle = new Rectangle();

stage.addEventListener(MouseEvent.MOUSE_DOWN, mouseDownHandler);
stage.addEventListener(MouseEvent.MOUSE_UP, mouseUpHandler);

function mouseDownHandler(event:MouseEvent):void {
	rect.left = mouseX;
	rect.top = mouseY;
	trace(rect);
}

function mouseUpHandler(event:MouseEvent):void {
	rect.right = mouseX;
	rect.bottom = mouseY;
	trace(rect);
	highlight();
}

function highlight():void {
	var max:int = this.numChildren;
	for(var i:int = 0 ; i < max; i++) {
		var displayObject:DisplayObject = this.getChildAt(i);
		var bounds:Rectangle = displayObject.getBounds(this);
		var contained:Boolean = rect.containsRect(bounds);
		if(contained) {
			trace(displayObject.name, "is in rect");
			displayObject.filters = [glow];
		}
	}
}

[skitzer]

Yeah, I definitely agree with your points, especially the first one. I hated to do it but couldn't think of another way. I made it so I wouldn't "forget" to turn on the listener...all my objects are added at runtime and are custom classes, so their parent class turns on the listener.

Anyway, thanks a lot, Scottae. I'll try it out, but one question...my selection utility is actually a class that extends Sprite and the rectangle is drawn with drawRect....I see the containsRect method works with two rectangles in mind. How do I account for that with my set up?

[Annagyijjk]

That's good to hear, hopefully the process isn't too painful.