PDA

View Full Version : Carousel Effect with AS3


firdosh
10-17-2006, 01:41 AM
I am trying to create a carousel effect with AS3. It all works good except that i get my swapdepths to work.

I have a CarouselItem class

package
{
import flash.display.Sprite;

public class CarouselItem extends Sprite
{
private var _angle:Number;

public function CarouselItem(){
super();
this.graphics.lineStyle(0,0xff0000,1);
this.graphics.beginFill(0x000099,1);
this.graphics.drawCircle(0,0,50);
this.graphics.endFill();
}

public function get angle():Number{
return _angle;
}

public function set angle(val:Number):void{
_angle=val;
}
}
}


And here is my main class


package {
import flash.display.Sprite;
import flash.geom.Point;
import flash.events.Event;

public class Carousel extends Sprite
{
private var numOfObj:uint=10;
private var radius:Point;
private var center:Point;
private var speed:Number=0.01;

public function Carousel()
{
super();
radius=new Point(200,75);
center=new Point(stage.stageWidth/2, stage.stageHeight/2);
for(var i:int=0;i<numOfObj;i++){
var t:CarouselItem=new CarouselItem();
t.angle=(i*((Math.PI*2)/numOfObj));
t.addEventListener(Event.ENTER_FRAME,onEnter);
this.addChild(t);
}
stage.frameRate=24;
}

private function onEnter(evt:Event):void{
var obj:CarouselItem=CarouselItem(evt.currentTarget);
obj.x=Math.cos(obj.angle) *radius.x +center.x;
obj.y=Math.sin(obj.angle) *radius.y +center.y;
var scale:Number=obj.y /(center.y+radius.y);
obj.scaleX=obj.scaleY=scale*1;
obj.angle=(obj.angle+speed);
var depth:Number=this.getChildIndex(obj);

this.swapChildrenAt(depth, depth+1);

}

}
}


I get the depth of the current object and then swap it with the one with the higher index.

thanks
cheers :)
firdosh

blockage
10-17-2006, 07:12 PM
Each object's depth should be related to the sin of its angle (much like its y pos and scale)...

firdosh
10-17-2006, 07:58 PM
I am trying to swap the depths depending on the scaleX property so I was thinking about writing a compare function like

private function compare(x:CarouselItem,y:CarouselItem):int{
if(x.scaleX > y.scaleX){
return 1;
}
else if(x.scaleX < y.scaleX){
return -1;
}
else{
return 0;
}
}


and sort the array out that way in the onEnter function, although I dont know if that would be the best way to go about it.

Is there a method that returns an array with all the children

firdosh

t0xic
10-20-2006, 05:25 PM
Why not just set the depth equal to the xscale then ?

firdosh
10-30-2006, 10:03 PM
i dont think there is a method that lets you just set the depth to a particular value.

senocular
10-30-2006, 10:12 PM
see:
http://www.kirupa.com/forum/showthread.php?p=1897023#post1897023
just sort on your sin or "depth" or whatever you need

firdosh
10-30-2006, 11:23 PM
sweeeeet thanks senocular , that worked :)

senocular
10-30-2006, 11:24 PM
welcome :)

audiowizard
09-17-2007, 08:20 PM
thank you for that senocular!

MrSantiago
11-09-2008, 10:38 PM
Hi

I am trying to rotate the carousel described earlier in this thread.

Right now I do it with a simple hack, where I set the .rotation of a sprite holding the carousel - but I'm wondering if it possible to do with the Math.cos, Math.sin and scale?

Best regards

Santiago

dhakshan
07-17-2009, 12:40 PM
:eek:
i want to this carousel tutorial source file

dhakshan
07-17-2009, 12:41 PM
i want this carousel source file

this mail id dhakshinamurthy82@gmail.com