Gestion des Images avec BlitzMax/Image et Mouvement
Un article de Games Creators Network.
Gestion des Images avec BlitzMax
<< Précédent | Sommaire | Suivant >>
[modifier] Deplacement
Le code source suivant permet ainsi de comprendre comment déplacer une image sur un décor.Pour le missile, au lieu d'afficher une image, nous avons décidé d'utiliser une des fonctions natives de BlitzMax qui est DrawRect, qui permet d'afficher un rectangle.
Le mouvement d'une image, sous BlitzMax et dans la plupart des codes, se fait via l'utilisation de variables que l'on incrèmente est qui indique la position de l'image dans la fenetre.
Pour expliquer, à chaque tour de la boucle principale, on affiche l'image de l'avion d'aprés ces coordonnées donc il suffit de changer ces coordonnées pour le faire avancer.
Code Source commenté :
Strict
Graphics 800, 600, 0
'Déclarations des variables
Local fond:TImage 'Pointeur d'image du fond d'écran
Local image:TImage 'Pointeur d'image du charset
Local avion:TImage 'Pointeur d'image de l'avion
Local bombe:TImage 'Pointeur d'image de la bombe
Local xx,yy,Map_Y,Map_X:Int 'Variables utilisés lors de l'affichage des tuiles à l'écran
Global Map_Level,Map_Height, Map_Width:Int
'Variables permettant d'avoir des informations sur le niveau
Global PosX_Avion,PosY_Avion:Int 'Position de l'avion
Global PosX_Bombe,PosY_Bombe:Int 'Position de la Bombe
Global PosX_Tir,PosY_Tir:Int 'Position du Tir
Global Bombe_launch:Byte 'Permet de savoir si une bombe a été largué
Global Tir_Launch:Byte 'Permet de savoir si un missile a été lancé
Global Mode_deplacement:Byte 'Variable contenant le mode de déplacement (cf mi-code)
Global Bombe_rotation:Int 'Variable contenant l'angle de rotation de la bombe
'Initialisation des variables
PosX_Avion=0
PosY_avion=12
Mode_deplacement=0
Bombe_launch=0
Tir_launch=0
Bombe_rotation=0
'Chargement des images
SetMaskColor 255,0,0
fond=LoadImage("gfx/fond.png")
avion=LoadImage("gfx/avion.png")
bombe=LoadImage("gfx/bomb.png")
SetMaskColor 255,255,255
image=LoadAnimImage("gfx/tiles.png",48,48,0,8)
'Chargement du 1er niveau
RestoreData Level1 'Lecture des données dans le Label
ReadData Map_Height
ReadData Map_Width
Global Map[Map_Width,Map_Height]'Création du tableau contenant les tuiles de la map
Local TileX,TileY:Int 'Remplissage du tableau grace aux data du Label
For TileY = 0 To Map_Height-1
For TileX = 0 To Map_Width-1
ReadData Map[TileX,TileY]
Next
Next
'Boucle principale
While Not KeyHit(KEY_ESCAPE)
' On efface l'écran
Cls
' Vérification des touches appuyées
' Si la barre espace est appuyé et qu'aucune bombe n'est déjà larguée
If KeyDown(KEY_SPACE) And bombe_launch=0
bombe_launch=1
PosY_Bombe=PosY_Avion+35
If mode_deplacement=0
PosX_Bombe=PosX_Avion+45
Else
PosX_Bombe=PosX_Avion-45
EndIf
EndIf
' Si le bouton gauche de la souris est appuyé et qu'aucun missile n'est lancé
If KeyDown(KEY_MOUSELEFT) And tir_launch=0
Tir_Launch=1
PosY_Tir=PosY_Avion+25
If mode_deplacement=0
PosX_Tir=PosX_Avion+107
Else
PosX_Tir=PosX_Avion-107
EndIf
End If
' Affichage du premier layer : tuiles du paysage
xx=0
yy=0
For Map_Y= 12 To 540 Step 48 ' Step 48 car la tuile est haute de 48u
For Map_X=13 To 541 Step 48 ' Step 48 car la tuile est large de 48u
DrawImage image, Map_X, Map_Y, Map[xx,yy] ' Affichage de la tuile correspondante
xx:+1
Next
xx=0
yy:+1
Next
' Le mode de déplacement correspond à la direction qu'il prend
' 0 : de gauche à droite
' 1 : de droite à gauche
If mode_deplacement= 0 Then
'Affichage du second layer : l'avion
SetScale .5,.5 'On divise la taille de l'image par 2
DrawImage avion, PosX_Avion,PosY_Avion
' si une bombe est larguée, on l'affiche
If bombe_launch=1
If bombe_rotation < 90 Then
bombe_rotation:+1
EndIf
' On définit l'angle de rotation courant
SetRotation bombe_rotation
SetScale .3,.3
DrawImage bombe, PosX_Bombe,PosY_Bombe
PosY_Bombe:+1
SetRotation 0
EndIf
' si un missile est lancé, on l'affiche
If tir_launch=1
SetColor 50,50,50
DrawRect PosX_Tir,PosY_Tir,10,5
PosX_Tir:+3
EndIf
PosX_Avion:+1
' Si l'avion se trouve hors de l'écran, il est repositionné un rang en dessous.
' Puis on change le mode de déplacement de facon que si il se déplacait de droite
' à gauche, il se déplace de gauche à droite
If PosX_Avion >610 Then
PosY_Avion:+48
PosX_Avion=680
Mode_deplacement=1
End If
ElseIf mode_deplacement=1 Then
' Affichage du second layer : l'avion
' On divise la taille de l'image par 2 mais en mettant une valeur négative pour l'échelle des
' abscisses, cela inverse horizontalement l'image.
SetScale -.5,.5
DrawImage avion, PosX_Avion,PosY_Avion
' Si une bombe est larguée, on l'affiche
If bombe_launch=1
If bombe_rotation > -90 Then
bombe_rotation:-1
EndIf
' On définit l'angle de rotation courant
SetRotation bombe_rotation
SetScale -.3,.3
DrawImage bombe, PosX_Bombe,PosY_Bombe
PosY_Bombe:+1
SetRotation 0
EndIf
' Si un missile est lancé, on l'affiche
If tir_launch=1
SetColor 50,50,50
DrawRect PosX_Tir,PosY_Tir,10,5
PosX_Tir:-3
End If
PosX_Avion:-1
' Si l'avion se trouve hors de l'écran, il est repositionné un rang en dessous.
' Puis on change le mode de déplacement de facon que si il se déplacait de droite
' à gauche, il se déplace de gauche à droite
If PosX_Avion < -100 And Mode_deplacement=1 Then
PosY_Avion:+48
PosX_Avion=-100
Mode_deplacement=0
End If
End If
'Affichage du troisième layer : fond
SetColor 255,255,255 'On définit la couleur courante
SetScale 1,1 'On définit l'échelle en 1:1
DrawImage fond, 0,0
Flip
FlushMem
Wend
End
'Map Niveau 1
#Level1
DefData 12
DefData 12
DefData 7,7,7,7,7,7,7,7,7,7,7,7
DefData 7,7,7,7,7,7,7,7,7,7,7,7
DefData 7,7,7,7,7,7,7,7,7,7,7,7
DefData 7,7,7,7,7,7,7,7,7,7,7,7
DefData 7,7,7,7,7,7,7,7,7,7,7,7
DefData 7,7,7,7,7,7,7,7,7,7,7,7
DefData 7,7,7,7,7,7,7,7,7,7,7,7
DefData 7,7,7,7,7,7,7,7,7,7,7,7
DefData 7,7,7,7,7,7,7,7,7,7,2,7
DefData 7,2,3,5,6,7,7,7,7,2,1,7
DefData 7,1,1,1,1,7,1,7,2,1,1,7
DefData 7,0,1,0,1,0,1,1,1,0,0,7
[modifier] Rotation
Afin d'apprendre à gérer la rotation d'une image, nous allons mettre en place un effet lors du largage de la bombe. En fait, la bombe fera une rotation de 90° sur elle même afin de se retrouver perpendiculaire au sol.
Ce code change du précédent par l'ajout de quelques lignes. Celles-ci permettent de faire tourner la bombe. La commande utilisée est SetRotation. Elle permet de définir l'angle de rotation courant. Ainsi, cet angle est appliqué à tous les affichages suivants. Donc si vous voulez faire tourner une image mais pas les suivantes, pensez à rétablir l'angle de rotation à 0 aussitôt après l'affichage de l'image.
Pour faire tourner quelque chose sur lui même, il suffirait d'utiliser une variable commencant à 0 et se finissant à 359, et à chaque tour de boucle de l'incrémenter de 1 ou plus (pour aller plus vite), puis avant d'afficher l'image, de définir l'angle de rotation courant via SetRotation notre_variable_incrementé.
Code Source commenté :
Strict
Graphics 800, 600, 0
'Déclarations des variables
Local fond:TImage 'Pointeur d'image du fond d'écran
Local image:TImage 'Pointeur d'image du charset
Local avion:TImage 'Pointeur d'image de l'avion
Local bombe:TImage 'Pointeur d'image de la bombe
Local xx,yy,zz:Int 'Variables temporaires
Local Map_Y,Map_X:Int 'Variables utilisés lors de l'affichage des tuiles à l'écran
Global Map_Level,Map_Height, Map_Width:Int 'Variables permettant d'avoir des informations sur le niveau
Global PosX_Avion,PosY_Avion:Int 'Position de l'avion
Global PosX_Bombe,PosY_Bombe:Int 'Position de la Bombe
Global PosX_Tir,PosY_Tir:Int 'Position du Tir
Global Bombe_launch:Byte 'Permet de savoir si une bombe a été largué
Global Tir_Launch:Byte 'Permet de savoir si un missile a été lancé
Global Mode_deplacement:Byte 'Variable contenant le mode de déplacement (cf mi-code)
Global Bombe_rotation:Int 'Variable contenant l'angle de rotation de la bombe
'Initialisation des variables
PosX_Avion=0
PosY_avion=12
Mode_deplacement=0
Bombe_launch=0
Tir_launch=0
Bombe_rotation=0
'Chargement des images
SetMaskColor 255,0,0
fond=LoadImage("gfx/fond.png")
avion=LoadImage("gfx/avion.png")
bombe=LoadImage("gfx/bomb.png")
SetMaskColor 255,255,255
image=LoadAnimImage("tiles/tiles.png",48,48,0,8)
'Chargement du 1er niveau
RestoreData Level1 'Lecture des données dans le Label
ReadData Map_Height
ReadData Map_Width
Global Map[Map_Width,Map_Height] 'Création du tableau contenant les tuiles de la map
Local TileX,TileY:Int 'Remplissage du tableau grace aux data du Label
For TileY = 0 To Map_Height-1
For TileX = 0 To Map_Width-1
ReadData Map[TileX,TileY]
Next
Next
'Boucle principale
While Not KeyHit(KEY_ESCAPE) And PosY_Avion<550
' On efface l'écran
Cls
' Vérification des touches appuyées
' Si la barre espace est appuyé et qu'aucune bombe n'est déjà larguée
If KeyDown(KEY_SPACE) And bombe_launch=0
PosY_Bombe=PosY_Avion+35
If mode_deplacement=0
PosX_Bombe=PosX_Avion+45
bombe_launch=1
bombe_rotation=0
Else
PosX_Bombe=PosX_Avion-45
bombe_launch=2
bombe_rotation=0
EndIf
EndIf
' Si le bouton gauche de la souris est appuyé et qu'aucun missile n'est lancé
If KeyDown(KEY_MOUSELEFT) And tir_launch=0
PosY_Tir=PosY_Avion+25
If mode_deplacement=0
PosX_Tir=PosX_Avion+107
Tir_Launch=1
Else
PosX_Tir=PosX_Avion-107
Tir_Launch=2
EndIf
End If
'Affichage du premier layer : le ciel
For Map_Y= 12 To 540 Step 48 ' Step 48 car la tuile est haute de 48u
For Map_X=13 To 541 Step 48 ' Step 48 car la tuile est large de 48u
DrawImage image, Map_X, Map_Y, 7 ' Affichage de la tuile correspondante
Next
Next
'Initialisation des collisions du layer 1
ResetCollisions 1
' Affichage du second layer : tuiles du paysage
xx=0
yy=0
For Map_Y= 12 To 540 Step 48 ' Step 48 car la tuile est haute de 48u
For Map_X=13 To 541 Step 48 ' Step 48 car la tuile est large de 48u
If Map[xx,yy]<> 7 Then
' Affichage de la tuile correspondante
DrawImage image, Map_X, Map_Y, Map[xx,yy]
' On écrit dans le layer 1 de collisions l'image
' de la frame Map[xx,yy]
' au point Map_X, Map_Y
CollideImage image, Map_X, Map_Y,Map[xx,yy],0,1
EndIf
xx:+1
Next
xx=0
yy:+1
Next
' Le mode de déplacement correspond à la direction qu'il prend
' 0 : de gauche à droite
' 1 : de droite à gauche
If mode_deplacement= 0 Then
'Affichage du troisième layer : l'avion
SetScale .5,.5 'On divise la taille de l'image par 2
DrawImage avion, PosX_Avion,PosY_Avion
' Si une bombe est larguée, on continue à la faire tourner jusqu'a ce qu'elle soit
' perpendiculaire au sol
If bombe_launch=1
If bombe_rotation < 90 Then
bombe_rotation:+1
EndIf
EndIf
' si un missile est lancé, on l'affiche
If tir_launch=1
SetColor 50,50,50
DrawRect PosX_Tir,PosY_Tir,10,5
PosX_Tir:+3
EndIf
PosX_Avion:+1
' Si l'avion se trouve hors de l'écran, il est repositionné un rang en dessous.
' Puis on change le mode de déplacement de facon que si il se déplacait de droite
' à gauche, il se déplace de gauche à droite
If PosX_Avion >610 Then
PosY_Avion:+48
PosX_Avion=680
Mode_deplacement=1
End If
ElseIf mode_deplacement=1 Then
' Affichage du troisième layer : l'avion
' On divise la taille de l'image par 2 mais en mettant une valeur négative pour l'échelle des
' abscisses, cela inverse horizontalement l'image.
SetScale -.5,.5
DrawImage avion, PosX_Avion,PosY_Avion
' Si une bombe est larguée, on continue à la faire tourner jusqu'a ce qu'elle soit
' perpendiculaire au sol
If bombe_launch=2
If bombe_rotation > -90 Then
bombe_rotation:-1
EndIf
EndIf
' Si un missile est lancé, on l'affiche
If tir_launch=2
SetColor 50,50,50
DrawRect PosX_Tir,PosY_Tir,10,5
PosX_Tir:-3
End If
PosX_Avion:-1
' Si l'avion se trouve hors de l'écran, il est repositionné un rang en dessous.
' Puis on change le mode de déplacement de facon que si il se déplacait de droite
' à gauche, il se déplace de gauche à droite
If PosX_Avion < -100 Then
PosY_Avion:+48
PosX_Avion=-100
Mode_deplacement=0
End If
End If
'On teste si il n'y a aucune collision dans le layer 1 avec l'image de la bombe
' ou si la bombe n'est plus dans l'écran
If CollideImage(bombe,PosX_Bombe,PosY_Bombe,0,1,0) Or PosY_Bombe>589 Then
SetScale 2,2
SetRotation 0
'DrawText "READY",20,20
'Disparition de la bombe
bombe_launch=0
'Calcul de la case du tableau correspondante au tile en dessous de la bombe
xx=(PosX_Bombe-13)/48
If xx>=11 Then xx=11
If xx<=0 Then xx=0
yy=(PosY_Bombe-12)/48
If yy>=11 Then yy=10
'Le tile est explosé vis à vis de la bombe, il disparait et devient du ciel
Map[xx,yy+1]=7
Else
' Si une bombe est larguée, on l'affiche
If bombe_launch>=1
' On définit l'angle de rotation courant
SetRotation bombe_rotation
' Définition de l'orientation de la bombe en fonction de l'orientation de l'avion
' au moment du largage
If bombe_launch=1 Then
SetScale .3,.3
ElseIf bombe_launch=2 Then
SetScale -.3,.3
EndIf
DrawImage bombe, PosX_Bombe,PosY_Bombe
PosY_Bombe:+1
SetRotation 0
EndIf
EndIf
' Est ce qu'un tir a été lancé ?
If tir_launch>=1 Then
yy=(PosY_Tir-12)/48
For xx=0 To 11
zz=xx*48+12
If Map[xx,yy]<>7 Then
If tir_launch=1 Then
If PosX_Tir>zz+2 Then
tir_launch=0
Map[xx,yy]=7
EndIf
ElseIf tir_launch=2 Then
If PosX_Tir<zz-2 Then
tir_launch=0
Map[xx,yy]=7
EndIf
EndIf
EndIf
Next
EndIf
If PosX_Tir<10 Or PosX_Tir>590 Then
tir_launch=0
EndIf
'Affichage du quatrième layer : fond
SetColor 255,255,255 'On définit la couleur courante
SetScale 1,1 'On définit l'échelle en 1:1
DrawImage fond, 0,0
Flip
FlushMem
Wend
End
'Map Niveau 1
#Level1
DefData 12
DefData 12
DefData 7,7,7,7,7,7,7,7,7,7,7,7
DefData 7,7,7,7,7,7,7,7,7,7,7,7
DefData 7,7,7,7,7,7,7,7,7,7,7,7
DefData 7,7,7,7,7,7,7,7,7,7,7,7
DefData 7,7,7,7,7,7,7,7,7,7,7,7
DefData 7,7,7,7,7,7,7,7,7,7,7,7
DefData 7,7,7,7,7,7,7,7,7,7,7,7
DefData 7,7,7,7,7,7,7,7,7,7,7,7
DefData 7,7,7,7,7,7,7,7,7,7,2,7
DefData 7,2,3,5,6,7,7,7,7,2,1,7
DefData 7,1,1,1,1,7,1,7,2,1,1,7
DefData 7,0,1,0,1,0,1,1,1,0,0,7
- Dernière modification de cette page le 25 octobre 2005 à 11:21.
- Cette page a été consultée 2 019 fois.
- Contenu disponible sous Attribution-Noncommercial-Share Alike 3.0 .
- À propos de Games Creators Network
- Avertissements
Image du mois: «Snowball: un prototype de jeu développé avec