Début du code : séance 1
- Séance du 18/01/2016:
- Nous allons à présent commencer le codage de notre jeux et cela ce fera étapes par étapes. A chaque étape nous ferons un copier/coller de notre code que nous afficheront.
- Le but de cette prémière étape sera de :
- Mettre une image de fond d'écran.
- Faire apparaître le tireur.
- Mettre une image pour représenter ce tireur.
- Faire déplacer le tireur avec les flèches directionnelles.
- Bloquer le déplacement du tireur à certaines valeurs de «x» afin qu'il ne sorte pas de la fenêtre.
- CODE:
PImage espace;
PImage vaisseau;
int x = 370;
int y = 530;
void setup() {
size(800, 600);
vaisseau = loadImage("vaisseau.png");
espace = loadImage("espace.jpg");
}
void draw() {
image(espace, 0, 0, width, height);
dessinerTireur();
deplacerTireur();
}
void keyPressed() {
if (keyCode == LEFT) {
x=x-10;
} else {
if (keyCode == RIGHT) {
x=x+10;
}
}
}
void dessinerTireur() {
image(vaisseau, x, y, 70, 70);
}
void deplacerTireur() {
if ( x>730) {
x = 730;
}
if( x<10) {
x = 25;
}
}
-
Premierement, notre but fut de mettre une image en fond, afin de représenter l'univers et ainsi de rappeler l'esprit du jeu Space Invaders. Pour cela, il faut d'abord se munir de l'image quelque soit le format ( jpeg, png) car nous avons pas besoin de gérer la transparence. Pour cela, on déclare un objet image appelé « espace » avec la fonction « PImage » , ensuite on glisse notre image dans le sketch processing afin de l'intégrer . On charge l'image dans la case mémoire nommée « espace » grâce à la fonction « loadImage » et dans notre « void draw » on affiche l'image grâce à la fonction « image » avec comme coordonnées ( 0,0 ) ainsi que les paramètres « widht » et « height » pour que l'image prenne la taille de la fenêtre, fenêtre que nous avons définis avec la fonction « size » qui prend comme paramètres une abscisse de 800 et ordonnée de 600.
----> Travail effectué par Nicolas.
-
Pour afficher le tireur, il a fallu déclarer deux variables entière nommée « x » et « y » qui vont etre les coordonnées du tireur. On affecte à la variable « x » la valeur 370 et à la variable « y » la valeur 530. Nous avons choisi ces valeurs pour que lorsque l'on ouvre le programme le tireur soit bien centré et qu'il n'ai pas une position aléatoire dans la fenêtre. Ensuite, pour que ce tireur soit représenté par un vaisseau il a fallu se munir de l'image avec un format (png) pour gérer la transparence par dessus le fond d'écran ( pour cela nous avons utilisé le logiciel photophiltre afin e convertir l'image dans le bon format). Ensuite, on déclare un objet image appelé «vaisseau » avec la fonction « PImage » , ensuite on glisse notre image dans le sketch processing afin de l'intégrer . On charge l'image dans la case mémoire nommée « vaisseau » grâce à la fonction « loadImage » et dans notre « void draw » on affiche l'image grâce à la fonction « image » avec pour coordonnées les variables « x » et « y » et une taille choisie.
---> Travail effectué par Nicolas.
- Une fois le tireur créé, il faut maintenant qu'il se déplace il a fallu utiliser la fonction « Keypressed » prédéfinie dans processing. Dans un « void Keypressed », nous allons utiliser des structures conditionnelles « if ». Lorsque l'on appuie sur la touche directionnelle gauche la variable « x » se décrément de 10 unité et le tireur se déplace vers la gauche et lorsque l'on appuie sur la flèche directionnelle de droite, la variable s'incrémente de 10 unité et le tireur se déplace vers la droite. Pour que processing reconnaisse les touches il a fallu utiliser la méthode « keyCode » prédéfinie dans processing. Donc dans la structure conditionnelle, lorsque l'on appuie sur l'une des deux touches ( keyCode == left ou keyCode == right) alors le tireur se dépace à gauche ou a droite.
----> Travail effectué par Nicolas.
- Pour des raisons conventionnelles, il a fallu limiter le déplacement du tireur afin qu'il ne sorte pas de la fenêtre. Pour cela, dans un « void deplacerTireur » nous avons utilisé des structures conditonnelles « if » pour que lorsque la position en « x » du tireur atteint des valeurs limites ( extrémités de la fenêtre ) alors l'instruction donnée est d'affecter à la variable « x » la valeur extreme de la fenêtre ce qui vas bloquer le déplacement du tireur et ainsi il s'arretera à la limite de la fenêtre et ne la dépassera pas.
---> Travail effectué par Christopher.
- Pour notre prochaine séance l'objectif sera de:
- Faire apparaître les ennemis (balles).
- Faire déplacer aléatoirement les ennemis.
- Faire apparaître un fond étoilé.
- Afficher le tir.