Forums Développement Multimédia

Aller au contenu

[exercice] Jeu de Cascade

CODE

33 réponses à ce sujet

#1 Monsieur Spi

  • Community Manager
  • PipPipPipPipPipPipPipPip
  • 7017 messages

Posté 28 December 2012 - 16:44 PM

Bonjour,

Voici un petit exercice pour réaliser un jeu de Cascade.

Je vous laisses jeter un œil ici : http://forums.mediab...rcice_-_cascade

Puis nous pouvons en discuter si vous le souhaitez ;-)

#2 hubeert

  • Members
  • PipPipPipPipPipPipPipPip
  • 925 messages

Posté 28 December 2012 - 23:29 PM

coucou;
c'est pas mal du tout; je regrette un peu le fait que de cliquer sur une case si elle n' a pas de couleur adjacente identique, il ne se passe rien. je regrette aussi que la gestion colonne soit occultée; en clair si on clique sur une ligne ou les couleurs sont identiques ca descend; mais si ce sont les colonnes qui sont identiques il ne se passe rien..(ca supprime la ligne mais ca ne rapproche pas les colonnes..enfin si a la fin de la colonne. :oops: je ne vois pas t.rop le rapport avec tetris.. mais ce n'est qu'une question.

#3 Monsieur Spi

  • Community Manager
  • PipPipPipPipPipPipPipPip
  • 7017 messages

Posté 29 December 2012 - 14:55 PM

Yop,

Merci du retour, pour le fait de ne pas pouvoir cliquer sur une case isolée, ça me semblait le cas dans le jeu d'origine mais ça se modifie facilement sur mon programme, il suffit de vider quand même la pièce dans le cas où elle n'a pas de voisines. Par contre pour le coup des colonnes je crois comprendre ce que tu veux dire mais il ne me semble pas que ce soit le cas dans les différents jeux du type que j'ai étudié, il y a un ordre précis où les cases commencent par descendre, puis ensuite les colonnes se rapprochent. En ce qui concerne l'allusion au Tetris, c'est de là que sont issus tous ces jeux à base de code couleurs et de suppressions de blocs, dans Tetris ça marche par lignes remplies et bonus de points si plusieurs cases sont alignées de même couleur, d'où le fait que je pense qu'il s'agit principalement de déclinaisons, mais je peux me tromper ;-)

#4 hubeert

  • Members
  • PipPipPipPipPipPipPipPip
  • 925 messages

Posté 29 December 2012 - 21:50 PM

coucou;
je sais pas pour le jeux d'origine de cascade; celui que j'ai fait était inspiré d'un ou les colonnes se rapprochaient en même temps; mais j'avais vu aussi ta version. Pour la case qui s'élimine sans case adjacente de couleur ca peut faire parti de la stratégie; mais il est vrai que normalement il faut au moins deux cases de même couleur. tetris c'est pas des couleurs mais des formes qui s'imbriquent pour faire des lignes sans trous..Tetris c 'est pour moi plus un jeu d'adresse que de réflexion, dans le sens ou la réponse de l'ordi ne répond pas a a une stratégie du joueur.; oui sinon après tout dans tous les jeux faut tester, comparer, éliminer..Et parfois faire de l'intelligence artificielle.; je joins cascade et tetris fait il y a dix ans en AS1 et avec les OSB ( Opérateurs Sur le Bit). Et continue car tes solutions sont terriblement efficaces dans les jeux et l'important c'est d’être efficace :smile:

Fichier(s) joint(s)



#5 Monsieur Spi

  • Community Manager
  • PipPipPipPipPipPipPipPip
  • 7017 messages

Posté 29 December 2012 - 22:26 PM

Re,

Oui pour Tetris si on veut, tous ces jeux se ressemblent de toute façon ;-)

Merci pour tes deux versions, hésites pas à poster le code si tu le sent, ça peut aider d'autres à aller dans cette voie aussi ;-)

T'inquiètes, je continues, j'ai encore pas mal d'exercices en cours d'écriture, là je planche sur un clone de Trailblazer où je montre un mix entre scrolling par copyPixel et mode7, et j'ai un Asteroid et un Missile command en cours aussi, en tout cas merci de tes retours, c'est agréable de voir que ça intéresse du monde ;-)

#6 hubeert

  • Members
  • PipPipPipPipPipPipPipPip
  • 925 messages

Posté 29 December 2012 - 23:08 PM

coucou;
merci a toi de ta réponse. Joindre les codes ne serait pas tres productif ? car cest de AS1 ou deux faut les transcoder en AS3 et j'y suis pas très a l'aise. j'ai refait le tic-tac toe en AS3 et en OSB (Opérateur Sur les Bit), mais il y a des bug et je trouve pour le moment que ma version n'apporte rien de plus que ce soit en vitesse ou en intelligence artificielle. On verra si j'arrive a faire un truc qui tue ;-) ; par rapport a a ta version qui est tres agréable avec peu de code , sans bug et très ludique..Pour ce que tu annonces c'est un domaine que je ne connais pas.. alors en avant pour le clone de Trailblazer.. Et merci encore de partager ton savoir..Et ce que tu fais est tres propre et lisible..

#7 Monsieur Spi

  • Community Manager
  • PipPipPipPipPipPipPipPip
  • 7017 messages

Posté 29 December 2012 - 23:39 PM

Re,

Bah en tout cas n'hésites pas à venir compléter les exercices si tu trouve des solutions plus efficaces ;-)

Merci encore pour tes appréciations, ça fait plaisir, j'essaye de faire en sorte de ne proposer que des choses simples et avec le minimum de code possible, à première vue ça fonctionne pour le moment. Ce n'est pas particulièrement des acquis que je propose pour les exercices, en fait je me lance le défi à moi même et j'essaye de voir comment résoudre le problème de la manière la plus simple possible. C'est pour ça que j'ai plusieurs jeux en cours et du coup j’apprends aussi énormément en les faisant et je viens poster la solution quand j'estime avoir trouvé une méthode efficace, mais je ne suis pas à l'abri d'erreurs et il ne faut pas hésiter à me corriger le cas échéant.

#8 Monsieur Spi

  • Community Manager
  • PipPipPipPipPipPipPipPip
  • 7017 messages

Posté 29 December 2012 - 23:44 PM

Petite preview du trailblazer en cours pour faire patienter ;-)

Voici le jeu original :



Et voilà où j'en suis (j'ai commencé hier soir) :


- Afficher le SWF -
Fichier joint  TRAILBLASER AS3 V1.swf   168.7 Ko   89 téléchargement(s)

Utiliser les flèches de direction et la barre espace.

Je vais proposer les deux vues (top down en bas et mode7 en haut) pour l'exercice pour aborder deux méthodes différentes d'un coup.

#9 hubeert

  • Members
  • PipPipPipPipPipPipPipPip
  • 925 messages

Posté 30 December 2012 - 09:32 AM

coucou;
j'ai pas pu l'ouvrir..
"VerifyError: Error #1014: La classe flash.geom::PerspectiveProjection est introuvable.
at global$init()..

bon courage pour l'exercice. Te corriger non; lol tu y pense pas; a la rigueur faire voir un autre maniere d'y arriver, oui pourquoi pas. :smile:

#10 hubeert

  • Members
  • PipPipPipPipPipPipPipPip
  • 925 messages

Posté 30 December 2012 - 17:14 PM

coucou;
en fait dans ton tic tac toe il y a un bug; si on joue plus vite que les 500 millième de seconde accordés a l'ordi ca bugge.
je sais pas si cest bien mais de rajouter :grille.removeEventListener(MouseEvent.CLICK, remplir); a la fonction latenceAI() puis d'ajouter : grille.addEventListener(MouseEvent.CLICK, remplir); a la fonction remplir() semble marche mais je sais pas si cest bien de faire ca..

#11 Monsieur Spi

  • Community Manager
  • PipPipPipPipPipPipPipPip
  • 7017 messages

Posté 30 December 2012 - 17:34 PM

Yop,

Oui je suis au courant du bug, mais la flemme de le corriger car ça n'a pas de rapport direct avec le thème de l'exercice, le but c'était de faire fonctionner l'IA, là c'est des corrections mineures de jouabilités liées à un effet rajouté pour plus de confort pour le joueur, j'estime que quelqu'un qui arrive à comprendre l'exercice arrivera à corriger de lui même ;-)

Sinon oui tu as raison, pour corriger il faut couper tout simplement l'écouteur pour le joueur et le remettre quand c'est à lui de jouer, ou utiliser une variable globale, il y a différentes solutions.

Pour ton problème avec la démo de Traiblazer, ton player Flash ne doit pas être à jour, il faut le FP 10 car j'utilise les fonctions natives de Flash pour modifier le plan en perspective, ce qui me pose du coup un autre souci, je voulais éviter de faire tout le calcul de projection à la main, c'était donc bien pratique de passer par la 3D native de Flash, mais pour les gens qui ne sont pas sur Flash ou qui n'ont pas le player à jour ça va poser des problèmes. Du coup me voilà obligé de me fader les calculs de projection et ça me saoule un peu, mais pas le choix.

#12 hubeert

  • Members
  • PipPipPipPipPipPipPipPip
  • 925 messages

Posté 30 December 2012 - 18:41 PM

coucou;
Bon ca va alors.. ;-) ; je vais mettre le player a jour.. Bon courage..

#13 lilive

  • Moderateur
  • PipPipPipPipPipPipPipPip
  • 2993 messages

Posté 30 December 2012 - 23:16 PM

Coucou,
Et bravo pour ta persévérance M.Spi :)


Voir le messageMonsieur Spi, le 29 December 2012 - 23:44 PM, dit :

Petite preview du trailblazer en cours pour faire patienter ;-)
Je vais proposer les deux vues (top down en bas et mode7 en haut) pour l'exercice pour aborder deux méthodes différentes d'un coup.
Petite note en passant: il me semble que ce genre d'effets était possible sur ces anciennes machines par une ruse technique. Cette ruse consistait à ne pas redessiner les pixels de la route, mais à simplement changer les 2 couleurs du damier au fur et à mesure que l'image était dessinée à l'écran. En effet, sur certaines machines, par exemple l'atari ST, on avait un jeu de couleurs limité, par exemple 4 bit, soit 16 possibilité de couleurs différentes. Par contre, il était possible de modifier cette palette de 16 couleurs. Et si on modifiait la palette au fur et à mesure que le faisceau d'électron du moniteur dessinait l'image, on pouvait créer ce type d'effets, sans toucher aux pixels eux-mêmes, mais en modifiant simplement les couleurs affectées au valeurs des pixels. Hum, pas évident à expliquer en 2 mots! Termes de recherches pour en savoir plus: scrolling horizontal sync

On peut envisager de refaire cet effet en utilisant les blendmodes de flash.

#14 Monsieur Spi

  • Community Manager
  • PipPipPipPipPipPipPipPip
  • 7017 messages

Posté 30 December 2012 - 23:55 PM

Coucou Lilive,

Merci ;-) je continue jusqu'à ce que j'en aie marre...

Génial pour les infos, merci beaucoup, effectivement je n'avais pas pensé à ça, à la fois il fallait le savoir, du coup je pensai à quelque chose de beaucoup plus simple à base de Mode7 style.

En fait je suis parti d'une map (array), j'ai trois bitmaps pour les tuiles (blanc, gris, vert), j'ai un code qui gère à la fois le scrolling et le dessin d'un plan 2D (par copyPixel depuis les textures), ça donne la vue du bas et ça tient en 5 lignes.

Pour le passage en perspective (vue du haut), j'ai opté pour les outils de transformation 3D natifs de Flash. J'incline le plan via l'axe X, je le place en hauteur (camera.y) et et en profondeur (camera.z), et il me reste à gérer le fieldOfView pour avoir le point de fuite.

Toutes les détections des tuiles (trou, turbo, ralentisseur, bumper, inverseur, ....) sont gérés via la map et la position de la balle vis à vis du plan 2D initial (d'où le fait de passer par cette étape même si au final je ne l'affiche pas et quelle ne me sert que pour les calculs).

Suite aux remarques de Hubeert sur le coup de l'utilisation de la projection qui passe pas si le player n'est pas à jour, j'ai regarde pour abandonner ce système pourtant bien pratique (ça tient en 5 lignes de code pour incliner le plan), et me tenter une nouvelle fois de la perspective à la mano en passant par une série de lignes (Sprites) où je retrace la ligne correspondante du bitmap à plat et que je mets à l'échelle en fonction de la distance. Pour le moment ça marche pas mal mais je vais encore galérer pour les explications, vu mon niveau en maths :mrgreen:

J'ai pensé à une troisième option qui consisterai à tracer directement un seul bitmap pixel par pixel en utilisant des texels que je met à l'échelle, ce serait plus à base de vecteurs pour le coup, mais ça complique encore beaucoup les choses et j'aimerai bien rester simple pour ce jeu, j'ai l'occasion de revenir sur ce genre de manip dans des jeux plus poussé qui arriveront plus tard.

Du coup, comme j'aime apprendre des nouveaux trucs sur les anciens machins qui permettaient de faire des bidules avec les choses, j'ai été me renseigner sur le VSCROL et le HSCROL de l'Atari et je suis tombé là dessus : http://en.wikipedia....ANTIC#Scrolling

#15 lilive

  • Moderateur
  • PipPipPipPipPipPipPipPip
  • 2993 messages

Posté 31 December 2012 - 02:05 AM

J'ai fait un peu joujou ;)

Pas évident finalement de simuler l'astuce dont je parlais avec des blendmode. Je ne maitrise peut-être pas assez. J'ai dû rajouter un ColorMatrixFilter

C'est sûr que ça complique au niveau maths. Pour les explications, et pour la détection des dalles sur laquelle est la balle.

Je ne pense pas que ce soit une bonne approche pour ton jeu.

Fichier(s) joint(s)



#16 Monsieur Spi

  • Community Manager
  • PipPipPipPipPipPipPipPip
  • 7017 messages

Posté 31 December 2012 - 13:34 PM

:Hola:

Ca fonctionne très bien et la classe est pas si effrayante que ça.
Bon par contre c'est pas au niveau où j'en suis pour les exercices, ca risque de vachement compliquer les explications ou les pré requis pour le Traiblazer, par contre je vais peut être te piquer des idées dedans si tu n'y vois pas d'inconvénients, ton calcul de projection semble beaucoup plus simple que le mien. Pas le temps d'étudier ça en détail aujourd'hui réveillon oblige, mais je m'y colle dès que possible pour finir le jeu.

Merci d'avoir fait joujou ;-)

#17 lilive

  • Moderateur
  • PipPipPipPipPipPipPipPip
  • 2993 messages

Posté 31 December 2012 - 13:56 PM

Voir le messageMonsieur Spi, le 30 December 2012 - 17:34 PM, dit :

Pour ton problème avec la démo de Traiblazer, ton player Flash ne doit pas être à jour, il faut le FP 10 car j'utilise les fonctions natives de Flash pour modifier le plan en perspective, ce qui me pose du coup un autre souci, je voulais éviter de faire tout le calcul de projection à la main, c'était donc bien pratique de passer par la 3D native de Flash, mais pour les gens qui ne sont pas sur Flash ou qui n'ont pas le player à jour ça va poser des problèmes. Du coup me voilà obligé de me fader les calculs de projection et ça me saoule un peu, mais pas le choix.
Tu crois vraiment?
Je suis un peu sceptique là-dessus. Cela va t'entrainer dans des explications difficiles. Ne vas-tu pas te retrouver à un niveau supérieur à celui que tu voulais?

Voir le messageMonsieur Spi, le 31 December 2012 - 13:34 PM, dit :

par contre je vais peut être te piquer des idées dedans si tu n'y vois pas d'inconvénients, ton calcul de projection semble beaucoup plus simple que le mien.
Aucun inconvénient bien sûr. Par contre (et pour une fois) j'ai mis au point ce calcul de façon empirique, et je ne réponds de rien quand à son utilisation :mrgreen:

#18 Monsieur Spi

  • Community Manager
  • PipPipPipPipPipPipPipPip
  • 7017 messages

Posté 31 December 2012 - 14:05 PM

Citation

Tu crois vraiment?
Je suis un peu sceptique là-dessus. Cela va t'entrainer dans des explications difficiles. Ne vas-tu pas te retrouver à un niveau supérieur à celui que tu voulais?

Ben ça dépend, avec ta classe justement j'ai peut être une solution plus simple à proposer, mais je dois encore étudier ça. Sinon oui si je me lance dans les calculs de projection ça va compliquer et du coup ça va être au dessus du niveau que je prévoyais pour cet exercice. Mais à la fois cet exercice est une charnière, je veux aborder à la fois le scrolling et la perspective sur un exemple simple (une piste qui va toujours dans le même sens sans action directe par le joueur comme la rotation, le changement de direction, etc...), ce qui me permet de poser un prérequis pour les exercices suivants qui vont utiliser soit le scrolling (shoot'em up, rpg, etc..) soit la projection (course de voiture, etc...). Vu la simplicité du jeu ça me semblait idéal pour faire un exercice dédié à ces deux méthodes, du coup si je dois entrer dans les explications tant pis, je vais prendre plus de temps pour faire les choses bien et dédier cet exercice pour un niveau transitoire un peu plus élevé que ce que j'ai fait pour le moment. Pour l'instant le seul exercice "niveau 2" que j'ai fait est le Space Invader, il me reste encore quelques exercices "niveau 1" à faire avant de pouvoir commencer la série 2, je pense que le Traiblazer sera un exercice charnière à ce niveau.

Après si je me plante dans les explications pour la projection, je ferais certainement appel à ton aide pour me corriger ;-)

#19 dldler

  • Community Manager
  • PipPipPipPipPipPipPipPip
  • 4163 messages

Posté 31 December 2012 - 14:47 PM

Hi.

j'interviens un peu tard, mais pour ceci :

Citation

Par contre, il était possible de modifier cette palette de 16 couleurs
C'est pour ce genre de cas je pense que les bitmaps supportent la fonction paletteMap.
Un unique bitmap data (difficile à dessiner au départ) puis un unique paletteMap et le mouvement est fait.

Après je pense qu'il y a tout de même une gestion obligatoire par bande afin de créer les trous… mais il y a peut être là aussi un truc…
Intéressant comme petit casse-tête.
Mais quand même un intérêt limité : quand on avait à l'époque des dalles de 6 pixels de haut, on pouvait jouer sur des nuances proches.
Aujourd'hui une dalle pourrait bien faire dans les 200 pixels… ce qui couvre déjà pratiquement la palette de couleurs par composante. Donc, couleurs pas proches…
je ne sais pas si je suis clair.

En résumé : idée d'optimisation intéressante mais pas adapté à de la haute définition. Moi, je saurais le faire mais j'oublierais quand même l'idée.

#20 lilive

  • Moderateur
  • PipPipPipPipPipPipPipPip
  • 2993 messages

Posté 31 December 2012 - 19:41 PM

Salut Dldler,

Je ne suis pas sûr de te comprendre. Ton idée serait d'avoir un BitmapData qu'on recoloriserait d'une unique paletteMap? Ce bitmap serait donc constitué de pixels dont les valeurs de couleurs seraient dépendantes de l'ordonnée? Si c'est cela dont tu parles je suis d'accord, ça va être vite limité.

L'idée dont je parlais consiste à trouver une opération qui permette, selon l'ordonnée d'une ligne horizontale de pixels bicolores, de modifier ces 2 couleurs pour en faire ce que l'on veut.
Au début j'ai cru que ce serait possible en coloriant des bandes horizontales de rectangles unis, et en applicant ce coloriage par-dessus les pixels de la route, avec un BlendMode bien choisi. Mais je n'y suis pas arrivé, je manque de connaissances sur les modes de fusion. Tu as peut-être une idée la-dessus?




Sinon, je viens de reprendre mon essai, en laissant tomber les BlendMode et en recoloriant les bandes colorées avec un ColorMatrixFilter différent par bande horizontale. ça marche bien. Au niveau perfs je ne sais pas ce que ça vaut.
PseudoHSyncScroll2, c'est la base de ce procédé.
PseudoHSyncScroll3 c'est une utilisation de ce même procédé avec une gestion des couleurs pour pouvoir les modifier comme on veut, avec et sans trous.
Dans ces 2 exemples, le damier défilant est obtenu en copiant l'image suivante à coups de ColorMatrixFilter
Image attachée: road.png



- Afficher le SWF -
Fichier joint  PseudoHSyncScroll2.swf   1.31 Ko   73 téléchargement(s)




- Afficher le SWF -
Fichier joint  PseudoHSyncScroll3.swf   1.82 Ko   66 téléchargement(s)

Fichier(s) joint(s)



#21 dldler

  • Community Manager
  • PipPipPipPipPipPipPipPip
  • 4163 messages

Posté 01 January 2013 - 16:06 PM

Re-hi et bonne année :-)

Je ne sais pas trop comment expliquer de quoi je parle.

Imaginons que tu as une animation cyclique de 8 images.
Tu utilises 4 rouges légèrement différents : fc,fd,fe,ff
et quatre "noirs" différents, poiur l'instant je ne vais parler que de la composante rouge : 00,01,02,03

Dans le tableau de la palette associée au rouge tu décale les valeurs :
[01,02,03,fc,…,…,…,…fd,fe,ff,00)
A chaque fois que tu applique le paletteMap, la dernière valeur de noir va être remplacée par la première de rouge, et la dernière de rouge va être remplacée par la première de noir. Les autres valeurs vont juste être décalées.
Au bout de 8 passage, tu retrouves les couleurs d'origine. C'est juste ça qui crée l'animation par modification de la palette.

Peut-être que le principe sur les vieux jeux étaient différents, d'ailleurs. Avec des couleurs nommées : c1,c2,c3, et que tu pouvais donner la même valeur de rouge à c1,c2 etc. Et qu'en faisant glisser un tableau d'association, ça provoquait le même résultat. C'est aussi possible a reproduire avec un paletteMap… faudrait que je creuse.
Pour l'utilisation des blendmodes, je ne vois pas trop quel usage tu veux en faire et je ne percute pas… Mais ça viendra peut-être quand j'y regarderai de plus près.

En même temps, je ne promets rien.
;-)

#22 lilive

  • Moderateur
  • PipPipPipPipPipPipPipPip
  • 2993 messages

Posté 01 January 2013 - 22:28 PM

Voir le messagedldler, le 01 January 2013 - 16:06 PM, dit :

Re-hi et bonne année :-)
:)



Ça y est je comprends.
Je crois voir comment on pourrait ainsi faire défiler une route en damier. Une fois les pixels de la route dessinés (c'est le plus dur, comme tu disais) un unique paletteMap permettrait de passer à l'image suivante de l'animation. Le soucis serait que la couleur des dalles ne serait pas tout à fait homogène.

Sinon j'avais en tête un autre système avec un unique paletteMap. Plutôt que de peiner à l'expliquer le voici en code.
A gauche les pixels avant le paletteMap, à droite les mêmes pixels après le paletteMap.
Fichier joint  PaletteMap1.as   2.15 Ko   79 téléchargement(s)


- Afficher le SWF -
Fichier joint  PaletteMap1.swf   1.77 Ko   79 téléchargement(s)


Pour ce qui est des vieux jeux, j'explique un peu plus ce que je connais:
Une route de pixels:
12121
21212
12121
21212
12121
21212
Ici seuls les codes de couleurs 1 et 2 sont utilisés. Sur mon atari ST par exemple on avait 16 codes (valeurs) possibles, de 0 à 15. Donc à priori seulement 16 couleurs différentes affichées simultanément.
Chaque code était associé à une couleur, définie dans un tableau (palette). Les pixels de valeur 0 étaient affichés avec la couleur c0, les pixels de valeur 1 étaient affiché avec la couleur c1, etc
Chaque couleur c0, c1, c2, cN était définie en RVB, avec 8x8x8 choix possibles.
Le grand truc, c'est qu'il était possible d'exécuter du code au moment où le balayage du faisceau d'électron du moniteur atteignait le bord du moniteur. Si ce code modifiait la palette de couleur c0..cN, on pouvait donc changer la palette à chaque ligne horizontale de l'écran, ce qui permettait d'outrepasser la restriction d'avoir seulement 16 couleurs différentes affichées simultanément.
En s'y prenant bien, on pouvait par exemple obtenir des effets comme celui de la route de trailblazer qui défile, sans modifier les codes des pixels eux-mêmes.

#23 Monsieur Spi

  • Community Manager
  • PipPipPipPipPipPipPipPip
  • 7017 messages

Posté 03 January 2013 - 11:10 AM

Salut les gars,

Bonne année à vous.

Bon sinon, vous poussez loin le système, mais vous avez raison c'est fun et j’apprends des trucs ;-)
Ceci dit, Didier tu n'arrive pas si tard que ça puisque le sujet actuel n'est pas encore "Traiblazer", mais "Cascade" ;-)
Ce qui fait qu'en fait vous avez de l'avance sur la rédaction du jeu, mais bon continuez si vous voulez, je transférerai les messages dans le bon post une fois le jeu terminé, je ne suis pas sur de reprendre vos travaux car je souhaite faire simple même si ça ne colle pas au mieux au concept d'origine, mais c'est un très gros plus pour les gens qui viendrons lire tout ça ;-)

Bon du coup c'est moi qui suis en retard pour le coup, là c'est encore les fêtes, mais je m'y recolle dès la fin de la semaine, d'abord pour étudier en détail vos solutions, puis pour finir le Traiblazer. En attendant amusez-vous bien.

#24 p@f

    Ceinture Blanche

  • Members
  • Pip
  • 5 messages

Posté 21 January 2013 - 16:00 PM

Bonjour Monsieur Spi

Je suis vos exercices avec interêt car je me passionne en amateur pour l'environnement Flash et l'AS3 tout particulièrement.

Je vous avoue que même après avoir lu vos prérequis, je bloque sur certains aspects du code car je souhaite adapter votre jeu de cascade pour un format de jeu rectangulaire composé de 8 colonnes et 10 lignes

Dans un premier temps, j'ai pu définir en "dur" dans les variables le nombre de lignes et colonnes en ajoutant à votre code:


var T:int = 32; //taille des tuiles
var C:int = 8; //nombre de colonnes
var L:int = 10; //nombre de lignes
var i:int; //pointeur
var stock:Array = [];
var voisins:Array = [];
var valeurs:Array = [];
 

Jusqu'ici, tout va bien enfin je l'espère

Ensuite, la fonction init m'affiche exactement le format de jeu que je souhaite en modifiant la taille de la grille comme suit


for (i=0;i<L*C;i++){
 

C'est ensuite que cela se gâte, car ce qui m'embrouille, c'est le fait que le jeu soit carré et que cela permette des raccourcis de code qu'en tant que débutant, je n'assimile pas parfaitement.

Pour être plus clair, en laissant le code tel qu'il est après avoir modifié les lignes citées plus haut, le jeu n'est plus capable de faire correctement les fonctions "check ligne", "check colonne" et "check decalage" et ne descend donc pas les tuiles sur la dernière ligne. Evidemment, le jeu n'étant plus carré...et là je bloque.

Je n'arrive pas à trouver dans quelle(s) fonction(s) je dois retravailler le code pour arriver au résultat final, si cela est faisable avec les fonctions déjà existantes

Je vais continuer à chercher en traduisant encore chaque fonction car celà m'aide à mieux comprendre, mais un peu d'aide serait très appréciée, si cela ne prend pas trop de votre temps

Cordialement

p@f

#25 Nataly

    Community Jane

  • Moderateur
  • PipPipPipPipPipPipPipPip
  • 5783 messages

Posté 21 January 2013 - 17:13 PM

salut :)

Par jeu carré, j'imagine que tu signifies autant de lignes que de colonnes.
Ce qui te perturbes c'est peut-être l'utilisation du modulo, sur cet article tu trouveras comment distribuer des "trucs" selon un nombre de lignes et de colonnes spécifiques ;)
Le savoir est le seul bien qui s'accroit quand on le partage
une tartine de tutos

#26 p@f

    Ceinture Blanche

  • Members
  • Pip
  • 5 messages

Posté 21 January 2013 - 17:46 PM

Bonjour Nataly et merci pour l'article

C'est tout à fait le sens que je donnais à carré. J'ai désormais assimilé pourquoi lors de la disposition de la liste sous forme de tableau et lors de l'affichage, on utilise uniquement la variable du nombre de colonnes pour le modulo et la division.

Ceci dit, concernant le jeu cascade, j'avais vu que sans toucher à cette partie du code, l'affichage s'exécutait correctement. C'est bien mieux de comprendre pourquoi.

Je retourne bosser sur le contenu car mon adaptation est loin de fonctionner

#27 Monsieur Spi

  • Community Manager
  • PipPipPipPipPipPipPipPip
  • 7017 messages

Posté 21 January 2013 - 18:22 PM

Salut,

Pour adapter simplement à, par exemple, une aire de jeu rectangle à la place d'une aire de jeux carrée il y a trois modifs à faire.

Dans l'exercice j'utilise une aire de jeu carrée, il y a donc autant de lignes que de colonnes.
Dans une aire de jeu rectangulaire je vais avoir plus de colonnes que de lignes.

Si tu reprend le code de l'exercice, première modification à faire :

var C:int = stage.stageWidth/T;
var L:int = stage.stageHeight/T*.5;

Le nombre de lignes et le nombre de colonnes.
J'utilise la taille de l'aire de jeu et celle des tuiles pour définir ça, mais tu peux utiliser des valeurs perso.

Dans la fonction "init()", on construit la grille, il faut donc prendre en compte le nombre de lignes et de colonnes :


function init(e:MouseEvent):void{
       
   // ...
       
        for (i=0;i<L*C;i++){
                var t:Tiles = new Tiles();
                t.x = int(i%C)*T;
                t.y = int(i/C)*T;
         // ...
        }
  // ...
}
 

Le nombre total de tuiles est égal au nombre de lignes multiplié par le nombre de colonnes.
Jusque là c'est expliqué dans l'exercice.

Tu remarque que pour le positionnement des tuiles sur Y c'est toujours le nombre de colonnes qui est pris en référence, c'est normal, on ne va à la ligne suivante que si on a atteint le nombre de colonnes max de la ligne.

Il reste une modif à faire pour adapter le jeu à ce nouveau format. Cela se passe lorsque l'on va parcourir toutes les lignes de chaque colonnes quand on fait les tests pour rapprocher les colonnes sur X et boucher les vides :

function checkDecalage(c:int):void{
        var t:int = valeurs.length-C+c
        if(valeurs[t] !=5 && valeurs[t-1] == 5 && t-1>valeurs.length-C-1){
                var y:int = 0;
                while(y<L) {
                        i = c+y*C;
                        valeurs[i-1] = valeurs[i];
                        valeurs[i] = 5;
                        y++;
                }
                checkLigne()
        }
}

Ici il ne faut plus se baser sur C, et c'est là que j'ai été confus, désolé j'aurai pu mieux le signaler, ici "C" utilisé dans la boucle "while" représente le nombre de lignes et non pas le nombre de colonnes ("tant qu'on a pas parcouru toutes les lignes"), il faut donc le remplacer par "L", le vrai nombre de lignes.

#28 p@f

    Ceinture Blanche

  • Members
  • Pip
  • 5 messages

Posté 21 January 2013 - 20:10 PM

Bonsoir Monsieur Spi

Merci pour votre réponse, j'ai pu aisément modifier la formule L*C dans la fonction init() et avec l'aide de Nataly, j'ai bien intégré le modulo et la division pour la composition d'affichage.

Vous dites également:

Citation

Dans une aire de jeu rectangulaire je vais avoir plus de colonnes que de lignes
Dans mon cas c'est l'inverse

Pour la fonction checkDecalage, par tâtonnement ( pas génial pour la compréhension ), j'ai eu la joie de découvrir que la solution que vous donnez correspond à celle que j'avais trouvé.

Il me manque encore quelques petites choses car j'ai l'impression que lorsque je clique sur la dernière colonne qui se trouve à droite, la fonction efface aussi certaines tuiles de la première et la 2eme colonne comme si elles étaient liées. Une image pour illustrer:

Image IPB


Le clic se passe sur la dernière case en bas à droite et efface également à gauche les couleurs liées


Qu'est-ce que j'ai loupé?



#29 Monsieur Spi

  • Community Manager
  • PipPipPipPipPipPipPipPip
  • 7017 messages

Posté 21 January 2013 - 21:02 PM

Citation

Pour la fonction checkDecalage, par tâtonnement ( pas génial pour la compréhension ), j'ai eu la joie de découvrir que la solution que vous donnez correspond à celle que j'avais trouvé.

C'est exactement pour cette raison que l'on parle ici d'exercice et non de tutorial ;-)
Ne pas expliquer pas à pas permet d'impliquer le lecteur qui doit chercher la solution, cependant tous les éléments de réflexion sont donnés pour arriver à la solution. Que ce soit par tâtonnement ou par une suite logique, le but de l'exercice c'est que ce soit le lecteur qui travaille et pas seulement le rédacteur ;-)

Il ne faut donc pas s'attendre à un tutorial qui t'explique comment faire, mais à un exercice qui te montre une solution possible concernant un problème sur lequel tu es en train de réfléchir, à toi de trouver une solution, la même ou une meilleure si tu en as une ;-)

Citation

Il me manque encore quelques petites choses car j'ai l'impression que lorsque je clique sur la dernière colonne qui se trouve à droite, la fonction efface aussi certaines tuiles de la première et la 2eme colonne comme si elles étaient liées. Une image pour illustrer:

Ce problème est largement expliqué dans les différents exercices.
On travaille avec une liste donc un tableau dont les index se suivent sans différenciation de lignes ou de colonnes.
On retrouve les lignes et les colonnes à l'aide de quelques formules (par exemple celle qui utilise le modulo et la division pour placer les tuiles)

Lorsque tu fais une recherche des cases voisines de même couleur, tu effectue la recherche dans la liste, donc sans différenciation de lignes ou de colonnes, il faut donc impérativement limiter les résultats de la recherche dans cette liste en vérifiant qu'on ne se retrouve pas à l'index précédent ou suivant sur une ligne au dessus ou en dessous. Il y a encore une modification à faire, toujours concernant les lignes et les colonnes, et à laquelle je n'avais pas pensé, mais je vais te laisser chercher la solution.

Je te donne un indice, que fait la ligne suivante ?

trouveVoisin(n,stock[n].x/T,stock[n].y/T,C-1,valeurs[n]);

Si tu galère vraiment, relis l'exercice du Démineur, il y est expliqué comment rechercher les voisins et surtout comment intégrer des points de contrôle pour éviter de sortir de la grille.

Bon courage.


EDIT : autre indice, si on reprend ta capture d'exemple que se passe t'il quand tu cliques sur la case en bas a droite ?
Le programme trouve d'abord le voisin du haut, donc la case qui se trouve juste au dessus.
Puis il cherche les voisins de cette case, en l’occurrence au dessus (pas de voisin), a gauche (pas de voisin), en bas (plus de voisin) et ............. a droite et là il trouve un voisin DANS LA LISTE, mais comme ton point de contrôle n'est pas bon (nombre de colonnes trop important) il le prend en compte et t'efface ce qui se trouve de l'autre côté de la grille.

La question est donc, comment faire pour éviter que lorsque tu es en bout de ligne le programme aille chercher dans la liste le voisin suivant alors que par rapport à la grille ce n'est pas cohérent. C'est une simple modification de variable comme tu l'as fait pour le reste quand tu as modifié la forme du jeu.

Rappel : ceci est expliqué en détail dans l'exercice Démineur.

#30 p@f

    Ceinture Blanche

  • Members
  • Pip
  • 5 messages

Posté 22 January 2013 - 20:37 PM

Bonjour!

Merci de m'avoir mis sur la piste. Encore une fois, je me suis embrouillé tout seul avec cette satanée variable L dans la fonction trouveVoisins. Pour la coordonnée y, il fallait simplement que je fasse le test sur le nombre de lignes et non plus sur le nombre de colonnes (vous n'auriez pas pu mieux me mettre l'évidence sous le nez), mais je suis resté buté sur la coordonnée x, alors que celle-ci n'avait pas lieu d'être modifiée.

Le résultat:


trouveVoisin(n,stock[n].x/T,stock[n].y/T,L-1,C-1,valeurs[n]);
...
...
// trouver les cases vides voisines
function trouveVoisin(i:int,X:int,Y:int,E:int,D:int,F:int):void{
if(X>0 && valeurs[i-1]==F) voisins[i].push(stock[i-1]);
if(X<D && valeurs[i+1]==F) voisins[i].push(stock[i+1]);
if(Y>0 && valeurs[i-C]==F) voisins[i].push(stock[i-C]);
if(Y<E && valeurs[i+C]==F) voisins[i].push(stock[i+C]);
}
 

Je continue mon chemin tout doucement, et j'ai déjà beaucoup appris. Je retourne potasser le code, le jeu est mauvais joueur pour le moment et ne m'affiche pas mes triomphes. Je perds tout le temps

Amicalement

#31 Monsieur Spi

  • Community Manager
  • PipPipPipPipPipPipPipPip
  • 7017 messages

Posté 22 January 2013 - 22:55 PM

Yop,

Pas de problème, comprends-tu le pourquoi d'un exercice par rapport à un tutoriel ;-) ?
Le fait de vous forcer à réfléchir me semble plus instructeur que de mâcher tout le boulot ;-)

Bon courage et n'hésites pas si tu as des questions, je ne te donnerai sans doute pas la solution toute cuite mais j'essayerai de te mettre sur la voie.

#32 Nataly

    Community Jane

  • Moderateur
  • PipPipPipPipPipPipPipPip
  • 5783 messages

Posté 23 January 2013 - 12:45 PM

Voir le messageMonsieur Spi, le 22 January 2013 - 22:55 PM, dit :

comprends-tu le pourquoi d'un exercice par rapport à un tutoriel ;-) ?

L'idéal étant un tuto avec des exos se rapportant expressément au sujet du-dit tuto :jesors:
Le savoir est le seul bien qui s'accroit quand on le partage
une tartine de tutos

#33 Monsieur Spi

  • Community Manager
  • PipPipPipPipPipPipPipPip
  • 7017 messages

Posté 23 January 2013 - 13:57 PM

Citation

L'idéal étant un tuto avec des exos se rapportant expressément au sujet du-dit tuto

Donc un tuto complet par jeu puisque chaque jeu pose une problématique plus ou moins unique, ce qui rend l'exercice caduque ......... lol

Non je vais rester sur ma formule d'exercices simples pour le moment, pour ceux qui veulent apprendre globalement à "construire un jeu", il y a déjà quelques tutos biens développés sur le wiki, et surement d'autres en préparation ;-)

#34 p@f

    Ceinture Blanche

  • Members
  • Pip
  • 5 messages

Posté 23 January 2013 - 19:46 PM

Oui merci Monsieur Spi, j'ai parfaitement compris la subtilité entre l'exercice et le tuto. J'ai d'ailleurs une nette préférence pour les exercices car copier sans comprendre n'a pas grand intérêt lorsque l'on veut apprendre.

Il est vrai qu'en tant que débutant, je ne vois pas toujours la manière de résoudre une problème en utilisant une logique mathématique(donc par le code). J'imagine que l'expérience et l'apprentissage forgent quelques "routines"avec le temps. La transition entre la réflexion humaine et le langage machine est très délicat car nous considérons bien souvent que le fait de voir avec nos yeux les interactions qui se passent à l'écran est inné aussi pour la machine alors que celle-ci est parfaitement aveugle.

Je n'hésiterai pas à vous demander conseil ainsi qu'à Nataly et je vous souhaite une excellent soirée



1 utilisateur(s) li(sen)t ce sujet

0 membre(s), 1 invité(s), 0 utilisateur(s) anonyme(s)