Créer son site d'élevage virtuel avec Webidev
VOS QUESTIONS | FORUMS WEBIDEV | AIDE PRIVEE | COMMENTAIRES ----------------- Inscription | ConnexionImage
Image
© 2013 - Helpidev
Version Bêta



Apprentissage du CadrIF - page 4

IV - Le codage


Introduction


Nous voilà au tout dernier chapitre d’apprentissage du cadrIF Image. Pas trop fatigué? Si oui, allez vous reposer, car ce chapitre demande beaucoup de réflexion, encore plus qu'en cours Image. C'est pour ça que la plupart du temps je vais vous donner les codes (que vous ne pourrez pas copier coller désolé) sur des fonds à part. Bref, nous partons pour l'enfer du codage!

1. Matériel requis


Même si c'est le dernier chapitre, il nous faudra un bon nombre d'outils, et les voilà:

  • OpenOffice.org téléchargeable gratuitement ici: Lien, c'est toujours plus agréable de faire ses codes sur un traitement de texte que sur webidev (au bout de 20 pages de codes sur webidev je peux vous dire que vous en avez marre).

  • BildBerg, toujours ouvert dans une fenêtre à part.

  • Webidev, avec un site ne contenant aucune action, aucune variable et aucun type de bidule pour l'instant.

  • Du café, au cas où...

2. La partie


Sur webidev, faire des codes dans le vide, ça ne sert à rien, surtout pour le cadrIF. Oui, si vous ne codez pas le cadrIF dans une partie, vous n'aurez aucun résultat à part ça:

Image


Et ça, c'est pas cool à trouver pour un utilisateur... Donc nous allons créer notre partie! Pour cela, direction:
Webidev > Gameplay
Et faites exactement ceci:

Lien


Enregistrez puis ensuite créez une page dans construction ou on pourra créer son bidule, en gros, créer sa partie. Appelez votre page comme vous voulez. Présentez là comme vous voulez aussi, il y a plusieurs manière pour les parties comme: "Qui êtes vous (le mod creationbidule)" ou "créez votre partie (creationbidule)". Mais surtout, ne marquez pas: "adoptez votre partie", ça ne fait pas trop approprié... Enfin bref! N'hésitez pas à préciser que dans "sexe" il faut rentrer le sien et non celui de sa partie. Pour moi, ma présentation pourrait donner ceci:

Image


Mais tout ça ne suffit pas! Il faudra aussi rajouter un lien vers la partie du joueur quand il l'aura crée, voici comment faire:

Image


Et en cliquant sur sa partie, le joueur arrivera sur votre jeu sur la map de départ (à moins que vous décidiez que non). Mais nous verrons ça après la 3ème partie: Actions et Variables.

3. Actions et variables


Je vais maintenant vous donner la liste de course pour faire fonctionner le déplacement:

Les Variables
1. La variable "x", ne mettez pas de jauge.
2. La variable "y", pas de jauge non plus.
Et pour finir, les variables dont vous avez besoin pour votre jeu.

Les Actions
1. L'action ►, mettant + 1 à la variable x.
2. L'action ◄, mettant - 1 à la variable x.
3. L'action ▲, mettant + 1 à la variable y.
4. L'action ▼, mettant - 1 à la variable y.
Et pour finir, les actions dont vous avez besoin pour votre jeu.

4. Les IFs


Et maintenant nous attaquons la partie la plus dure de ce chapitre: les IFs. Je pense que tout le monde sait à quoi servent les IFs alors je vais pas m'attarder à faire un cours dessus!

En fait si. Donc les IFs sont des balises complémentaires permettant de rajouter des fonctions très utiles à votre site. IF voulant dire "si" en anglais, on peut traduire une balise comme cela:

Image


Si vous avez vraiment besoin d'aide dans les IFs, je vous invite à faire un tour sur ce petit tuo crée par un admin de webidev car vous aurez vraiment besoin de connaissances développées sur ce langage pour coder le cadrIF (d'où son nom Image):


Lien


Donc retournons à nos affaires. Pour accéder à la map directement en entrant dans la partie, il vous suffira de marquer comme je vais le faire. Mais avant tout comme exemple, je vais prendre un quadrillage allant de 0 à 3 de chaque côté (ça donne environ ça: Lien) (nous vous rappelons que la Var1 = x et que la 2 = y, et pareil pour les actions, j'ai tout mis dans l'ordre au dessus).

Image


On s'arrête là pour le moment. Nous avons crée le début d'une droite (de la droite 0 plus particulièrement). La droite est le nom portée à une ligne de code en cadrIF. Nous voyons sur cette droite la Var 1 (x). Cette var porte un nom particulier, c'est la marge de cette droite. Elle n'apparait qu'une seule fois sur une droite, ensuite elle est suivie d'éléments. Les éléments, ce sont les Var2 (y), c'est ce qui constituera le déplacement. Vu que sur mon exemple j'ai un quadrillage allant de 0 à 3, j'aurai alors 4 éléments (toujours compter le 0).

Mais si j'ai un quadrillage allant de 0 à 25 du côté de l'ordonnée et de 0 à 20 du côté de l'abscisse, combien y aura t-il d'éléments?

Il y en aura le même nombre que sur l'ordonnée. Donc, dans le cas des 25/20 il y en aura 26.

La marge et les éléments n'ont pas rien en commun. Si vous regardez bien, la valeur de la marge est égale à x et celle de l’élément à y. Et oui, le code que je viens de placer est le point "0 0" c'est à dire le départ ! Donc, entre les balises de l'élément 0, à la place de "///", mettez votre image de début. Par contre, ne la stockez pas dans vos 600 ko d'images, ils sont réservés au design de votre site! Alors, direction BildBerg!

Maintenant que vous avez votre première image, nous pouvons continuer:

Image


Et voilà une droite entière ! J'ai fait une petite erreur au 4ème élément , j'ai mis 03 à la place de 3. Mettez 3, bien sûr ^^ En tout cas nous avons fait les codes des points 00, 01, 02 et 03! Et maintenant on a plus qu'à continuer le code pour les point "1 0" "1 1" "1 2" "1 3" "2 0" "2 1" etc... Jusqu'à arriver à votre dernier point (chez moi c sera "3 3").

Image


Et voilà, vous pouvez voir nos 4 droites avec nos 4 marges et nos 4x4 éléments! Effectivement, ce sera plus long et plus difficile si vous avez un quadrillage allant de 0 à 80 (81 droites, 81 marges et 81x81 droites) alors c'est pour ça que je vous conseil de faire un copier coller de la formule:

Image



Mais revenons à notre code complet! Maintenant qu'on l'a, il nous reste seulement à mettre ce qu'on peut appeler le pad c'est à dire les 4 actions de déplacement.

Image


Et voilà, prenez exactement les même balises que moi pour avoir un beau pad!

Et maintenant, vous n'avez plus qu'à tester vos déplacements.

Mon personnage reste toujours tourné du même côté, c'est normal?
Oui, pour le moment je n'ai pas trouvé de solution à ce bug, mais je n'en suis pas très loin, et j'ai déjà une grosse idée. Mais, n'étant pas sûr que ça marche, je ne préfère pas encore l'afficher.

Je passe à travers tous les objets, c'est normal?
Pour empêcher ceci, il faut censurer la case. C'est à dire qu'il faudra mettre votre pad entre
2 balises IFs de Var 1 et Var 2. Ensuite il suffira de retirer la flèche dans la direction de l'objet si var 1 = tel nombre et var 2 = tel nombre. Il y aura 4 possibilités, donc 4 fois les mêmes IFs. N'hésitez pas à me poser des questions en privé si vous n'avez pas compris.

Comment déclencher une action quand on est devant un objet?
C'est encore une histoire de var 1 et 2. Il faudra mettre votre action entre ces 2 IFs. Par exemple si le point où vous êtes qui est devant l'objet a comme nom "3 28", il faudra faire:

Image


Et voilà, je vous ai à peu prés tout dit sur le cadrIF. N'hésitez pas à commenter ce topic depuis le forum et à me montrer votre site quand il contiendra ce nouveau langage. N'hésitez pas à me poser des questions car là, j'ai vraiment très vite fait et même un débutant peut le comprendre. Une dernière chose: merci de ne pas faire de site expliquant le cadrIF sans ma permission s'il vous plait, et n'hésitez pas à mettre un petit mot pour moi en bas de votre jeu cadrIF Image. Bye !


Théo du webdo



Chapitre précédent