Aller au menu - Aller au contenu

[Plan du site] Vous êtes ici --- > Le Site du Zéro > Les tutoriels > Non-Officiels > Programmation > Calculatrices > Casio > Lecture du tutoriel

Des lignes, des cercles, des points.

Auteur : Deltod
Créé : le 27/07/2006 22:51:22
Modifié : le 05/06/2007 10:29:21
Noter et commenter ce tutoriel
Imprimer ce tutoriel
Vous vous apprêtez à lire un tutoriel rédigé par un membre de ce site. Malgré tout le soin que ce membre a pu apporter au tutoriel, nous ne pouvons pas garantir que les informations contenues sur cette page sont exactes à 100%. Merci de garder cela en tête lorsque vous lirez cette page ;o)
Ça y est ! Je vous l'assure, c'est dans ce chapitre que vous allez enfin pouvoir réellement commencer à faire joujou avec des petits dessins. ^^ Bon, ok, rien d'extraordinaire... mais c'est déjà ça ! Depuis le temps que vous l'attendez, je pense que vous devez être prêts... Go !
Sommaire du chapitre :
Chapitre précédent Sommaire Chapitre suivant

La base : Afficher des points.

Nous entrons maintenant dans le vif du sujet ! Il va falloir être attentif, sinon vous allez vite couler...

C'est si compliqué que ça ? :'(

Ce n'est pas compliqué, c'est complexe. La nuance est grande. Vous allez apprendre les bases du graphisme, donc ça vous resservira dans chaque programme. Si vous le voulez bien, commençons. :)
Dans un premier temps, créez un nouveau programme (j'espère que vous n'avez pas besoin de moi, quand même...). Intitulez-le : "TESTPXL".
Petite question : que devez-vous faire en premier, étant donné que vous allez créer un programme contenant des graphismes ?

Heu... les réglages de la fenêtre graphique et des options ?

Exactement ! Commencez toujours par ça. Réglez donc votre fenêtre graphique pour qu'elle comprenne l'écran dans sa totalité. Concernant les autres réglages, mettez les axes, label, grid et coord sur 'off', et n'oubliez pas le Cls, sans quoi vous risqueriez de vous retrouver avec un dessin fait auparavant.

Sachez qu'il existe plusieurs façons pour afficher un point à l'écran, mais avant, une petite mise au point s'impose :
Image utilisateur

Voici les coordonnées de votre écran. Vous remarquez que le premier chiffre d'un couple représente la position du point sur les abscisses (l'horizontale), et qu'à l'inverse, le second chiffre représente la position du point sur l'axe des ordonnées (la verticale).
Petite question : si je veux afficher un point au milieu de l'écran, quelles vont être ses coordonnées ?

Je sais ! 127 / 2 = 63.5, et 63 / 2 = 31.5 : les coordonnées seront donc : 63.5, 31.5, non ?

Le raisonnement est bon, mais la réponse est fausse. On arrive au second point que je voulais aborder. Les pixels sont des points qui composent votre écran. Par conséquent, leurs coordonnées seront des nombres entiers, c'est logique : on ne fait pas des "moitiés de pixels".
Donc, la réponse serait plutôt :
Code : Autre
1
PlotOn 63,31


PlotOn ? C'est quoi ça ?

Eh bien, tout simplement la commande qui vous permettra d'afficher ce fameux point ! Comme vous le remarquez, la syntaxe est on ne peut plus simple :
PlotOn coordonnée en x,coordonnée en y
La très grande majorité des fonctions graphiques que vous utiliserez se trouvent dans le menu Sketch, qui correspond au bouton F4 de votre Casio.
Ainsi, pour accéder à la fonction PlotOn, il faudra faire : SHIFT \ F4 \ F6 \ F1 \ F2.
Maintenant, à vous de jouer ! Essayez d'afficher des points un peu partout sur l'écran ! Combinez vos connaissances : essayez de demander au joueur où il veut que ses points soit affichés, en pensant bien sûr à faire quelques vérifications toutes simples sur les nombres entrés, pour être sûr qu'un petit rigolo n'entre pas par exemple 15260,658.
Ce n'est pas très compliqué, et vous devriez être tout à fait capables d'y arriver.

Revenons-en à nos moutons si vous le voulez bien.
Comme je vous l'ai signalé tout à l'heure, il existe d'autres moyens pour afficher un point. On va se servir de la fonction PxlOn, qui se trouve ici : SHIFT \ F4 \ F6 \ F6 \ F3 \ F1. Et de nouveau, une petite explication s'impose :

Image utilisateur

Vous remarquez ce qui a changé ? Le couple est maintenant sous la forme :
PxlOn y,x.
La valeur de x est toujours l'horizontale de gauche à droite, mais par contre, celle de y est devenue la verticale de haut en bas. Notre point au milieu aura donc pour coordonnées :
Code : Autre
1
PxlOn 31,63

Le point au milieu de l'écran est un mauvais exemple ! Il ne suffit pas d'intervertir les coordonnées entre PlotOn et PxlOn, comme c'est le cas pour ce point. Si vous en faites un tout en haut, avec Plot il aura pour coordonnées y = 63, et avec PxlOn, y = 1. Si vous comprenez ça, vous avez tout compris !

Ok, c'est cool de faire tout plein de points, mais je ne pourrais pas effacer ceux qui ne me servent plus ?

Bien sûr que si ! Heureusement, et ce sera même très rapide. En gros, la syntaxe est exactement la même. Sauf qu'au lieu d'utiliser PxlOn, on va maintenant utiliser...PxlOff !
Décidément, le BASIC CASIO est vraiment trop difficile...
Code : Autre
1
2
3
PlotOff x,y

PxlOff y,x



Ces petits points n'ont pas fini de vous étonner...



Éteindre ou allumer un pixel



Nous allons maintenant aborder une partie intéressante. Vous allez voir que votre calto en sait des choses !
Bon, vous savez afficher des points, et même les effacer. Mais que diriez-vous de pouvoir allumer un pixel s'il est éteint, et à l'inverse, l'éteindre s'il était allumé ? C'est tout à fait possible, et c'est très simple en plus !
Les fonctions qui nous intéressent sont : PlotChg et PxlChg.
Il suffit ensuite d'indiquer les coordonnées du pixel à changer (en faisant attention à la syntaxe en fonction de l'utilisation de l'une ou l'autre fonction), et c'est tout !
Code : Autre
1
2
3
PlotChg x,y

PxlChg x,y


Tester un pixel



Derrière ce titre plutôt abstrait, se cache une fonction utile, mais qui, je ne vous le cache pas, est très lente. Par conséquent, elle ne vous servira que dans des cas très isolés, mais vous devez savoir que ça existe. C'est encore une fois très simple... Il y a juste une toute petite contrainte. La fonction que nous utiliserons ici est la fonction PxlTest, mais il n'existe pas de fonction PlotTest. Par conséquent, si vous êtes plus familiarisés avec Plot qu'avec Pxl, vous devrez faire avec. Vous trouverez cette fonction ici : SHIFT \ F6 \ F6 \ F4.
Elle travaille de la manière suivante :


Vous l'aurez compris : la syntaxe est donc :
Code : Autre
1
PxlTest y,x



C'est à peu près tout ce que vous deviez savoir sur l'affichage de points. Allumer les pixels un par un reste tout de même assez long et fastidieux... Que diriez vous de tracer des lignes maintenant ?

Tracer des lignes

Nous y voilà enfin. C'est maintenant que ça va devenir intéressant, et que vos possibilités de graphisme et de jeux vont décuplées ! Et devinez quoi ? Cerise sur le gâteau, c'est très simple ! :p Allez au boulot.

Il existe plusieurs méthode pour tracer une simple lignes, en faite il en existe 3, oui je sais ça fait beaucoup juste pour tracer une ligne mais vous verez qu'il y a quelques petites nuances entre chaque.

1ère méthode : Line



Commencons d'abord par la fonction Line. Vous la trouverez à cet emplacement : SHIFT\F4\F6\F2\F2.
La syntaxe est la suivante :
Code : Autre
1
2
3
4
5
Plot x1,y1

Ploy x2,y2

Line

Cette commande tracera la ligne reliant les deux points. Voici un exemple :
Code : Autre
1
2
3
4
5
Plot 35,12

Plot 120,57

Line

Ce qui affichera :
Ligne


Essayer vous même de rentrez différents points, et observez ainsi chaque ligne que vous créez. Bien sûr vous pouvez superposer plusieurs lignes. Et rappellez vous aussi de la commande Cls pour effacer l'écran ;)
Je vous avouerais que cette méthode est très rarement utilisée pour plusieurs raisons, tout d'abord car elle prend 3 lignes dans un programme et est plutôt fastidieuse à écrire. Heureusement il existe cette fois çi une méthode beaucoup plus utilisée...

2nde méthode : F-Line



Vous trouverez la commande F-Line ici : SHIFT\F4\F6\F2\F2.
Elle a tous les avantages par rapport à la première, regardez la syntaxe :
Code : Autre
1
F-line x1,y1,x2,y2

Et oui c'est tout ! Reprenons l'exemple de tout à l'heure :
Code : Autre
1
F-Line 35,12,120,57

Ce code affichera bien sûr...

Ligne

...la même ligne que précédemment !
Admettez que c'est vraiment pas très compliqué...
Il nous reste à voir maintenant la 3ème méthode.

3ème méthode : Vert/Hztl



Cette dernière méthode nous permettra de tracer seulement des droites verticales (Vert) ou horizontales (Hztl) sur toute la ligne.

o_O

En fait, grâce à cette méthode vous pourrez tracer des lignes horizontales et verticales, mais qui prendront tout l'écran, ainsi vous ne pourrez pas tracez une droite verticale qui prend seulement la moitié de l'écran.
Vous trouverez ses fonctions ici : SHIFT\F4\F6\F4 ou F5
La syntaxe est très simple :
Code : Autre
1
2
3
Vertical y

Horizontal x

Vous remarquez qu'il n'y a plus qu'une seule coordonné. C'est logique, car la droite sera tracé sur tout la largeur/hauteur de votre écran. Je pense qu'un exemple ne serait pas de trop :
Code : Autre
1
Vertical 65


verticale

La droite est tracée sur toute la hauteur de l'écran, à l'abscisse 65.

Code : Autre
1
Horizontal 32


horizontale

La droite est tracée sur toute la largeur de l'écran, à l'ordonné 32.

Faire de beaux cercles !

Vous savez maintenant presque tout faire en ce qui concerne les différentes fonctions de dessins, il ne reste plus qu'a apprendre comme dessiner...un cercle ! Il reste aussi à apprendre les drawstats mais on vera ça plus tard ;)

Je vous préviens, ça va être très rapide car c'est très simple (et oui encore une fois...).
La fonction qui va nous servire est la suivante : Crcl.
Vous la trouverez ici : SHIFT\F4\F6\F3.
La syntaxe est maintenant un tout petit peu plus complexe, mais vraiment pas grand chose ^^

Code : Autre
1
Circle x,y,z


x et y représente les coordonnées du centre de votre cercle et z la valeur du diamètre en pxl. Par exemple :

Code : Autre
1
Circle 63,32,15


Ce code créera un cercle de 15pxl de diamètre au centre de l'écran :

cercle

La vitesse d'affichage d'un cercle est très lente et son diamètre n'y change rien ! Alors je vous conseil de le créer "à la main" par le biais de plusieurs F-Line. Et pour ce faire, je vais vous montrer un logiciel très utile ;)


Ce logiciel a été entierement crée par l'équipe de programmeur du site Planète Casio. Un site que je vous recommande fortement ! Il regroupe une grande communautée de programmeur pour calculatrice Casio, et vous pourrez y postez vos futur jeux ;) .
Tout cela pour vous dire que c'est sur ce site que je vous demanderais de télécharger le logiciel Photo Casio. Il est très simple d'utilisation et je vous invite à explorer l'aider dans le lien que je vous ai donné.

Alors ? C'était si dur que ça ? J'admets que le fait de devoir retenir certaines coordonnées peut être fastidieux, mais encore ! Rappelez-vous du logiciel que je vous ai montré. ;)
Chapitre précédent Sommaire Chapitre suivant
Auteur : Deltod
Noter et commenter ce tutoriel
Imprimer ce tutoriel

Changer de design | En savoir plus | Plan du site | Politique d'accessibilité | Règles | Fil RSS | XHTML 1.0 | CSS 2.0
Édité par Simple IT SARL : Nous contacter | Revue de presse | Publicité

Y'a plus rien à lire, faut remonter maintenant !

Hébergement web - Correction de tutoriels - Créer un site
Vous souhaitez apparaître ici ? Contactez-nous.

Nombre de connectés 304 Zéros connectés | Requêtes SQL 10 requêtes | Temps de génération de la page : Total (SQL) 0.0617s (0.0482s)