Hi everyone,
I've been looking for ages for a tutorial which teaches me how to make that rotating circle using flash's gradient tools... (am talking about the one on adobe.com)
Thanks in advance
The forums have permanently moved to forum.kirupa.com. This forum will be kept around in readonly mode for archival purposes. To learn how to continue using your existing account on the new forums, check out this thread.
Hi everyone,
I've been looking for ages for a tutorial which teaches me how to make that rotating circle using flash's gradient tools... (am talking about the one on adobe.com)
Thanks in advance
So, something like this?
http://www.reclipse.net/kirupa/circleAlphaTwirl.html
I don't exactly have a tutorial for it, but the source is below and I could explain it if you'd like.
Code:var numCircles:Number = 35; var centerX:Number = 200; var centerY:Number = 100; var radius:Number = 20; var angle:Number = numCircles/180; var radians:Number = (360/numCircles)*Math.PI/180; var count:Number = 1; for (i=0; i<numCircles; i++) { this.createEmptyMovieClip("circle"+i, i); drawCircle(this["circle"+i], 4, 0x99FF00, 100); this["circle"+i]._x = centerX+Math.sin(radians*i)*radius; this["circle"+i]._y = centerY+Math.cos(radians*i)*radius; this["circle"+i]._alpha = i*(100/numCircles); trace(this["circle"+i]._alpha); } this.onEnterFrame = function() { for (i=0; i<numCircles; i++) { if (this["circle"+i]._alpha<=0) { this["circle"+i]._alpha = 100; } this["circle"+i]._alpha = 3; } }; function drawCircle(target_mc:MovieClip, radius:Number, fillColor:Number, fillAlpha:Number):Void { var x:Number = radius; var y:Number = radius; with (target_mc) { beginFill(fillColor, fillAlpha); moveTo(x+radius, y); curveTo(radius+x, Math.tan(Math.PI/8)*radius+y, Math.sin(Math.PI/4)*radius+x, Math.sin(Math.PI/4)*radius+y); curveTo(Math.tan(Math.PI/8)*radius+x, radius+y, x, radius+y); curveTo(Math.tan(Math.PI/8)*radius+x, radius+y, Math.sin(Math.PI/4)*radius+x, Math.sin(Math.PI/4)*radius+y); curveTo(radius+x, Math.tan(Math.PI/8)*radius+y, radius+x, y); curveTo(radius+x, Math.tan(Math.PI/8)*radius+y, Math.sin(Math.PI/4)*radius+x, Math.sin(Math.PI/4)*radius+y); curveTo(Math.tan(Math.PI/8)*radius+x, radius+y, x, radius+y); curveTo(Math.tan(Math.PI/8)*radius+x, radius+y, Math.sin(Math.PI/4)*radius+x, Math.sin(Math.PI/4)*radius+y); curveTo(radius+x, Math.tan(Math.PI/8)*radius+y, radius+x, y); endFill(); } }
“Who were you, Krilnon, and how did you know so much about AS4?”
The historian sighed as she gazed up at the sky and saw… not stars. A story.
that's exactly what I wanted. I should have thought of that, but was trying to get it done with that gradient tools in flash... which I don't like very much.
thanks a lot mate, it's really appreciated.
But how do you clear it when you move to the called frame?
I tried this on the frame I'm calling but I can't figure it out:
stop();
onEnterFrame = function() {
_root.target_mc.clear();
_root["circle"+i].clear();
};
Try this and call clearCircles(circles); at some point:(I really just added the one function and rewrote part of the code to use an indexed array instead of an associative array.)Code:var numCircles:Number = 35; var centerX:Number = 200; var centerY:Number = 100; var radius:Number = 20; var angle:Number = numCircles / 180; var radians:Number = (360 / numCircles) * Math.PI / 180; var count:Number = 1; var circles:Array = new Array(); for (i = 0; i < numCircles; i++) { circles.push(createEmptyMovieClip('circle' + i, i)); drawCircle(circles[i],4,0x99FF00,100); circles[i]._x = centerX + Math.sin(radians * i) * radius; circles[i]._y = centerY + Math.cos(radians * i) * radius; circles[i]._alpha = i * (100 / numCircles); } onEnterFrame = function():Void { for (i = 0; i < numCircles; i++) { if (circles[i]._alpha <= 0) { circles[i]._alpha = 100; } circles[i]._alpha = 3; } }; function clearCircles(circleArray:Array):Void { for(var i:Number = circleArray.length  1; i >= 0; i){ removeMovieClip(circleArray.pop()); } onEnterFrame = null; } function drawCircle(target_mc:MovieClip, radius:Number, fillColor:Number, fillAlpha:Number):Void { var x:Number = radius; var y:Number = radius; with (target_mc) { beginFill(fillColor,fillAlpha); moveTo(x + radius,y); curveTo(radius + x,Math.tan(Math.PI / 8) * radius + y,Math.sin(Math.PI / 4) * radius + x,Math.sin(Math.PI / 4) * radius + y); curveTo(Math.tan(Math.PI / 8) * radius + x,radius + y,x,radius + y); curveTo(Math.tan(Math.PI / 8) * radius + x,radius + y,Math.sin(Math.PI / 4) * radius + x,Math.sin(Math.PI / 4) * radius + y); curveTo(radius + x,Math.tan(Math.PI / 8) * radius + y,radius + x,y); curveTo(radius + x,Math.tan(Math.PI / 8) * radius + y,Math.sin(Math.PI / 4) * radius + x,Math.sin(Math.PI / 4) * radius + y); curveTo(Math.tan(Math.PI / 8) * radius + x,radius + y,x,radius + y); curveTo(Math.tan(Math.PI / 8) * radius + x,radius + y,Math.sin(Math.PI / 4) * radius + x,Math.sin(Math.PI / 4) * radius + y); curveTo(radius + x,Math.tan(Math.PI / 8) * radius + y,radius + x,y); endFill(); } }
“Who were you, Krilnon, and how did you know so much about AS4?”
The historian sighed as she gazed up at the sky and saw… not stars. A story.
nice
How Do I change the color for the preloader? It works great by the way! Cheers ActionScript Code:
var numCircles:Number = 35;
var centerX:Number = 200;
var centerY:Number = 100;
var radius:Number = 20;
var angle:Number = numCircles / 180;
var radians:Number = (360 / numCircles) * Math.PI / 180;
var count:Number = 1;
var circles:Array = new Array();
for (i = 0; i < numCircles; i++) {
circles.push(createEmptyMovieClip('circle' + i, i));
drawCircle(circles[i],4,0x99FF00,100);
circles[i]._x = centerX + Math.sin(radians * i) * radius;
circles[i]._y = centerY + Math.cos(radians * i) * radius;
circles[i]._alpha = i * (100 / numCircles);
}
onEnterFrame = function():Void {
for (i = 0; i < numCircles; i++) {
if (circles[i]._alpha <= 0) {
circles[i]._alpha = 100;
}
circles[i]._alpha = 3;
}
};
function clearCircles(circleArray:Array):Void {
for(var i:Number = circleArray.length  1; i >= 0; i){
removeMovieClip(circleArray.pop());
}
onEnterFrame = null;
}
function drawCircle(target_mc:MovieClip, radius:Number, fillColor:Number, fillAlpha:Number):Void {
var x:Number = radius;
var y:Number = radius;
with (target_mc) {
beginFill(fillColor,fillAlpha);
moveTo(x + radius,y);
curveTo(radius + x,Math.tan(Math.PI / 8) * radius + y,Math.sin(Math.PI / 4) * radius + x,Math.sin(Math.PI / 4) * radius + y);
curveTo(Math.tan(Math.PI / 8) * radius + x,radius + y,x,radius + y);
curveTo(Math.tan(Math.PI / 8) * radius + x,radius + y,Math.sin(Math.PI / 4) * radius + x,Math.sin(Math.PI / 4) * radius + y);
curveTo(radius + x,Math.tan(Math.PI / 8) * radius + y,radius + x,y);
curveTo(radius + x,Math.tan(Math.PI / 8) * radius + y,Math.sin(Math.PI / 4) * radius + x,Math.sin(Math.PI / 4) * radius + y);
curveTo(Math.tan(Math.PI / 8) * radius + x,radius + y,x,radius + y);
curveTo(Math.tan(Math.PI / 8) * radius + x,radius + y,Math.sin(Math.PI / 4) * radius + x,Math.sin(Math.PI / 4) * radius + y);
curveTo(radius + x,Math.tan(Math.PI / 8) * radius + y,radius + x,y);
endFill();
}
}
Change this line (line 11 for me):More specifically, change the third argument to the call.Code:drawCircle(circles[i],4,0xf1f1f1,100);
“Who were you, Krilnon, and how did you know so much about AS4?”
The historian sighed as she gazed up at the sky and saw… not stars. A story.
I'm a newbie to actionscript and this preloader is exactly what I've been looking too!
I don't know how to "clear it when you move to the called frame". Can you give me an example within the code you provided and tell me exactly where to put it in the code?
What about spinning it clockwise? And how would you control the speed via AS2? Maybe you could increase the frame rate, but that's cheating I think.
To spin it clockwise, change the code on line 13 from post #2 in this thread to:You can see that I just added "100  " to the code to invert the initial alphas.Code:this["circle" + i]._alpha = 100  i * (100 / numCircles);
To control the speed, adjust the value on line 21:Since 7 > 3, the thing appears to spin faster.Code:this["circle" + i]._alpha = 7;
I'm a newbie to actionscript and this preloader is exactly what I've been looking too!
I don't know how to "clear it when you move to the called frame". Can you give me an example within the code you provided and tell me exactly where to put it in the code?
__________________________________________________ ___________
louis vuitton replica handbags
just out of curiousity why woul u do this rather than have a comet semicircle single imageand rotating it....or using an animated gif?
It looks better and was more interesting to code.
There are currently 1 users browsing this thread. (0 members and 1 guests)
