Need some help completing a bumptop-ish selection tool - actionscript-3

I'm in the midst of creating a Bumptop styled selection tool. Right now I got as far as creating the tool itself (which actually works pretty good) and spreading some random square items on the stage. This is the class that creates the selection tool :
package com.reyco1.medusa.selectiontool
{
import flash.display.Sprite;
import flash.events.Event;
import flash.events.MouseEvent;
import flash.geom.Point;
public class SelectionBase extends Sprite
{
private var points:Array = [];
public function SelectionBase()
{
super();
addEventListener(Event.ADDED_TO_STAGE, initialize);
}
private function initialize(e:Event):void
{
removeEventListener(Event.ADDED_TO_STAGE, initialize);
points.push(new Point(mouseX, mouseY)); stage.addEventListener(MouseEvent.MOUSE_MOVE, handleMouseMove);
}
private function handleMouseMove(e:MouseEvent):void
{
graphics.clear();
graphics.beginFill(0x33CCFF, .5);
graphics.drawCircle(0, 0, 20);
graphics.endFill();
graphics.moveTo(0, 0);
graphics.lineStyle(1.5, 0x33CCFF, .5);
graphics.lineTo(mouseX, mouseY);
points.push(new Point(mouseX, mouseY));
graphics.beginFill(0x33CCFF, .1);
graphics.moveTo(points[0].x, points[0].y);
for (var i:uint = 1; i < points.length; i++)
{
graphics.lineTo(points[i].x, points[i].y);
}
graphics.lineTo(points[0].x, points[0].y);
graphics.endFill();
dispatchEvent(new Event("UPDATE"));
}
public function clear():void
{
stage.removeEventListener(MouseEvent.MOUSE_MOVE, handleMouseMove);
graphics.clear();
}
}
}
And this is the document class that implements it :
package
{
import com.reyco1.medusa.selectiontool.SelectionBase;
import flash.display.Sprite;
import flash.events.Event;
import flash.events.MouseEvent;
import flash.display.StageAlign;
import flash.display.StageQuality;
import flash.display.StageScaleMode;
[SWF(width = '1024', height = '768', backgroundColor = '0x000000')]
public class SelectionToolPrototype extends Sprite
{
private var selectionTool:SelectionBase;
public function SelectionToolPrototype()
{
stage.align = StageAlign.TOP_LEFT;
stage.scaleMode = StageScaleMode.NO_SCALE;
stage.quality = StageQuality.MEDIUM;
stage.addEventListener(MouseEvent.MOUSE_DOWN, handleDown);
stage.addEventListener(MouseEvent.MOUSE_UP, handleUp);
placeShapesRandomly();
}
private function placeShapesRandomly():void
{
for(var a:Number = 0; a<25; a++)
{
var s:Sprite = new Sprite();
s.graphics.beginFill(Math.random() * 0xCCCCCC);
s.graphics.drawRect(0, 0, 50, 50);
s.graphics.endFill();
s.x = Math.floor(Math.random() * 900 - 40) + 40;
s.y = Math.floor(Math.random() * 700 - 40) + 40;
s.rotation = Math.floor(Math.random() * 360 - 40) + 40;
s.buttonMode = true;
addChild(s);
}
}
private function handleUp(e:MouseEvent):void
{
selectionTool.removeEventListener("UPDATE", handleToolUpdate);
removeChild(selectionTool);
selectionTool = null;
}
private function handleDown(e:MouseEvent):void
{
selectionTool = new SelectionBase();
selectionTool.addEventListener("UPDATE", handleToolUpdate);
selectionTool.x = mouseX;
selectionTool.y = mouseY;
addChild(selectionTool);
}
private function handleToolUpdate(e:Event):void
{
// logic to determin if items are within selection goes here
}
}
}
I've tried using collision detection by means of BitmapData and even using collision libraries like CDK but I cant get anything to work. Anybody have an idea what I should use in the handleToolUpdate(e:MouseEvent); ? Thanks!
Update:
I'll break it down. Basically I am trying to create a prototype of the BumpTop Lasso or Selection tool.
I need help in finding out which objects either collide or have a point within the bounds of the drawn lasso.
I have upload what I have so far to my server here : http://labs.reyco1.com/bumptop/SelectionToolPrototype.html. You can see the source by right clicking and selecting "View Source".
Like I said in my earlier post, I tried using Bitmapdata collision testing and even tried using the Collision Detection Kit to no avail. Thanks in advance.

Loop through the display object you are attaching your random sprites to, and using for each, check their value of hitTestObject against your selectionTool instance.
Here are the Adobe docs for hitTestObject():
http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/flash/display/DisplayObject.html#hitTestObject%28%29

Related

AS3: Why is this fluid simulation running slower and slower?

I'v got 2 classes. Simulating fluid. Both classes are pretty straight forward and short, but after 2 seconds of running, the simulation gets really slow, looks like a memory leak. But i can't see any leaks in this code.
Please let me know if you can figure out, why this is happening?
FluidLayer.as
package {
import flash.display.Sprite;
import flash.events.MouseEvent;
import flash.display.BitmapData;
import flash.filters.BlurFilter;
import flash.display.Bitmap;
import flash.geom.Point;
import flash.geom.ColorTransform;
import flash.display.IBitmapDrawable;
import flash.events.Event;
import flash.display.MovieClip;
public class FluidLayer extends MovieClip {
private var canvas:Sprite;
private var b:Bitmap;
private var blur:BlurFilter = new BlurFilter(20,20,3);
private var bmd1:BitmapData;
public function FluidLayer() {
canvas = new Sprite();
for(var i:int = 0;i < 600;i++){
var p:Particle = new Particle();
canvas.addChild(p);
p.x = stage.stageWidth * Math.random();
p.y = stage.stageHeight* Math.random();
p.initi(stage);
}
canvas.filters = new Array(blur);
addEventListener(Event.ENTER_FRAME, render);
}
private function render(e:Event):void{
remove();
b = new Bitmap(makeFluid(canvas),"auto", true);
b.alpha = 0.7;
addChild(b);
}
private function makeFluid(o:Sprite):BitmapData{
bmd1 = new BitmapData(stage.stageWidth, stage.stageHeight, true);
bmd1.draw(o,null,null,null,null,true);
bmd1.threshold(bmd1, bmd1.rect, new Point(0,0), ">", 0XFF2b2b2b, 0x55FFFF, 0xFFFFFF, false);
return bmd1;
}
private function remove():void{
if(numChildren > 1)
removeChildAt(1);
if(bmd1){
bmd1.dispose();
bmd1 = null;
}
}
}}
Particle.as
package {
import flash.display.MovieClip;
import flash.events.Event;
import flash.display.Stage;
public class Particle extends MovieClip {
private var speedX:int;
private var speedY:int;
private var _s:Stage;
public function Particle() {
this.graphics.beginFill(0x00CCFF);
this.graphics.drawCircle(0,0,Math.random() * 30);
speedX = Math.random() * 10 - 5;
speedY = Math.random() * 10 - 5;
this.addEventListener(Event.ADDED_TO_STAGE, initi);
}
public function initi(s:Stage):void{
this._s = s;
addEventListener(Event.ENTER_FRAME, render);
}
private function render(e:Event):void{
this.x += Math.random()*speedX;
this.y += Math.random()*speedY;
if(this.x > _s.stageWidth || this.y > _s.stageHeight){
//this.x = Math.random()*_s.stageWidth;
//this.y = Math.random()*_s.stageHeight;
removeEventListener(Event.ENTER_FRAME, render);
this.parent.removeChild(this);
}
}
}}
You must call bmd1.dispose(); before reinstantiating it or it will not release the bitmap from memory.
Edit:
After looking through your code very carefully, optimizing it, and cleaning up some things, I have come to the conclusion that your simulation is no longer running slower and slower.
The problem was that the way you would calculate the particle's x and y speed. Essentially it would diminish in speed until stopping all together. On top of the massive high quality blur you have placed and the lack of freeing bitmaps, your movie would appear and actually slow to a crawl.
Here is your code I have modified. I benchmarked it and it didn't peak above 10% cpu or 40k memory after 15 minutes.
Particle.as
package {
import flash.display.MovieClip;
import flash.events.Event;
import flash.display.Stage;
public class Particle extends MovieClip {
private var speedX:int;
private var speedY:int;
private var deleted:Boolean = false;
public function Particle() {
this.graphics.beginFill(0x00CCFF);
this.graphics.drawCircle(0,0,Math.random() * 30);
//The max prevents particle speed from rounding to zero.
speedX = Math.ceil(Math.random() * 10 - 5);
speedY = Math.ceil(Math.random() * 10 - 5);
}
public function render():void{
//It originally appeared to be slowing down. In-fact, it was.
x += Math.random() * speedX;
y += Math.random() * speedY;
deleted = (x > FluidLayer.w || y > FluidLayer.h);
//Comment this below if you want particles to be removed once they go out of bounds.
if(deleted) {
x = Math.random() * FluidLayer.w;
y = Math.random() * FluidLayer.h;
deleted = false;
}
}
public function isDeleted():Boolean {
return deleted;
}
}
}
FluidLayer.as
package {
import flash.display.Sprite;
import flash.events.MouseEvent;
import flash.display.BitmapData;
import flash.filters.BlurFilter;
import flash.display.Bitmap;
import flash.geom.Point;
import flash.geom.ColorTransform;
import flash.display.IBitmapDrawable;
import flash.events.Event;
import flash.display.MovieClip;
public class FluidLayer extends MovieClip {
private var canvas:Sprite;
private var bitmap:Bitmap;
private var bitmapData:BitmapData;
private var particleArray:Array = new Array();
public static const w:uint = 550;
public static const h:uint = 400;
public function FluidLayer() {
addEventListener(Event.ADDED_TO_STAGE, initialize);
}
//By only one event handler to render, we prevent the overhead of 599 bubbling events.
private function render(e:Event):void {
for each(var p:Particle in particleArray) {
p.render();
//uncomment below if you want particles to become removed when they navigate out of bounds.
//if(p.isDeleted()) {
//canvas.removeChild(p);
//particleArray.splice(particleArray.indexOf(p),1);
//}
}
bitmapData.fillRect(bitmapData.rect, 0); //clear the bitmapdata
bitmapData.draw(canvas,null,null,null,null,true);
bitmapData.threshold(bitmapData, bitmapData.rect, new Point(0,0), ">", 0XFF2b2b2b, 0x55FFFF, 0xFFFFFF, false);
}
//We call initialize once the fluid layer has been added to stage
//or else stage values will be null.
private function initialize(e:Event):void {
canvas = new Sprite();
//You DEFINITELY want to lower the blur amount here.
//This is what is ultimately slowing your SWF down to a crawl.
//canvas.filters = new Array(new BlurFilter(20,20,1));
for(var i:uint = 0; i < 600; i++) {
var p:Particle = new Particle();
p.x = Math.random() * w;
p.y = Math.random() * h;
canvas.addChild(p);
particleArray.push(p);
}
//The bitmap and bitmapData only need to be initialized once
bitmapData = new BitmapData(w, h, true);
bitmap = new Bitmap(bitmapData, "auto", true);
bitmap.alpha = 0.7;
addChild(bitmap);
addEventListener(Event.ENTER_FRAME, render);
}
}
}
The original slowdown appears to be the blur filter on the canvas. (Comment the filter out to see proof)
The automatic creation of bitmaps by flash (CacheAsBitmap & Bitmap Filter buffers) to render the filter is likely causing the memory leak and this could be due the constantly changing dimension of canvas, due to the particles movement.
Try adding this line after creating canvas for a quick fix:
canvas.scrollRect = new Rectangle(0,0,stage.stageWidth,stage.stageHeight);
By limiting the size of the canvas with the scrollRect we are stopping this reallocation.
However the fluid no longer goes to the edges of the stage. This could be worked around in the draw and bitmap allocation routines, increasing dimensions and offsetting, i'll let you have a go at that but its connected partially to the blur filter amount.
I'd suggest adapting these idea with the very good ideas in Andreas' code.
So i put together a solution for my question with the help of Andreas and adamh.
Andreas - showed me that i forgot to dispose the bitmapdata (really nice spot!)
Adamh - told me to define scrollrect on the canvas (Upped the performance a lot!)
But what did it in the end and made the performance fluid, was a simple mistake from my side. I noticed in the particle.as > render(), that i was only checking if the particle was out of bounds on 2 sides (facepalm), stupid mistake. When i changed the render function to check the remaining 2 sides, it fixed the performance issue.
Sorry for the stupid question :) and thanks again to Andreas and adamh
the final classes:
FluidLayer.as
package {
import flash.display.Sprite;
import flash.events.MouseEvent;
import flash.display.BitmapData;
import flash.filters.BlurFilter;
import flash.display.Bitmap;
import flash.geom.Point;
import flash.geom.ColorTransform;
import flash.display.IBitmapDrawable;
import flash.events.Event;
import flash.display.MovieClip;
import flash.geom.Rectangle;
public class FluidLayer extends MovieClip {
private var canvas:Sprite;
private var b:Bitmap;
private var blur:BlurFilter = new BlurFilter(20,20,3);
private var bmd1:BitmapData;
public function FluidLayer() {
canvas = new Sprite();
canvas.scrollRect = new Rectangle(0,0,1010,550);
for(var i:int = 0;i < 600;i++){
var p:Particle = new Particle();
canvas.addChild(p);
p.x = stage.stageWidth * Math.random();
p.y = stage.stageHeight* Math.random();
p.initi(stage);
}
canvas.filters = new Array(blur);
addEventListener(Event.ENTER_FRAME, render);
}
private function render(e:Event):void{
remove();
b = new Bitmap(makeFluid(canvas),"auto", true);
b.alpha = 0.7;
addChild(b);
}
private function makeFluid(o:Sprite):BitmapData{
bmd1 = new BitmapData(stage.stageWidth, stage.stageHeight, true);
bmd1.draw(o,null,null,null,null,true);
bmd1.threshold(bmd1, bmd1.rect, new Point(0,0), ">", 0XFF2b2b2b, 0x55FFFF, 0xFFFFFF, false);
return bmd1;
}
private function remove():void{
if(numChildren > 1)
removeChildAt(1);
if(bmd1){
bmd1.dispose();
bmd1 = null;
}
}}}
Particle.as
package {
import flash.display.MovieClip;
import flash.events.Event;
import flash.display.Stage;
public class Particle extends MovieClip {
private var speedX:int;
private var speedY:int;
private var _s:Stage;
public function Particle() {
this.graphics.beginFill(0x00CCFF);
this.graphics.drawCircle(0,0,Math.random() * 30);
speedX = Math.random() * 10 - 5;
speedY = Math.random() * 10 - 5;
this.addEventListener(Event.ADDED_TO_STAGE, initi);
}
public function initi(s:Stage):void{
this._s = s;
addEventListener(Event.ENTER_FRAME, render);
}
private function render(e:Event):void{
this.x += Math.random()*speedX;
this.y += Math.random()*speedY;
if(this.x > _s.stageWidth || this.y > _s.stageHeight || this.x < 0 && this.y < 0){
this.x = Math.random()*_s.stageWidth;
this.y = Math.random()*_s.stageHeight;
//removeEventListener(Event.ENTER_FRAME, render);
//this.parent.removeChild(this);
}
}
}}

Multitouch as3 problems

I have a little problem with multitouch in as3.
Recently started a project in connection with my student practice.
This is to be a small game for android.
Are used to control two virtual joysticks and that's the problem with them.
As long as I use one of them or the other separately all works very well. However, when I try to use two at the same time, one of them is blocked and the object which moves begin to move in a random way and I can not control it.
Here is my code:
joystick.as:
package com.controls {
import flash.events.TouchEvent;
import flash.ui.Multitouch;
import flash.ui.MultitouchInputMode;
import flash.display.Sprite;
import flash.events.Event;
import flash.display.MovieClip;
import flash.geom.Rectangle;
import com.controls.JoystickKnob;
import com.Hero;
import com.Fire;
import com.greensock.*;
import com.greensock.easing.*;
public class Joystick extends MovieClip {
Multitouch.inputMode = MultitouchInputMode.TOUCH_POINT;
private var my_x:Number;
private var my_y:Number;
private var knob:JoystickKnob;
private var hero:Hero;
private var fire:Fire;
private var knob_tween:TweenLite;
public function Joystick(margin_left, margin_bottom, hero_mc) {
var circle:Sprite = new Sprite();
circle.graphics.beginFill(0x696969);
circle.graphics.drawCircle(50, 50, 60);
circle.graphics.endFill();
addChild(circle);
my_x = margin_left;
my_y = margin_bottom;
hero = hero_mc;
if (stage) {
init();
} else {
addEventListener(Event.ADDED_TO_STAGE,init);
}
}
private function init(e:Event = null):void {
if (hasEventListener(Event.ADDED_TO_STAGE)) {
removeEventListener(Event.ADDED_TO_STAGE,init);
}
this.x = my_x + this.width / 2;
this.y = stage.stageHeight - my_y - this.height / 2;
knob = new JoystickKnob();
knob.x = 0;
knob.y = 0;
knob.origin_x = 0;
knob.origin_y = 0;
addChild(knob);
this.addEventListener(TouchEvent.TOUCH_BEGIN, onTouchBegin, true);
knob.addEventListener(TouchEvent.TOUCH_MOVE, onTouchMove, true);
stage.addEventListener(TouchEvent.TOUCH_END, onTouchEnd, true);
knob.buttonMode = true;
}
private function onTouchBegin(event:TouchEvent):void {
knob.x = this.mouseX;
knob.y = this.mouseY;
onTouchMove(null);
}
private function onTouchMove(event:TouchEvent):void {
if (knob_tween) {
knob_tween.kill();
}
this.addEventListener(Event.ENTER_FRAME, knobMoved);
knob.startDrag(false, new Rectangle( - this.width /2, - this.height /2, this.width, this.height));
}
private function knobMoved(event:Event):void {
// LEFT OR RIGHT
if (knob.x > 15) {
hero.move_right = true;
hero.move_left = false;
} else if (knob.x < -15) {
hero.move_right = false;
hero.move_left = true;
} else {
hero.move_right = false;
hero.move_left = false;
}
// UP OR DOWN
if (knob.y > 15) {
hero.move_down = true;
hero.move_up = false;
} else if (knob.y < -15) {
hero.move_down = false;
hero.move_up = true;
} else {
hero.move_down = false;
hero.move_up = false;
}
}
private function onTouchEnd(event:TouchEvent):void {
knob.stopDrag();
hero.move_left = false;
hero.move_up = false;
hero.move_right = false;
hero.move_down = false;
if (this.hasEventListener(Event.ENTER_FRAME)) {
this.removeEventListener(Event.ENTER_FRAME, knobMoved);
}
mover();
}
private function mover():void {
knob_tween = new TweenLite(knob, 0.5, {x: knob.origin_x, y:knob.origin_y, ease:Bounce.easeOut});
}
}
}
joystickKnob.as:
package com.controls {
import flash.display.Sprite;
import flash.display.MovieClip;
public class JoystickKnob extends MovieClip {
private var _origin_x:Number;
private var _origin_y:Number;
private var knob:Class;
public function JoystickKnob() {
var circle:Sprite = new Sprite();
circle.graphics.beginFill(0x32CD32);
circle.graphics.drawCircle(50, 50, 35);
circle.graphics.endFill();
addChild(circle);
}
public function get origin_x():Number {
return _origin_x;
}
public function set origin_x(o_x:Number):void {
_origin_x = o_x;
}
public function get origin_y():Number {
return _origin_x;
}
public function set origin_y(o_y:Number):void {
_origin_y = o_y;
}
}
}
Second joystick code looks the same, except that it is stored in files joystick2.as, joystickKnob2.as.
This is the main class of my program:
package com {
import flash.events.TouchEvent;
import flash.display.MovieClip;
import flash.events.MouseEvent;
import com.controls.Joystick;
import com.controls.Joystick2;
import com.Hero;
import com.Fire;
public class MyApp extends MovieClip {
private var joystick:Joystick;
private var hero:Hero;
private var joystick2:Joystick2;
private var fire:Fire;
public function MyApp() {
hero = new Hero();
hero.x = stage.stageWidth/1.7;
hero.y = stage.stageHeight/1.7;
addChild(hero);
fire = new Fire();
fire.x = stage.stageWidth/1.7;
fire.y = stage.stageHeight/1.7;
addChild(fire);
joystick = new Joystick(-350, 100, hero);
addChild(joystick);
joystick2 = new Joystick2(600, 100, fire);
addChild(joystick2);
}
}
}
When using the two joysticks at the same time, the problem also occurs with the knob graphics - instead move in a specific area, one of them almost always moves to the other end of the screen, near the area of the second joystick.
Has anyone of you already encountered such a problem and knows how to remedy it?
Best regards and thank you in advance for your help
Multitouch.inputMode = MultitouchInputMode.TOUCH_POINT; does not support multiple fingers as written in de documentation:
For user interaction with multiple points of contact (such as several fingers moving across a touch screen at the same time) use the related GestureEvent, PressAndTapGestureEvent, and TransformGestureEvent classes. And, use the properties and methods of these classes to construct event handlers that respond to the user touching the device.
so you want Multitouch.inputMode = MultitouchInputMode.GESTURE;
This post shows up when searching for info on touch_point so I want to make sure it's correct.
TOUCH_POINT does support multiple touch points. Each touch is unique and given a unique id. You can have 100s of simultaneous touches.
TOUCH_POINT is what you use if you want to code your own touch handlers. GESTURE is TOUCH_POINTs handled for you. GESTURE decides if the touchpoints are swiping, tapping, etc. TOUCH_POINT is like a mouse event - the raw event.

How many images I need to have more fluently animation(Actionscript);

I have an onEnterFrame event:
package {
import flash.display.MovieClip;
import flash.display.Loader;
import flash.events.Event;
import flash.net.URLRequest;
import flash.display.BitmapData;
import flash.geom.Matrix;
import flash.errors.IOError;
public class Ball extends MovieClip {
private var images:Array;
private var frames:Array;
var i:int = 0;
public function Ball(images:Array) {
this.images = images
frames = new Array();
images.forEach(function(current){
trace(current);
var loader:Loader = new Loader();
loader.contentLoaderInfo.addEventListener(Event.COMPLETE, onLoadCompleted);
loader.load(new URLRequest(current));
});
}
private function onLoadCompleted(e:Event):void{
frames.push(e.currentTarget.content);
i++;
if(i == images.length)
{
ready();
}
}
private function ready():void{
i = 0;
addEventListener(Event.ENTER_FRAME, onEnterFrame);
}
private function onEnterFrame(e:Event):void{
graphics.clear();
var bitmapData:BitmapData = frames[i].bitmapData;
graphics.beginBitmapFill(bitmapData, new Matrix(), false, true);
graphics.drawRect(0, 0, 100, 100);
graphics.endFill();
i++;
if(i == frames.length)
{
i = 0;
}
}
}
}
this class is getting an array of images and then animates it, and this is my main class:
public class Test extends MovieClip {
private var ball:Ball;
public function Test()
{
var images:Array = new Array();
for(var i:int = 1; i < 21; i++)
{
images.push('ball' + i.toString(10) + '.png');
}
ball = new Ball(images);
addChild(ball);
}
}
so as you see I am passing an array of 20 images, so the question is how many images I need to make a good animation, not roughly, but smoothly, creating every time a new image like ball1.png, ball2.png, ball3.png, ball4.png - I need to move the ball pixel by pixed to make a good animation? or is there a better way to do this?
It depends upon your perception and device and what you want to visualize from your content.
Please refer to this site:
http://www.mathworks.com/help/toolbox/mupad/plot/INTRO_FramesAndTimeRange.html
First thing I would consider is the framerate. There is no point in having more images as your framerate.
Basically for a smooth animation 30 fps should be ok. Also if you consider this for mobile devices I think you should not go higher than 30fps in order to have a good performance.
Regarding the number of images and how to animate them, I suggest you have a look into this game tutorial (Hungry Hero)
http://www.hsharma.com/tutorials/starting-with-starling-ep-3-sprite-sheets/
http://www.hsharma.com/tutorials/starting-with-starling-ep-5-parallax-background/

How to use hitTestObject on many objects

I can check if one object is hiting another, but what if I have 10 MovieClip objects, and i want to check if any object is hiting ANY object:
package {
import flash.display.MovieClip;
import flashx.textLayout.events.DamageEvent;
import fl.motion.Animator;
import flash.geom.Point;
import flash.utils.Timer;
import flash.events.TimerEvent;
import flash.events.Event;
import flash.geom.ColorTransform;
public class Test extends MovieClip {
private var arrows:Array;
private var timer:Timer;
public function Test() {
init();
}
private function init():void {
timer = new Timer(1000, 6);
timer.addEventListener(TimerEvent.TIMER, timerEvent);
arrows = new Array();
timer.start();
}
private function timerEvent(e:TimerEvent):void{
var arrow:Arrow = new Arrow();
arrow.x = 5;
arrow.y = Math.random() * 200 + 10;
addChild(arrow);
arrow.addEventListener(Event.ENTER_FRAME, onEnterFrame);
arrows.push(arrow);
//trace(555);
}
private function onEnterFrame(e:Event):void{
e.target.x += 4;
if(e.target.x > 400)
{
e.target.transform.colorTransform = new ColorTransform(0, 0, 1, 1, 0, 0, 1, 1);
e.target.removeEventListener(Event.ENTER_FRAME, onEnterFrame);
e.target.addEventListener(Event.ENTER_FRAME, goBack);
}
}
private function goBack(e:Event):void {
e.target.x -= 4;
if(e.target.x < 50)
{
e.target.transform.colorTransform = new ColorTransform(1, 1, 1, 1, 0, 0, 1, 1);
e.target.removeEventListener(Event.ENTER_FRAME, goBack);
e.target.addEventListener(Event.ENTER_FRAME, onEnterFrame);
}
}
}
}
how can i check if any arrow is touching other arrow object?, doesn't matter what object,I need something like hitTestGlobal
At least you can all objects hitting one point by using method DisplayObjectContainer.getObjectsUnderPoint(point:Point). If boundaries of your main object is not changing you can predefine edge points that you will hit testing every EnterFrame event.
Yes. You will have to check hit test on every object you need. And yes, it's a costy operation, but when writing games there's no other workaround. Try using Vector instead of an Array for a little performance boost, as Vector is type dependant array and it uses less memory. You can check the syntax HERE.
You'd instantiate it like this:
private var arrows:Vector.<Arrow> = new Vector.<Arrow>();

A loop in enterframe?

I'm animating a bunch of words in AS3. Because I'm going to be using this on a mobile device, I want to use bitmaps rather than Sprites. So I've created WordObjects, which have a .bitmap property that I can access.
I have the following code, which fires on the click event and loops through an array inside an enterframe event. This is probably a bad idea, but I'm not sure how to do it better. (What is surprising is that it runs just fine in Flashbuilder, but slows to a crawl in Flash CS5.)
Is there some better way to do this? I just want an efficient way to animate the array of bitmaps.
private function clickhandler (e:MouseEvent){
this.addEventListener(Event.ENTER_FRAME, blowemup);
}
private function blowemup(e:Event){
var newPosition:Number;
for(var i:int=0; i<arrWordObjects.length; i++)
{
newPosition = updatePosition(arrWordObjects[i].bitmap);
arrWordObjects[i].bitmap.x += newPosition;
arrWordObjects[i].bitmap.y += getRandomNumber();
}
}
Something that will make a huge difference is using for each(Object in Array) rather than the standard for loop.
private function blowemup(e:Event):void
{
var newPosition:Number;
var i:ArrWordsObjectClass; // <-- don't know what the class for this is, just replace
for each(i in arrWordObjects)
{
newPosition = updatePosition(i.bitmap);
i.bitmap.x += newPosition;
i.bitmap.y += getRandomNumber();
}
}
A for each loop is typed, meaning a lot of time is saved where normally it'd be trying to work out what arrWordObjects[i] is every iteration.
Also, side note: using one ENTER_FRAME driven function and looping through everything in your application that you want to handle each frame is much more efficient than applying hundreds of listeners for objects.
I normally create a handler class that contains the ENTER_FRAME and an array storing my objects, like so:
package
{
import flash.events.Event;
import flash.display.Sprite;
public class Handler extends Sprite
{
// vars
public var elements:Array = [];
/**
* Constructor
*/
public function Handler()
{
addEventListener(Event.ENTER_FRAME, _handle);
}
/**
* Called on each dispatch of Event.ENTER_FRAME
*/
private function _handle(e:Event):void
{
var i:Element;
for each(i in elements)
{
i.step();
}
}
}
}
Then I create a base class for all the objects that I want to handle, containing the step() function called above.
package
{
import flash.display.DisplayObject;
public class Element extends Object
{
// vars
public var skin:DisplayObject;
/**
* Called on each dispatch of Event.ENTER_FRAME at Handler
*/
public function step():void
{
// override me
}
}
}
Now just extend Element with your objects:
package
{
import flash.display.Sprite;
public class MyThing extends Element
{
/**
* Constructor
*/
public function MyThing()
{
skin = new Sprite();
skin.graphics.beginFill(0);
skin.graphics.drawCircle(0,0,40);
skin.graphics.endFill();
}
/**
* Override step
*/
override public function step():void
{
skin.x += 4;
}
}
}
And get it all going!:
var handler:Handler = new Handler();
var m:MyThing;
var i:uint = 0;
for(i; i<10; i++)
{
m = new MyThing();
m.y = Math.random()*stage.stageHeight;
handler.elements.push(m);
addChild(m.skin);
}
How many bitmaps do you plan to have on the stage at a time?
I have had 40 900x16px bitmaps animating on the stage at full speed running on my iphone using air 2.6.
I used a foreach loop in an enterframe event which i added on mouseclick and removed once the animation was finished.
Remember to compile it for the mobile with gpu rendering enabled. (gpu in your app.xml if you are using air 2.6)
This is worth a read too, it explains a lot about performance for mobile devices
http://help.adobe.com/en_US/as3/mobile/WS901d38e593cd1bac-3d719af412b2b394529-8000.html
Here is a basic example of what I had...
package
{
import flash.display.Bitmap;
import flash.display.BitmapData;
import flash.display.Sprite;
import flash.display.StageAlign;
import flash.display.StageScaleMode;
import flash.events.Event;
import flash.events.MouseEvent;
import flash.geom.Rectangle;
[SWF(frameRate="30", backgroundColor="#FF00FF")]
public class Test extends Sprite
{
private var fields:Vector.<Bitmap> = new Vector.<Bitmap>();
public function Test()
{
this.stage.scaleMode = StageScaleMode.NO_SCALE;
this.stage.align = StageAlign.TOP_LEFT;
for(var i:int = 0; i< 37; i++){
var bd:BitmapData = new BitmapData(960, 16, true, 0x000000);
bd.fillRect(new Rectangle(0, 0, 900, 16), Math.round( Math.random()*0xFFFFFFFF ));
var b:Bitmap = new Bitmap(bd);
b.x = 0;
b.y = i*16;
stage.addChild(b);
fields.push(b);
}
stage.addEventListener(MouseEvent.MOUSE_DOWN, onMouseDown);
}
private var inertia:Boolean = false;
private var yCurrent:Number;
private var ySpeed:Number;
private var startY:Number;
private var cy:Number = 0;
private function onEnterFrame(e:Event):void{
if(!inertia){
ySpeed = (startY - yCurrent) ; // / 16;
startY = yCurrent
} else {
ySpeed *= 0.8;
if(ySpeed < 0.01 && ySpeed > -0.01){
inertia = false;
stage.removeEventListener(Event.ENTER_FRAME, onEnterFrame);
}
}
cy += ySpeed;
if(cy > 640)
cy -= 640;
var ty:Number = cy;
for each(var tf:Bitmap in fields){
tf.y = ty;
ty += 16;
if(ty > 640)
ty -= 640;
}
}
private function onMouseDown(e:MouseEvent):void{
inertia = false;
startY = e.stageY;
yCurrent = e.stageY;
stage.addEventListener(Event.ENTER_FRAME, onEnterFrame);
stage.addEventListener(MouseEvent.MOUSE_MOVE, onMouseMove);
stage.addEventListener(MouseEvent.MOUSE_UP, onMouseUp);
}
private function onMouseMove(e:MouseEvent):void{
yCurrent = e.stageY;
}
private function onMouseUp(e:Event):void{
inertia = true;
stage.removeEventListener(MouseEvent.MOUSE_MOVE, onMouseMove);
stage.removeEventListener(MouseEvent.MOUSE_UP, onMouseUp);
}
}
}
I would suggest looking at writing a custom effect on Adobe's website over registering for ENTER_FRAME event. What you've put up there means this code will forever run as long as the program is running. If you wanted to stop the effect or run for 10 frames and stop then you'll have to write more code. It gets even more complex if you want to apply this to several instances. You're going to have to resolve problems that custom effects framework solves.
I'd read how to write custom effects here:
http://livedocs.adobe.com/flex/3/html/help.html?content=createeffects_1.html