Convertir des tiles 2D en tiles 2D Isométrique.

**dxtreme01** · 05/02/2014, 14h03

Bonjour,

Je suis actuellement en train de coder une petit jeux en 2D Isométrique et je me suis renseigner sur le fonctionnement et tout, j'ai déjà commencer depuis un moment, et maintenant je suis en train de faire la partie graphique du programme, sauf qu'actuellement j'ai un problème, et j'ai beau chercher des solutions sur le net, je ne trouve désespérément rien..

J'ai lut que pour passer d'une tile 2D à une en tile 2D Isométrique il fallait suivre ce procéder:

C'est ce que j'ai fait au début, j'ai créer une méthode pour transformer mon image (D'abord la rotation):

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
 
private BufferedImage convertTo2Diso(BufferedImage image, double radian) {
	AffineTransform affineTransform = new AffineTransform();
	affineTransform.rotate(radian, image.getWidth() / 2, image.getHeight() / 2);
	AffineTransformOp op = new AffineTransformOp(affineTransform, AffineTransformOp.TYPE_BILINEAR);
	image = op.filter(image, null);
 
	return image;
}

Sauf que mon résultat était le suivant:

Le problème venait de fait que la taille de mon image augmentais et donc les coins sortait de la zone de mon BufferedImage,...

J'ai alors changé de procéder pour opter pour celui que quelqu'un m'avais conseiller:

1) Créer une image plus grande que l'image [UN] avec comme largeur et hauteur sqrt(2)c. Image qu'on va nommer Image [DEUX].
2) On copie l'image [UN] au milieu de l'image [DEUX].
3) On fait la rotation de de l'angle voulut sur l'image [DEUX].
4) On retourne notre image [DEUX].

J'ai alors commencer par créer la deuxième image en utilisant la formule mathématique pour avoir la taille exact qu'elle devais avoir en hauteur et largeur:
(racine carré de 2) fois coté.
en code: sqrt(2)*c

Çà m'a donner ce code pour créer mon image deux:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
BufferedImage imageIso2D = new BufferedImage((int) (Math.sqrt(2) * image.getWidth()), (int) (Math.sqrt(2) * image.getHeight()), BufferedImage.TYPE_INT_RGB);

Jusque là tout vas bien j'ai un bon retour d'image deux:

A droite donc mon image de base, et à gauche l'image ou devrais-je dire la "zone" dans la quel mon image devrais apparaître sous la forme d'un losange.

La prochaine étape était donc de "Copier" mon image au milieu de le la zone verte sachant que ce sont tout les deux des BufferedImage...
Mon code se présentais donc comme cela:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
private BufferedImage convertTo2Diso(BufferedImage image2D, double radian) {
	BufferedImage image2DiIso = new BufferedImage((int) (Math.sqrt(2) * image.getWidth()), (int) (Math.sqrt(2) * image.getHeight()), BufferedImage.TYPE_INT_RGB);
	AffineTransform affineTransform = new AffineTransform();
 
	// Copier image2D au milieu de image2Diso
 
	affineTransform.rotate(radian, image.getWidth() / 2, image.getHeight() / 2);
	AffineTransformOp op = new AffineTransformOp(affineTransform, AffineTransformOp.TYPE_BILINEAR);
 
	image2D = op.filter(image, null);
 
	return image2Diso;
}

Il était donc temps de remplacer "// Copier image2D au milieu de image2Diso"
par le code qui allait effectuer cette opération de copie.

Au moment de le faire, je suis rester pendant quelques minutes le cerveau déconnecter, tout simplement parce-que je n'avais aucune idée de comment faire, j'ai alors commencer à regarder toute les méthodes que je pouvais appliquer à ma BufferedImage et je n'ai rien trouver qui se rapprocher d'un "copier" ou d'un "fusionner"...

Voilà tout j'aimerais bien que quelqu’un qui à la solution à ce problème ou bien qui à déjà été confronter à ce soucis et qui en à la solution m'explique comment faire,...

Voilà tout, merci d'avoir lut mon petit message et je vous remercie d'avance pour vos réponses!

dxtreme01.

**wax78** · 05/02/2014, 14h34

Euh c'est bien détaillé comme problème, peut être trop ce qui fait que je me demande ou est la question pour finir

.

Ton problème est de copier une imagebuffered dans une autre ?

Si oui il faut recuperer l'object Graphics (ou graphics2D) de la buffered image de destination et utilises ses methodes. (Et non filter comme je crois que tu essayé de le faire ?) Le tout bien entendu pouvant utiliser ton affinetransform.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

image2DiIso.getGraphics().drawImage(...);

Donc au final tu auras quelque chose qui ressemble a :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
	private static BufferedImage convertTo2Diso(BufferedImage image2D, double radian) {
		BufferedImage image2DiIso = new BufferedImage((int) (Math.sqrt(2) * image2D.getWidth()), (int) (Math.sqrt(2) * image2D.getHeight()), BufferedImage.TYPE_INT_RGB);
		Graphics2D outgrap = (Graphics2D)image2DiIso.getGraphics();
		AffineTransform affineTransform = new AffineTransform();
		// Copier image2D au milieu de image2Diso
		affineTransform.translate(image2DiIso.getWidth()/2, 0);
		affineTransform.rotate(radian, 0, 0);
		outgrap.setTransform(affineTransform);
		outgrap.drawImage(image2D,0,0, null);
		return image2DiIso;
	}