[FLASH MX2004] Simuler le traçage d'une ligne en AS, mais...

Version imprimable

Bonsoir à tous,
Simuler le traçage d'une ligne en AS, mais comme on le ferait avec un crayon .

Problème : :shock: si je trace une ligne en actionScript, celle-ci est dessinée "plus vite que son ombre"...

Ce que je souhaiterais faire :? c'est que cette ligne se dessine en 1 ou 2 secondes comme on le ferait avec
une régle et un crayon à la main.

Dans l'anim que je suis en train de mettre au point, :) dans un 1° temps, une main avec son crayon, et une équerre se déplacent
vers un point de départ, puis :o dans un 2° temps, simule le déplacement vertical du traçage d'un trait, mais le trait se trouve dessiné
aussitôt l'action lancée :!: ... et la main termine son mouvement mais :arrow: décalée et trop tard...

Sur un calque action j'ai donc positionné le
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 MovieClip.prototype.transfo=function(p,d,a,t){ //p=valeur "_x" ou "_y" de monclip à déplacer, d=point de départ déplacement, //a=pt arrivé, t=temps du déplacement clearInterval(this["inter"+p]) var x=0 var i=10 //vitesse de déplacement du clip "equerre" var ref=this this["inter"+p]=setInterval(function(){ ref[p]=(a-d)/(t)*(x+=i/1000)+d; updateAfterEvent(); if(x>=t){ clearInterval(ref["inter"+p]); this[p]=a; } },i) }
Sur un bouton le code suivant qui au 1° clic (if) déplace dans un premier temps le brasDroit et l'équerre
et au 2° clic, (else) trace une ligne "instantanément" (c'est elle que j'aimerais voir se tracer à une vitesse
égale au déplacement du bras qui tient le crayon ), et déplace le bras sur l'axe y dans une vitesse normale...
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 on (press) { if (trait1 != 4) { varJ=50 trace ("coucou4") brasD_clp.transfo("_x",varJ+varKtremie/10,varJ+varMreculee/10,1,Math.sin) brasD_clp.transfo("_y",varJ+varLcage/10,varJ+varLcage/20,1,Math.sin) equerre.transfo("_x",varJ+varKtremie/10+10,varJ+varMreculee/10,1,Math.sin) trait1=4; } else { moveTo (varJ+varMreculee/10,varJ+varLcage/20); lineStyle(2,0xFF0000,80); lineTo (varJ+varMreculee/10,varJ+varLcage/10); brasD_clp.transfo("_y",varJ+varLcage/20,varJ+varLcage/10,1,Math.sin) gotoAndStop(11); } }
Voilà j'espère être assez clair. :? .. C'est sans doute au niveau de lineTo qu'il y a quelque chose à faire, mais quoi ???

Merci d'avance pour votre aide :D ...
@+Thaisno

27/12/2004, 13h34
bolo

comme ca
http://www.developpez.net/forums/viewtopic.php?t=275854
27/12/2004, 14h05
thaisno

[FLASH MX2004] Simuler le traçage d'une ligne en AS, mais...

Citation:

comme ca
http://www.developpez.net/forums/viewtopic.php?t=275854

Pas mal du tout, :ccool: le principe est là, je vais essayer cet après midi d'adapter celà pour 1 seule ligne... :ange:
Si j'y arrive pas je te refais signe... :oops:
Et si j'y arrive je te refais signe :) comme d'hab.

Merci, et @+ Thaisno
27/12/2004, 14h20
bolo

au lieux de mettre 4 points tu ne mets que 2 points

Voilà, j'ai regardé celà de plus prés et celà donne ceci code ci-dessous pour 1 ligne :D , en effet il suffit de ne donner que 2 points, surtout en ne mettant pas de virgules après le second :nono: .
Pour garder une trace explicite du code j'ai ajouté après les // des notes,
mais il y a des zones que je suis incapable de comprendre :scarymov: ... et j'aimerais bien essayer de comprendre... est-ce que tu peux m'expliquer "please"...???:ange:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
//Créer en AS dessiner une ligne progressivement.txt
point  = [ 
 {x:0, y:0}, 	//xA et yA, du point de départ 
 {x:100, y:100} 	//xB et yB, du point de d'arrivée 
] ; 
 
//var nbr:Number = 4; 
var speed:Number = 1/30; 		//vitesse du dessin de la ligne
var position:Number = 0; 		// ?????
var ptCourant:Number = 0 ; 		// ?????
 
calculePoints (ptCourant) ; 	//var xA:Number, yA:Number, xB:Number, yB:Number; 
 
// Dessine la ligne 				
this.lineStyle(0, 0xFF0000, 100); //type de ligne, couleur, transparence
this.moveTo(xA, yA); 			  //déplace le crayon au point de départ xA, yA
 
_root.onEnterFrame = function() { // ?????
  var x:Number, y:Number ; 
  position+=speed ; 
  if (position > 1-speed) { 
    x = xB ; 
    y = yB ; 
    if (++ptCourant < point.length) { 
    } 
    else delete this.onEnterFrame ; 
    calculePoints (ptCourant) ; 
    position = 0 ; 
  } 
  else { 
    x = barycentre(xA, xB, position); 
    y= barycentre(yA, yB, position); 
  } 
  this.lineTo(x,y); 
} 
//// 
function  barycentre(a:Number,b:Number,t:Number):Number { // ?????
  return (1 - t)*a + t*b; 
} ; 
function calculePoints (a:Number) { //fonction qui affecte les valeurs à chaque point
    xA = point[a].x ; 
    yA = point[a].y ; 
    xB = point[a+1].x ; 
    yB = point[a+1].y ; 
} ;

Merci d'avance et @+ Tahisno :P

27/12/2004, 15h36
bolo

Code:

var position:Number = 0; // ?????

c la position du point

Code:

var ptCourant:Number = 0 ; // ?????

on commance par le point 0

Code:

function barycentre(a:Number,b:Number,t:Number):Number { // ?????

tu ne comprends pas quoi la

c la fonction barycentre ce de la physique

Citation:

Qu'est qu'un segment [AB] ? Réponse : c'est l'ensemble des barycentres des points A et B affectés respectivement des masses (1-t) et t lorsque t varie entre 0 et 1 !
27/12/2004, 15h51
thaisno

Citation:

c la fonction barycentre ce de la physique

je viens de voir çà avec ma fille qui est en 1°S... bon disons que... je passe c'est pas grave... :marteau:
Merci pour tes réponses...c'est sympa. :ccool:
l'essentiel c'est que celà fonctionne. :bravo:

Allez @+ Thaisno

bonjour, :lol:

Citation:

l'essentiel c'est que celà fonctionne

Je crois que j'ai dit une grosse bétise hier :oops: ... car celà fonctionne si l'on part du point 0 mais sinon :nono: ça Mer........
Par contre j'ai continué mes recherches :pc: et je suis tombé la dessus sur un autre forum... et là c'est OK :applo:
:wink: : Simuler le tacer d'une ligne en AS...

Pour tracer des lignes horizontales :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
MovieClip.prototype.traceHorizontale = function(initx, endx, posy, vitesse, precision, sens) { 
   if (!x) { 
      sens ? x = initx : x = endx; 
      this.moveTo(x, posy); 
      this.lineStyle(1, 0x000000, 100); 
   } 
   sens ? cond = (x<endx) : cond = (x>inix); 
   if (cond) { 
      for (i=0; i<vitesse; i++) { 
         sens ? x += (1/precision) : x -= (1/precision); 
         this.lineTo(x, posy); 
      } 
   } 
}; 
 
_root.createEmptyMovieClip("courbe", 0); 
_root.courbe._x = _root.courbe._y = 0; 
_root.courbe.onEnterFrame = function() { 
   _root.courbe.traceHorizontale(0, 200, 100, 100, 20, 1); 
};

et pour tracer des lignes verticales :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
MovieClip.prototype.traceVerticale2 = function(inity, endy, posx, vitesse, precision, sens) { 
   if (!y) { 
      sens ? y = inity : y = endy; 
      this.moveTo(posx, y); 
      this.lineStyle(1, 0x000000, 100); 
   } 
   sens ? cond = (y<endy) : cond = (y>iniy); 
   if (cond) { 
      for (i=0; i<vitesse; i++) { 
       sens ? y += (1/precision) : y -= (1/precision); 
         this.lineTo(posx, y); 
      } 
   } 
}; 
 
_root.createEmptyMovieClip("courbe", 0); 
_root.courbe._x = _root.courbe._y = 0; 
_root.courbe.onEnterFrame = function() { 
   _root.courbe.traceVerticale2(0, 200, 100, 100, 10, 1); 
};

Voilà quelque chose qui devrait en aider pas mal dont moi le premier ! :D

Allez @+ Thaisno :ccool:

28/12/2004, 12h51
bolo

Citation:

Je crois que j'ai dit une grosse bétise hier Embarassed ... car celà fonctionne si l'on part du point 0 mais sinon Nono ça Mer........

je comprends pas ta reflexion
ca marche pour n'importe quelle coordonnées du points
01/01/2005, 17h16
thaisno
Bonjour, et bonne année à tous...:chin:

Citation:

je comprends pas ta reflexion

Si tu reprends mon message du : thaisno Posté le: Lun Déc 27, 2004 14:47
Tu copies le code :bug: et tu le testes en changeant les valeurs du 1° point x,y comme ci dessous, puis tu testes l'animation, tu verras qu'il fait bien le trait attendu :) ... mais... en plus un trait qui repart au point x0,y0 :zekill: ... c'est pour celà que je dit que ca M.....
Code:

1 2 3 4 5 //Créer en AS dessiner une ligne progressivement.txt point = [ {x:500, y:250}, //xA et yA, du point de départ {x:100, y:100} //xB et yB, du point de d'arrivée ] ;
@+Thaisno :D