Comparar commits

...

Autor SHA1 Mensaje Fecha
  Christophe Vandenabeele 1e849cd3fb Solution retravailée au cours hace 3 años
  Christophe Vandenabeele 3427c26885 premier challenge en cours hace 3 años
  Lapin-Blanc d0b23b4369 updated image hace 3 años
  Lapin-Blanc 7143ed4d5e updated instructions hace 3 años
  Lapin-Blanc 514bfc1c9f put instructions in readme hace 3 años
  Lapin-Blanc 995c3cc308 updated chapitre 1 start hace 3 años
  Lapin-Blanc 8a2dac2bc3 Updated readme hace 3 años
  Lapin-Blanc 0a4ef519ff MIse à jour hace 3 años
  Lapin-Blanc 84dee5e4db Mise à jour du readme hace 3 años
  Lapin-Blanc a65579a2b1 removed useless README hace 3 años
Se han modificado 4 ficheros con 176 adiciones y 161 borrados
Dividir vista
  1. +1
    -1
      .gitignore
  2. +153
    -8
      README.md
  3. +22
    -0
      birdie.py
  4. +0
    -152
      chapitre_1.md

+ 1
- 1
.gitignore Ver fichero

@@ -3,7 +3,7 @@
__pycache__/
*.py[cod]
*$py.class
.vscode/
# C extensions
*.so



+ 153
- 8
README.md Ver fichero

@@ -1,10 +1,155 @@
# Introduction
# Partie 1
## Pour commencer

- Description de l'environnement de travail : python3.9, pip, virtualenv et vs code
- Principe du projet par changements successifs de commit
- Ètapes initiales :
- Fork et clonage du dépôt du projet
- Ouverture du projet dans VS Code
- Installation de l'environnement et des dépendances
- Passage sur le premier tag pour la première partie
Pour réaliser votre programme, vous allez devoir vous servir des modules fournis par **Pygame Zero** que vous avez installés durant l'introduction.

La manière d'utiliser la bibliothèque est la suivante :
- À la première ligne de votre script, il faut inporter le module **pgzrun**
- À la dernière ligne, il faut appeler la méthode **go()** de ce module, qui est comme une fonction attachée au module, et que l'on invoque avec la *notation pointée*.

Voici donc à quoi devrait ressembler le squelette de tout programme de jeu basé sur *pgzrun*.

```python
import pgzrun

# Le corps du programme devrait se trouver ici...

pgzrun.go()
```

L'exécution d'un tel programme devrait d'ailleur faire apparaître une fenêtre au fond noir et dont le titre est *Pygame Zero Game*
> - Modifiez maintenant le script `birdie.py`, selon le squelette décrit ci-dessus.
> - Entre la première et la dernière ligne (corps du programme), rédigez le code suivant :

```python
TITLE = "Paf l'oiseau"
WIDTH = 400
HEIGHT = 708
```

> - Enregistrez votre fichier,
> - Exécutez-le pour voir le résultat.

Vous devriez voir une fenêtre vide apparaître. Pouvez-vous comprendre ce que fait chaque ligne de code ?

> - Quittez la fenêtre,
> - Effectuez quelques modifications sur les lignes de votre programme et exécutez à nouveau celui-ci, pour vérifier l'effet attendu.
> - N'oubliez pas de quitter la fenêtre de jeu entre chaque tentative.

## Afficher un arrière-plan

> Ajoutez ces lignes à la fin de votre programme. Assurez-vous de bien respecter l'indentation.

```python
def draw():
screen.blit('cascade', (0, 0))
```

Le mot clef **`def`** crée une fonction. Pour rappel, une fonction est une manière de grouper plusieurs instructions. La fonction que nous créons ici s'appelle **`draw`** (dessiner). Il s'agit d'un nom prédéfini, et il faut une fonction nommée de cette manière si vous voulez que **pgzero** puisse dessiner quoi que ce soit.
La première et unique instruction de la fonction commence par **`screen.blit`**. Elle dit à Pygame Zero de dessiner quelque chose sur l'écran.

> Exécutez le programme tel quel pour voir le résultat. Vous devriez voir l'image d'une cascade à l'intérieur de votre fenêtre. Comme précédemment, essayez de
> modifier les valeurs utilisées entre les parenthèses pour comprendre le rôle de chacune d'elles.

Vous pouvez télécharger vos propres images, et essayer de les utiliser en tenant compte de leurs tailles.

*NOTE : pgzero cherche après les éléments graphiques dont il a besoin à l'intérieur d'un dossier qui **doit** s'appeler **images***

## Ajouter l'oiseau

> Après la définition de la fonction *`draw`*, ajoutez la ligne suivante :

```python
bird = Actor('bird1', (75, 350))
```

Cette ligne ne doit pas être indentée, elle est *hors* de la fonction. Son instruction ne sera exécutée qu'une seule fois, au lancement initial du programme, et définit un **`Actor`**, nommé **bird**. **`Actor`** est un élément de *Pygame Zero*, mais bird est une variable pour désigner l'object *Actor* créé. On peut choisir n'importe quel nom celle-ci. Par exemple, modifions 'bird' en 'titi'.

***ATTENTION*** : il faut cependant respecter les règles de nommage des variables python : pas d'espace, de caractères accentués, etc.

> Exécutez à nouveau votre programme. Que se passe-t-il ?

En fait, il ne devrait rien se passer de différent. Nous avons défini un **objet** de type **Actor**, et c'est tout. Si nous voulons voir apparaître cet objet, il faut appeler sa méthode **`draw`** au bon endroit, dans la fonction **`draw`** principale. Cela peut paraître un peu confus, mais voyez les choses comme ceci :
pendant l'on dessine (*draw*) la fenêtre principale du jeu, on demande à dessiner l'objet de type **Actor** en appelant la méthode draw de celui-ci de la manière suivante : `titi.draw()`.

> Mettez à jour votre fonction **`draw`** pour refléter ces explications. Vous devriez obtenir quelque chose comme ceci :

```python
def draw():
screen.blit('background', (0, 0))
titi.draw()
```

> Une fois que cela fonctionne, expérimentez à nouveau avec les différentes valeurs entre parenthèse (bird1, 75, 350) pour parfaitement comprendre leurs rôles.
> Essayez de placer l'oiseau dans chacun des coins de la fenêtre
> Que se passe-t-il si l'on intervertit les deux lignes à l'intérieur de la fonction `**draw**` ? Pourquoi ?

<img alt="Titi dans son décor" src="https://i.imgur.com/oyjY2HY.png" width=250 />

## Faisons se déplacer l'oiseau

Pour déplacer l'oiseau, nous allons nous servir de la souris. Ajoutons une nouvelle fonction. Les fonctions peuvent-être placées dans n'importe quel ordre, mais conventionnellement, avant la fonction **`draw`** convient bien.

> Écrivez le code suivant à l'endroit suggéré :

```python
def on_mouse_down():
print('Clic souris !')
titi.y -= 50 # équivalent à titi.y = titi.y - 50
```

Tous les objets de type **Actor** ont une position **x** et **y**. Comme nous avons créé titi avec `titi = Actor(...`, il est un **Actor**. La valeur **x** correspond à la position horizontale de l'acteur (gauche/droite), alors que la valeur **y** correspond à la position verticale (haut/base).

> Lancez le jeu et cliquez dans la fenêtre pour faire bouger l'oiseau. Que se passe-t-il en si l'on remplace 50 par une autre valeur ?
> Arrivez-vous à faire se déplacer l'oiseau horizontalement ? En sens inverse ?
> L'instruction print est censée afficher 'Clic souris !'. Pouvez-vous voir cela ?

La fonction **`on_mouse_down`** est *appelée* à chaque fois que l'on clique. Lorsqu'une fonction est appelée, l'ensemble des instructions qu'elle contient sont exécutées. Si l'on veut donner l'impression que l'oiseau se déplace de manière fluide, il faut utiliser de petites valeurs de décalage, et cliquer rapidement à de nombreuses reprises...

> Essayez de faire se déplacer l'oiseau de manière fluide...

De même que la fonction **`on_mouse_down`** est appelée lorsque l'on clique, la fonction **`update`**, si elle est définie, est appelée *automatiquement* ne nombreuses fois par seconde (60x normalement).

> Définissez votre propre fonction **`update`** comme suit :

```python
def update():
titi.y += 1
```

> ***AVANT*** de lancer votre programme, essayez de deviner comment il va se comporter...

De nouveau, que se passe-t-il si vous modifier la valeur 1 par une valeur plus grande ? Pour contrôler plus efficacement la vitesse de chute de notre oiseau, nous allons lui *attacher* une variable **`speed`**, de la même manière que pour **x** et **y**. Cette variable est comme un curseur dont on pourra augmenter ou diminuer la valeur pour contrôler la vitesse de chute.

> Ajoutez cette ligne en fin de fichier, mais toujours avant **`pgzrun.go()`** bien sûr :

```python
titi.speed = 1
```

On a choisi le nom **speed** car il reflète l'idée de vitesse, mais comme c'est une variable, on aurait pu choisir n'importe quel autre nom respectant les règles habituelles.

Il ne vous reste plus qu'à modifier la fonction **`update`** pour qu'elle utilise cette variable à la place que la valeur fixe '1'.

```python
def update():
titi.y += titi.speed
```

En utilisant la variable `titi.speed` dans la fonction, on utilise la valeur attribuée à cette variable. Ainsi, chaque fois que la fonction **`update`** est appelée (60x par secondes), la position **y** de l'oiseau est modifié selon la valeur de **speed**, quelle que soit celle-ci.
Cela veut dire que **speed** peut changer pendant que le jeu est en train de tourner !

> Expérimentez avec les différentes valeur pour équilibrer le valeurs de jeu (effet du clic, vitesse de chute, ...)

![L'oiseau qui bouge](https://i.imgur.com/Jx9EDww.gif)

## Challenges
> Il vous est conseillé de développer ces différents challenges dans des branches autonomes, par exemple chapitre-1-challenge-1, etc.
> Ainsi, vous garder votre travail de base tel quel et pouvez travailler chaque challenge individuellement.

- Modifiez tout le jeu pour le faire fonctionner de manière horizontale.
- Arrangez-vous pour que l'oiseau stoppe tout mouvement si l'on clique dans la fenêtre.
- Arrangez-vous pour que quand vous gardez le bouton de la souris enfoncé, l'oiseau arrête de bouger, mais que quand vous relâchez le bouton, il recommence à bouger. (Indice : vous aurez besoin d'une nouvelle fonction : **`on_mouse_up`**)
- Ajoutez un autre oiseau, se déplacant à une autre vitesse,
- Arrangez-vous pour que quand un oiseau dépasse les limites de l'écran, il réapparaisse de l'autre côté. (Indice : vous allez devoir vous servir de l'instruction **`if`**)
- Arangez-vous pour qu'à chaque clic, l'oiseau accélère...

+ 22
- 0
birdie.py Ver fichero

@@ -0,0 +1,22 @@
import pgzrun

TITLE = "Paf l'oiseau"
WIDTH = 400
HEIGHT = 708

def on_mouse_down():
print('Clic souris !')
titi.y += 50

def update():
titi.x += titi.vitesse

def draw():
screen.blit('background', (0, 0))
titi.draw()

titi = Actor('bird1', (75, 350))
titi.vitesse = 1

pgzrun.go()

+ 0
- 152
chapitre_1.md Ver fichero

@@ -1,152 +0,0 @@
# Partie 1
## Pour commencer

Pour réaliser votre programme, vous allez devoir vous servir des modules fournis par **Pygame Zero** que vous avez installé durant l'introduction.

La manière d'utiliser la bibliothèque est la suivante :
- À la première ligne de votre script, il faut inporter le module **pgzrun**
- À la dernière ligne, il faut appeler la méthode **go()** de ce module, qui est comme une fonction attachée au module, et que l'on invoque avec la *notation pointée*.

Voici donc à quoi devrait ressembler le squelette de tout programme de jeu basé sur *pgzrun*.

```python
import pgzrun

# Le corps du programme devrait se trouver ici...

pgzrun.go()
```

L'exécution d'un tel programme devrait d'ailleur faire apparaître une fenêtre au fond noir et dont le titre est *Pygame Zero Game*

> - Créez maintenant un nouveau script python, dans le dossier racine du projet, basé sur le squelette décrit ci-dessus.
> - Entre la première et la dernière ligne (corps du programme), rédigez le code suivant :

```python
TITLE = "Paf l'oiseau"
WIDTH = 400
HEIGHT = 708
```

> - Enregistrez ce fichier sous le nom **birdie.py**,
> - Exécutez-le pour voir le résultat.

Vous devriez voir une fenêtre vide apparaître. Pouvez-vous comprendre ce que fait chaque ligne de code ?

> - Quittez la fenêtre,
> - Effectuez quelques modification sur les lignes de votre programme et exécutez à nouveau celui-ci, pour vérifier l'effet attendu.
> - N'oubliez pas de quitter la fenêtre de jeu entre chaque tentative.

## Afficher un arrière-plan

> Ajoutez ces lignes à la fin de votre programme. Assurez-vous de bien respecter l'indentation.

```python
def draw():
screen.blit('cascade', (0, 0))
```

Le mot clef **`def`** crée une fonction. Pour rappel, une fonction est une manière de grouper plusieurs instructions. La fonction que nous créons ici s'appelle **`draw`** (dessiner). Il s'agit d'un nom prédéfini, et il faut une fonction nommée de cette manière si vous voulez que **pgzero** puisse dessiner quoi que ce soit.
La première et unique instruction de la fonction commence par **`screen.blit`**. Elle dit à Pygame Zero de dessiner quelque chose sur l'écran.

> Exécutez le programme tel quel pour voir le résultat. Vous devriez voir l'image d'une cascade à l'intérieur de votre fenêtre. Comme précédemment, essayez de
> modifier les valeurs utilisées entre les parenthèses pour comprendre le rôle de chacune d'elles.

Vous pouvez télécharger vos propres images, et essayer de les utiliser en tenant compte de leurs tailles.

*NOTE : pgzero cherche après les éléments graphiques dont il a besoin à l'intérieur d'un dossier qui **doit** s'appeler **images***

## Ajouter l'oiseau

> Après la définition de la fonction *`draw`*, ajoutez la ligne suivante :

```python
bird = Actor('bird1', (75, 350))
```

Cette ligne ne doit pas être indentée, elle est *hors* de la fonction. Son instruction ne sera exécutée qu'une seule fois, au lancement initial du programme, et définit un **`Actor`**, nommé **bird**. **`Actor`** est un élément de *Pygame Zero*, mais bird est une variable pour désigner l'object *Actor* créé. On peut choisir n'importe quel nom celle-ci. Par exemple, modifions 'bird' en 'titi'.

***ATTENTION*** : il faut cependant respecter les règles de nommage des variable python : pas d'espace, de caractères accentués, etc.

> Exécutez à nouveau votre programme. Que se passe-t-il ?

En fait, il ne devrait rien se passer de différent. Nous avons défini un **objet** de type **Actor**, et c'est tout. Si nous voulons voir apparaître cet objet, il faut appeler sa méthode **`draw`** au bon endroit, dans la fonction **`draw`** principale. Cela peut paraître un peu confus, mais voyez les choses comme ceci :
pendant l'on dessine (*draw*) la fenêtre principale du jeu, on demande à dessiner l'objet de type **Actor** en appelant la méthode draw de celui-ci de la manière suivante : `titi.draw()`.

> Mettez à jour votre fonction **`draw`** pour refléter ces explications. Vous devriez obtenir quelque chose comme ceci :

```python
def draw():
screen.blit('background', (0, 0))
titi.draw()
```

> Une fois que cela fonctionne, expérimentez à nouveau avec les différentes valeurs entre parenthèse (brid1, 75, 350) pour parfaitement comprendre leurs rôles.
> Essayez de placer l'oiseau dans chacun des coins de la fenêtre
> Que se passe-t-il si l'on intervertit les deux lignes à l'intérieur de la fonction `**draw**` ? Pourquoi ?

<img alt="Titi dans son décor" src="https://i.imgur.com/oyjY2HY.png" width=250 />

## Faisons se déplacer l'oiseau

Pour déplacer l'oiseau, nous allons nous servir de la souris. Ajoutons une nouvelle fonction. Les fonctions peuvent-être placées dans n'importe quel ordre, mais conventionnellement, avant la fonction **`draw`** convient bien.

> Écrivez le code suivant à l'endroit suggéré :

```python
def on_mouse_down():
print('Clic souris !')
titi.y -= 50 # équivalent à titi.y = titi.y - 50
```

Tous les objets de type **Actor** ont une position **x** et **y**. Comme nous avons créé titi avec `titi = Actor(...`, il est un **Actor**. La valeur **x** correspond à la position horizontale de l'acteur (gauche/droite), alors que la valeur **y** correspond à la position verticale (haut/base).

> Lancez le jeu et cliquez dans la fenêtre pour faire bouger l'oiseau. Que se passe-t-il en si l'on remplace 50 par une autre valeur ?
> Arrivez-vous à faire se déplacer l'oiseau horizontalement ? En sens inverse ?
> L'instruction print est censée afficher 'Clic souris !'. Pouvez-vous voir cela ?

La fonction **`on_mouse_down`** est *appelée* à chaque fois que l'on clique. Lorsqu'une fonction est appelée, l'ensemble des instructions qu'elle contient sont exécutées. Si l'on veut donner l'impression que l'oiseau se déplace de manière fluide, il faut utiliser de petites valeur de décalage, et cliquer rapidement à de nombreuses reprises...

> Essayez de faire se déplacer l'oiseau de manière fluide...

De même que la fonction **`on_mouse_down`** est appelée lorsque l'on clique, la fonction **`update`**, si elle est définie est appelée *automatiquement* ne nombreuses fois par seconde (60x normalement).

> Définissez votre propre fonction **`update`** comme suit :

```python
def update():
titi.y += 1
```

> ***AVANT*** de lancer votre programme, essayez de deviner comment il va se comporter...

De nouveau, que se passe-t-il si vous modifier la valeur 1 par une valeur plus grande ? Pour contrôler plus efficacement la vitesse de chute de notre oiseau, nous allons lui *attacher* une variable **`speed`**, de la même manière que pour **x** et **y**. Cette variable est comme un curseur dont on pourra augmenter ou diminuer la valeur pour contrôler la vitesse de chute.

> Ajoutez cette ligne en fin de fichier, mais toujours avant **`pgzrun.go()`** bien sûr :

```python
titi.speed = 1
```

On a choisi le nom **speed** car il reflète l'idée de vitesse, mais comme c'est une variable, on aurait pu choisir n'importe quel autre nom respectant les règles habituelles.

Il ne vous reste plus qu'à modifier la fonction **`update`** pour qu'elle utilise cette variable à la place que la valeur fixe '1'.

```python
def update():
titi.y += titi.speed
```

En utilisant la variable `titi.speed` dans la fonction, on utilise la valeur attribuée à cette variable. Ainsi, chaque fois que la fonction **`update`** est appelée (60x par secondes), la position **y** de l'oiseau est modifié selon la valeur de **speed**, quelle que soit celle-ci.
Cela veut dire que **speed** peut changer pendant que le jeu est en train de tourner !

> Expérimentez avec les différentes valeur pour équilibrer le valeurs de jeu (effet du clic, vitesse de chute, ...)

## Challenges

- Modifiez tout le jeu pour le faire fonctionner de manièr horizontale.
- Arrangez-vous pour que l'oiseau stoppe tout mouvement si l'on clique dans la fenêtre.
- Arrangez-vous pour que quand vous gardez le bouton de la souris enfoncé, l'oiseau arrête de bouger, mais que quand vous relâchez le bouton, il recommence à bouger. (Indice : vous aurez besoin d'une nouvelle fonction : **`on_mouse_up`**)
- Ajoutez un autre oiseau, se déplacant à une autre vitesse,
- Arrangez-vous pour que quand un oiseau dépasse les limite de l'écran, il réapparaisse de l'autre côté. (Indice : vous allez devoir vous servir de l'instruction **`if`**)
- Arangez-vous pour qu'à chaque clic, l'oiseau accélère...

Cargando…
Cancelar
Guardar