Api dessin as3 [Résolu]

Signaler
Messages postés
81
Date d'inscription
mercredi 1 août 2007
Statut
Membre
Dernière intervention
27 juillet 2011
-
pegase31
Messages postés
6146
Date d'inscription
dimanche 21 décembre 2003
Statut
Modérateur
Dernière intervention
4 septembre 2013
-
Bonjour à tous.

je suis actuellement sur un chronomètre en forme de cercle pour un jeu.

Je n'ai pas de problèmes en ce qui concerne le dessin du cercle en fonction d'un timer.

Or maintenant faut que je prévois que le temps peut être diminué (par collision dans le jeu). Je pense qu'un exemple sera plus simple pour exposer mon problème. Il suffit de cliquer sur le btn pour voir ce qui cloche.

Lien vers l'exemple.

Comment pourrais-je faire pour remplir les vides qui se forment ? Si quelqu'un avait une piste je suis plus que preneur.

Merci

Le code de l'exemple ci-dessous :

/*___________________RENDU GRAPHIQUE TIMER_____________________*/
var _letimer:Timer = new Timer(10,15000);
var _progress:Shape = new Shape();
_progress.x = 100;
_progress.y = 100;
var _temps:int;
var _letemps:int;
var _faceSize:Number;

var txt:txtTimer = new txtTimer();
txt.x = _progress.x - 40;
txt.y = _progress.y - 53;

initClock();

function initClock(faceSize:Number = 60):void {
_faceSize = faceSize;
AfficheClock(null);
}

function AfficheClock(evt:TimerEvent):void {
addChild(txt);
txt.filters = [ombre];

addChild(_progress);
_progress.filters = [ombre];

_progress.graphics.clear();
_progress.graphics.beginFill(0xb7dd3c);
_progress.graphics.drawCircle(0,0,(_faceSize/2));

_progress.graphics.lineStyle(1.0,0xffffff,1);
_progress.graphics.drawCircle(0,0,(_faceSize/2)+1);

_progress.graphics.lineStyle(3,0xffffff,1);
_progress.graphics.drawCircle(0,0,(_faceSize/2));
_progress.graphics.endFill();

startClock(1);
}

function startClock(temps:uint):void {
_progress.graphics.moveTo(0,0);
_progress.graphics.lineStyle(2.0,0x4a7d04,1);
_progress.graphics.lineTo(0,-((_faceSize-6)/2));
_progress.graphics.endFill();

_temps = 18000;

_letimer.start();
_letimer.addEventListener(TimerEvent.TIMER, onTick);
}

var angle:Number;
var newX:Number;
var newY:Number;

function onTick(evt:TimerEvent):void {
_temps = _temps - 10;
_progress.graphics.moveTo(0,0);
angle = _temps / 18000 * Math.PI * 2;
newX = Math.sin(angle) * -((_faceSize-6)/2);
newY = Math.cos(angle) * -((_faceSize-6)/2);

_progress.graphics.lineTo(newX,newY);

if (_temps <= 0) {
_letimer.addEventListener(TimerEvent.TIMER, finTimer);
}
}

function finTimer(evt:TimerEvent):void {
_letimer.removeEventListener(TimerEvent.TIMER, finTimer);
_letimer.removeEventListener(TimerEvent.TIMER, onTick);
}

/*__________________BTN___________________*/
var monClip:MovieClip = new MovieClip();
addChild(monClip);
var bouton:Shape = new Shape();

monClip.addChild(bouton);
bouton.graphics.clear();
bouton.graphics.beginFill(0x124457);
bouton.graphics.lineStyle(2,0xb5b000);
bouton.graphics.drawRoundRect(150,150,100,60,5);
bouton.graphics.endFill();

function clique(evt:MouseEvent):void {
_temps = _temps - 1000;

if (_temps <= 0) {
_letimer.addEventListener(TimerEvent.TIMER, finTimer);
_letimer.removeEventListener(TimerEvent.TIMER, onTick);
}
}

function monClip_over(evt:MouseEvent):void {
bouton.graphics.beginFill(0xffffff);
bouton.graphics.drawRoundRect(150,150,100,60,5);
bouton.graphics.endFill();
}

function monClip_out(evt:MouseEvent):void {
bouton.graphics.beginFill(0x124457);
bouton.graphics.drawRoundRect(150,150,100,60,5);
bouton.graphics.endFill();
}

monClip.buttonMode = true;
monClip.addEventListener(MouseEvent.CLICK, clique);
monClip.addEventListener(MouseEvent.MOUSE_OVER, monClip_over);
monClip.addEventListener(MouseEvent.MOUSE_OUT, monClip_out);

10 réponses

Messages postés
6146
Date d'inscription
dimanche 21 décembre 2003
Statut
Modérateur
Dernière intervention
4 septembre 2013
6
alors soit un timer, soit un enterframe, mais pas les deux....

Pour un timer c'est simple :

var timer:Timer = new Timer(1000, 0); //pour une sec de temps et une boucle infinie
timer.addEventListener(TimerEvent.TIMER, maFonction);
funciton maFonction(t:TimerEvent):void {
//code à déclencger à chaque timer
}
timer.start();


Voili.

un simple "timer.stop()" pour l'arrêter.

Peg'
Messages postés
6146
Date d'inscription
dimanche 21 décembre 2003
Statut
Modérateur
Dernière intervention
4 septembre 2013
6
Bonsoir,

Question : pourquoi dessines-tu des traits au lieu des portions de cercle ?

Il suffit de redessiner ta portion de cercle à chaque frame précédé d'un "clear()" et le tour est joué.

Peg'
Messages postés
81
Date d'inscription
mercredi 1 août 2007
Statut
Membre
Dernière intervention
27 juillet 2011

Bonsoir,

Dis moi si j'ai tord mais si je dessine des portions de cercle comme tu dis on ne verra pas le cercle se former petit a petit mais par portion justement. D'où l'intérêt de le faire avec des traits ?


Ariranha.
Messages postés
6146
Date d'inscription
dimanche 21 décembre 2003
Statut
Modérateur
Dernière intervention
4 septembre 2013
6
ben si ta portion de cercle fait 12°, puis 13, 14 etc .. si ...

Peg'
Messages postés
81
Date d'inscription
mercredi 1 août 2007
Statut
Membre
Dernière intervention
27 juillet 2011

En effet vu sous cet angle .
Des demain je teste.

Merci et bonne soirée.
Messages postés
81
Date d'inscription
mercredi 1 août 2007
Statut
Membre
Dernière intervention
27 juillet 2011

Bonjour,

Je me suis donc dirigé vers une autre méthode, qui me permettra de gerer le cercle par son angle et donc de faire un ratio entre le temps et l'angle.

N'étant pas encore a mon aise en as3 je me retrouve confornter à un petit problème. J'ai crée une fonction "générique" que je veux par la suite appliquer a un MovieClip. En as 2 il suffisait de faire un truc du genre :

MovieClip.function(param1, param2, param3, etc.);


En as3 doit falloir passer par un addEventListener mais lequel ?

Merci et bonne journée.
Messages postés
6146
Date d'inscription
dimanche 21 décembre 2003
Statut
Modérateur
Dernière intervention
4 septembre 2013
6
heu .. ça dépend de ce que tu feux faire exactement.

Les déclarations de fonction en as2/3 n'ont pas changés ...

Peg'
Messages postés
81
Date d'inscription
mercredi 1 août 2007
Statut
Membre
Dernière intervention
27 juillet 2011

J'ai le code ci-dessous, qui lors de la compilation m'affiche l'erreur suivante :

TypeError: Error #1006: tracerCercle n'est pas une fonction.
at timerJeu_v2_fla::MainTimeline/frame1()

Je pensais que cela venait de la déclaration de fonction :

secteur0.tracerCercle(angleEnRadians, rayon0, 50, "0xCC3300", 100);


//a est la mesure (en radians) du secteur angulaire
//r est le rayon du secteur angulaire 
//n représente le nombre de points utilisés pour tracer un cercle complet 
//c est la couleur en hexadécimal
//t est la transparence 

var a:Number;
var r:Number;
var n:Number;
var c:String;
var t:Number;
var rayon:Number;
var teta:Number = 0;
var dteta:Number = 2 * Math.PI / n;

var _progress:Shape = new Shape();
addChild(_progress);

function tracerCercle(a, r, n, c, t):void {	
_progress.graphics.clear();
_progress.graphics.lineStyle(0,0,0);
_progress.graphics.beginFill(c,t);
_progress.graphics.moveTo(0,0);
_progress.graphics.lineTo(rayon,0);

while (teta < a) {
var x:Number = r * Math.cos(teta);
var y:Number =  -  r * Math.sin(teta);
_progress.graphics.lineTo(x, y);
teta += dteta;
}

x = r*Math.cos(a);
y = - r*Math.sin(a);
_progress.graphics.lineTo(x,y);
_progress.graphics.lineTo(0,0);
_progress.graphics.endFill();
}

var angleEnDegres:Number = 237;
var rayon0:Number = 80;
var secteur0:MovieClip = new MovieClip();
secteur0.x = 200;
secteur0.y = 150;
addChild(secteur0);
var angleEnRadians:Number = Math.PI*angleEnDegres/180;

secteur0.tracerCercle(angleEnRadians, rayon0, 50, "0xCC3300", 100);
Messages postés
6146
Date d'inscription
dimanche 21 décembre 2003
Statut
Modérateur
Dernière intervention
4 septembre 2013
6
apparemment, tu essayes d'accéder à une fonction dans ton movieClip, alors qu'il vient d'être créé ...
Je ne vois pas trop ce que tu veux faire, puisque ta fonction est déclarée dans le même niveau...

Tu essayes de faire un enterframe ou quelque chose du genre ?

Peg'
Messages postés
81
Date d'inscription
mercredi 1 août 2007
Statut
Membre
Dernière intervention
27 juillet 2011

Je t'avoue que je suis un peu perdu en as3 car en as2 j'aurais fais un truc du genre :

MovieClip.prototype.tracerUnSecteurAngulaire = function(a, r, n, c, t) {
this.clear();
this.lineStyle(0,0,0);
this.beginFill(c,t);
this.moveTo(0,0);
this.lineTo(rayon,0);
var teta = 0;
var dteta = 2 * Math.PI / n;
while (teta < a) {
var x = r * Math.cos(teta);
var y = -r * Math.sin(teta);
this.lineTo(x,y);
teta += dteta;
}

x = r * Math.cos(a);
y = -r * Math.sin(a);
this.lineTo(x,y);
this.lineTo(0,0);
this.endFill();
};

angleEnDegres = 237;
rayon0 = 80;
this.createEmptyMovieClip("secteur0",0);
secteur0._x = 200;
secteur0._y = 150;
angleEnRadians = Math.PI * angleEnDegres / 180;
secteur0.tracerUnSecteurAngulaire(angleEnRadians,rayon0,50,"0xCC3300",100);


Et la pas de problème le clip secteur0 apparait a l'écran.

Sinon pour répondre a ta question oui j'aurais aimé appliquer un EnterFrame par derrière au lancement d'un timer pour modifier la valeur angle. Ainsi j'aurais bien un cercle qui se forme au fur et à mesure de l'écoulement du timer.