Le blog du garambrogne

Images

Cette image emprutée au projet freecraft contient les differents sprites que nous allons utiliser. L'illustration originale en contient d'autres (il donne des coups de haches, il meurt), mais pour faire simple, il va se contenter de marcher, là. Le principe est simple, nous sommes en perspective isométrique, il n'a donc pas de changement de taille si le personnage est plus ou moins loin. Les caracteristiques du sprite^[1] sont sa position, son direction, son étape dans la marche. Pour sa position, on va utiliser les coordonées du sprite, pour la direction on va choisir la colonne adéquat, et pour l'action, on va choisir la ligne.

Mise en place dans Flash

Séquences

Dans flash, une séquence est crée par angle, et dans chacune de ses séquences, est placé une image par frame de l'action. Ensuite, une autre séquence est crée, avec les differents ensemble d'actions. C'est une méthode "à la Flash" de faire un tableau de tableau avec des images.

Code

Différentes variables globales sont utilisés^[2] :

b : flag indiquant si le personnage bouge. alpha : direction du personnage pas : distance parcouru à chaque ticks sprite : séquence de séquence contenant les images.

L'Action Script est parfois un peu rustre, il ne possede pas de fonction *modulo*, mais bon, ce n'est pas trop dur à implémenter. A chaque étape, le personnage regarde où est sa destination (là où l'utilisateur a cliqué avec la souris), se déplace, et bouge les jambes, et ce, jsqu'à ce que la distance qui le sépare de l'arrivée soit inferieur au "pas".

geshi actionscript
//parametrages
t=0;
croix._visible=0;
pas = 5;
b = 0;
//routines
function modulo(n,max){
	if (n >= max){
		n -= max;
		n = modulo(n,max);
	}
	if (n < 0){
		n += max;
		n = modulo(n,max);
	}
	return n
}
//actions
function tourne(a){
	alpha = modulo(8*a/(2*Math.PI)+2,8)+1
	sprite.gotoAndStop(alpha);
}
function orientation(xx,yy){
	dx = sprite._x-xx;
	dy = sprite._y-yy;
	alpha = modulo(int( 8*Math.atan2(dy,dx)/(2*Math.PI)+6.5),8)+1;
	sprite.gotoAndStop(alpha);
}
function deplacement(){
	if(b){
		dx = croix._x-sprite._x;
		dy = croix._y-sprite._y;
		angle = int(8*Math.atan2(dy,dx)/(2*Math.PI)+0.5)*2*Math.PI/8;
		distance = Math.sqrt (dx*dx+dy*dy);
		if (distance < pas){
			b=0;
			sprite.etape.gotoAndStop(1);
			croix._visible=0;
		}
		else{
			px=Math.cos (angle)*pas;
			py=Math.sin(angle)*pas;
			sprite._x += px;
			sprite._y += py;
			tourne(angle);
			sprite.etape.gotoAndStop( modulo(t,4)+2 );
		}
	}
	else{
		orientation(_xmouse,_ymouse);
	}
}
function bouge(){
	t += 1;
	deplacement();
}
//gestion du clic souris
function clic(){
	croix._x = _xmouse;
	croix._y = _ymouse;
	croix._visible = 1;
	b = 1;
}

Exemple

Le premier chiffre de debug indique la direction, le second est un compteur de temps.

Sources

Evolutions

Les étapes suivantes sont la gestion du devant/derriere pour les éléments de décors, puis la recherche de chemin optimal avec contournement d'obstacle. Les bastons aussi.