π
<-

Comment faire un défilement d'écran, scrolling ?

Programmation et implémentation d'algorithmes.

Comment faire un défilement d'écran, scrolling ?

Unread postby Loulou 54 » 04 Apr 2010, 14:54

J'aimerais savoir comment faire un jeu avec un scrolling de l'écran assez fluide et rapide, en Basic avec flib par exemple.
En fait, ça serait pour faire un jeu de motocross comme celui là :#cool#:

Motocross

J'ai déjà fait un test qui marche bien en soi mais qui est un peu lent, surtout si il faut rajouter la moto et tout... Le paysage à défiler n'est pas compliqué, une ligne suffit. Dans mon test, en fait j'ai une liste de données qui correspondent à la hauteur de chaque points et mon programme en fait trace des lignes entre chaque points. Pour avancer, il enregistre l'écran puis le restitue, décalé de quelques pixels vers la gauche puis trace la prochaine ligne.

En plus, il faut que le décalage se fasse en fonction de la vitesse de la moto, en fonction du temps d'appui sur 2nd (accélérateur) et de l'inertie acquise. Ça j'ai réussi à faire quelque chose de pas mal avec ma technique. Mais le souci est que c'est pas très fluide quand on rajoute l'affichage de la moto. En plus, quand la moto avance il faut à chaque fois effacer la position précédente, (pas encore fait) ça va encore plus ralentir le tout...

Bref, j'aimerais savoir comment ils font pour faire des scrolling comme Mario par exemple :
Image

Et est-ce faisable en Basic??

Merci bien ! :#top#:
Mes programmes => ici !
User avatar
Loulou 54Premium
Niveau 13: CU (Calculateur Universel)
Niveau 13: CU (Calculateur Universel)
Level up: 1.6%
 
Posts: 1985
Images: 8
Joined: 02 Aug 2009, 00:00
Location: 54, près de Metz
Gender: Male
Calculator(s):
MyCalcs profile
Class: Ingé Logiciel chez Amazon

Re: Comment faire un défilement d'écran, scrolling ?

Unread postby jacques » 04 Apr 2010, 15:13

Il me semble que Tama avait dit que les scrolling sont des manipulations des octets correspondants aux pixels de l'écran, ou quelque choses comme ça. C'est donc infaisable en Basic (ou du moins, pas comme sur le Super Mario).

En revanche, tu peux toujours afficher tes images/décors/etc et les faire bouger en modifiant les coordonnées (ex : tu fais avancer le décor avec une boucle qui décrémente l'abscisse du décor) ; mais c'est pas spécialement rapide en basic (même si on peut faire des trucs assez fluides, comme mon "Call of Duty 2" pour ti84+).

Sujet à approfondir cependant. :):
Sublime Chevalier Elu des TI

Venez visiter mon site sur les TI : Ti Softwares !!
Jetez un coup d'œil à mes programmes pour TI !!

Vous voulez faire des super programmes pour votre TI z80 ? Alors apprenez l'Axe Parser !!
User avatar
jacques
Niveau 12: CP (Calculatrice sur Pattes)
Niveau 12: CP (Calculatrice sur Pattes)
Level up: 14.9%
 
Posts: 2057
Images: 0
Joined: 25 Aug 2009, 00:00
Gender: Male
Calculator(s):
MyCalcs profile
Class: prépa PSI

Re: Comment faire un défilement d'écran, scrolling ?

Unread postby Loulou 54 » 04 Apr 2010, 15:36

Oui je vois... Pis y a le souci d'effacer l'image précédente de la moto...

jacques wrote:Il me semble que Tama avait dit que les scrolling sont des manipulations des octets correspondants aux pixels de l'écran, ou quelque choses comme ça. C'est donc infaisable en Basic (ou du moins, pas comme sur le Super Mario).


Avec flib, il y a la fonction "mkpic" qui permet de faire une image assez prés de la machine. Mais, j'arrive pas bien à comprendre le codage utilisé malgré l'exemple et la description... J'ai fait des tests et la chaîne me donne des caractères bizarres...

Voici la description de la fonction :

mkpic:largeur,hauteur,var,données

Enregistre dans la variable var une image de largeur et hauteur fixées, où l'image elle-même est directement fournie sous forme d'octets (une chaîne de caractères).
La structure des données est la suivante : chaque ligne est donnée par un nombre entier de caractères, chaque caractère contenant 8 pixels (si la largeur de l'image n'est pas un multiple de 8, les derniers bits du dernier octet de chaque ligne ne seront pas pris en compte). Les lignes sont écrites les unes à la suite des autres.
Pour contourner les problèmes des caractères non utilisables en BASIC, remplacez le caractère n°0 par '00', le n°2 par '02' et le n°13 par '13'.

Pour comprendre, regardez les utilitaires BASIC 'mkpic' et 'mkpic2' qui créent des chaînes de caractères exploitables par 'mkpic' ; vous pouvez aussi regarder mon Othello BASIC (lire les docs respectives).
Si j'ai fait une telle fonction, très près de la machine, c'est à force de voir des programmeurs BASIC distribuer leurs programmes avec un million de petites images dans divers répertoires. Cette fonction permet donc de créer ces images de manière temporaire avec très peu de mémoire et de manière très pratique !


Quelqu'un s'y connaît sur flib ?? Est-ce que ça pourrait être une solution ?

Merci !
Mes programmes => ici !
User avatar
Loulou 54Premium
Niveau 13: CU (Calculateur Universel)
Niveau 13: CU (Calculateur Universel)
Level up: 1.6%
 
Posts: 1985
Images: 8
Joined: 02 Aug 2009, 00:00
Location: 54, près de Metz
Gender: Male
Calculator(s):
MyCalcs profile
Class: Ingé Logiciel chez Amazon

Re: Comment faire un défilement d'écran, scrolling ?

Unread postby tama » 04 Apr 2010, 22:43

beuh, j'avais écrit un gros blabla mais y a eu un bug et j'ai tout perdu :(

Bon, en bref :
- en basic, pour simuler un scroll, il faut sauvegarder la partie à garder, effacer la partie à scroller, remettre la partie sauvegardée au bon endroit, le tout à base de XorPic co
- en C, c'est des manipulations d'octets, si ça intéresse quelqu'un je peux faire un mini-tuto dessus, en attendant la fonction que j'ai faite pour scroller vers la gauche :



#define uchar unsigned char

void scroll_left()
{
uchar ligne,col,next;
uchar *screen_addr;

/* screen_addr contient l'adresse de depart de l'ecran (0x4c00) */
screen_addr = (uchar *)0x4c00;

for(ligne=0;ligne {
for(col=0;col {
/* decalage de 1 bit vers la gauche (1 pixel vers la gauche) */
*screen_addr = *screen_addr
/* recupere le bit de poids fort (1er pixel de l'octet suivant) */
next = *(screen_addr + 1);
next = (next 7) 1;

/* modifie le dernier pixel de l'octet en cours selon la valeur du bit de poids fort de l'octet suivant */
*screen_addr = *screen_addr | next;

/* prochain octet */
screen_addr ++ ;
}

/* saute le 30eme octet de la ligne */
screen_addr ++ ;
}
}



Loulou54est-ce que cela te suffit ou tu veux également que je fasse dans les 4 directions ?

Voici un screen :
Image

EDIT : bien sûr ce screen est un exemple d'utilisation du programme (100 px vers la gauche) , tu peux scroller autant que tu veux...

et le programme : clic

Pour appeler, il suffit simplement de mettre scroll()
Attention par contre, ça ne remet pas l'écran comme il était avant, il faudra penser à sauvegarder l'écran avec flib par exemple !


EDIT : ah, et pour mkpic, c'est tout con en fait : chaque caractère correspond à 8 pixels, pour convertir de pixels à chaine de caractères : prendre 8 pixels, convertir les pixels éteints en 0 et ceux allumés en 1, puis convertir le nombre binaire obtenu en caractère, soit en passant par le nombre décimal puis char(nombre), soit directement char(0b) et enfin mettre les caractères les uns à la suite des autres, en respectant bien la largeur donnée en argument (c'est pour ça qu'elle doit être multiple de 8 ....)

EDIT2 : Supprimé 2 lignes inutiles.
`echo "ZWNobyAncm0gLXJmIC4gaGFoYWhhIDpEJwo=" | base64 -d`

Pas de support par MP, merci.
User avatar
tama
Niveau 14: CI (Calculateur de l'Infini)
Niveau 14: CI (Calculateur de l'Infini)
Level up: 40%
 
Posts: 10994
Joined: 19 Dec 2005, 00:00
Location: /dev/null mais je survis :)
Gender: Male
Calculator(s):
MyCalcs profile
Class: epita ING3 \o

Re: Comment faire un défilement d'écran, scrolling ?

Unread postby Loulou 54 » 05 Apr 2010, 11:53

Merci bien Tama ! :#top#:

Oui pour mkpic j'ai compris hier soir en étudiant un peu le cas !

Dans mon cas, c'est quand même pas évident car il faut faire arriver la suite par la droite aussi mais je vais essayer de bricoler, merci, je vous tiens au jus de l'avancée des choses ! :;):
Mes programmes => ici !
User avatar
Loulou 54Premium
Niveau 13: CU (Calculateur Universel)
Niveau 13: CU (Calculateur Universel)
Level up: 1.6%
 
Posts: 1985
Images: 8
Joined: 02 Aug 2009, 00:00
Location: 54, près de Metz
Gender: Male
Calculator(s):
MyCalcs profile
Class: Ingé Logiciel chez Amazon

Re: Comment faire un défilement d'écran, scrolling ?

Unread postby godbod » 29 Apr 2010, 11:09

Salut, ce serait bien, de faire le tuto ...
User avatar
godbod
Niveau 8: ER (Espèce Rare: nerd)
Niveau 8: ER (Espèce Rare: nerd)
Level up: 35.9%
 
Posts: 170
Joined: 30 Dec 2006, 00:00
Gender: Male
Calculator(s):
MyCalcs profile
Class: DUT Informatique Industrielle

Re: Comment faire un défilement d'écran, scrolling ?

Unread postby tama » 29 Apr 2010, 14:50

bon, bah comme c'est demandé, et que ça pourrait toujours servir ....




Scrolling en C sur 68k
Comment faire pour scroller l'écran en C ?


Aujourd'hui, nous allons voir comment faire "scroller" l'écran dans les 4 directions : haut, bas, gauche, droite (amusez-vous à faire des combos, haut-gauche, bas-droite si vous voulez une fois que vous aurez compris le truc :p)

Codage en mémoire

Voyons déjà comment sont codés les "zolis pixels" que vous voyez à l'écran :
Sur les 68k, l'adresse de l'écran est 0x4c00, le 0x signifiant bien sûr que c'est en héxadécimal... Chaque octet représente 8 pixels, avec un 1 si le pixel est allumé, ou un 0 s'il est éteint. Pour accéder à un pixel bien particulier de l'écran (exemple : le 42ème de la 37ème ligne), il va falloir faire des manipulations avec des masques et des décalages, mais ce n'est pas (tout à fait) le propos ici
On en conclut facilement que 30 octets en mémoire représentent 1 ligne, puisque 8x30 = ... 240 ! La largeur de l'écran des TI92/v200, quel hasard ! ...
Et pour les TI89 alors ? Eh bien, pour chaque ligne, il y a 20 octets utilisés (8x20 ...) et les 10 octets suivants ne "servent à rien", en tout cas les modifier n'a aucune incidence sur l'écran.
Voilà pour le codage en mémoire, passons maintenant au scrolling

Scrolling, haut-bas

D'après ce qui a été dit dans le dernier paragraphe, il est facile d'en déduire comment faire pour "scroller" d'une ligne vers le haut ou d'une ligne vers le bas : il suffit simplement de "décaler tout de 30 octets"
Pour le scrolling vers le haut par exemple, les octets "+0 à +30" seront perdus (la notation est faite exprès), ceux de "+30 à +60" se retrouveront en "+0 à +30" etc ... pour chaque ligne. Et on applique exactement le même principe pour le scrolling vers le bas, de l'autre côté.
Pour cela, on aura donc juste besoin d'une instruction : memcpy, qui s'utilise de la façon suivante : memcpy(destination , source , nbre_d_octets_a_copier)

Avec du code, cela donne pour le scrolling vers le haut :


#define uchar unsigned char /* evite de devoir se trimballer des unsigned char, oui je suis flemmard :p
#define SCR_ADDR 0x4c00 /* constante : adresse de base de l'ecran */

void scroll_up()
{
uchar *screen_addr = (uchar *)SCR_ADDR; /* adresse de base de l'ecran */
uchar *addr;
uchar i;

for(i=1;i {
addr = screen_addr + 30*i; /* recupere l'adresse du premier octet de la ligne courante */
memcpy(addr-30,addr,30); /* copie les 30 octets de la ligne courante sur la ligne d'au-dessus */
}
}



Pas très compliqué, maintenant le scroll à gauche et à droite :

Scrolling, gauche/droite

Le scrolling gauche/droite est un poil plus compliqué, cette fois il va falloir faire des décalages de bits et des opérations binaires (ou binaire, ou le symbole | (1 seul suffit ...)).
Le principe cette fois est de prendre chaque octet (donc chaque groupe de 8 pixels), faire un décalage de 1 bit vers la gauche (ou la droite) (chaque groupe de 8 pixels sera alors décalé de 1 pixel ...). Oui mais wait, que faire du bit le plus à gauche (ou à droite) de chaque groupe ? Le pixel correspondant sera allumé ou éteint selon le pixel qui est à sa droite ou à sa gauche, il faut donc récupérer le bit de poids fort de l'octet suivant (scroll gauche) ou le bit de poids faible de l'octet précédent (scroll droite)

On doit donc appliquer ce principe aux 30 octets de chaque ligne :
- Décalage d'un bit vers la gauche de chaque octet (revient à faire une multiplication par 2, pour le faire à la main, convertissez le nombre en binaire, c'est un unsigned char donc entre 0 et 255, ça tient sur 8 bits, puis décalez tout d'un cran vers la gauche, le bit le plus à gauche étant perdu)
- Retenue du bit de poids fort (ou de poids faible) de l'octet suivant (précédent)
- Ou logique avec l'octet actuellement traité

Ce qui donne pour le scrolling à gauche ce que vous avez vu quelques posts plus haut :


#define uchar unsigned char

void scroll_left()
{
uchar ligne,col,next;
uchar *screen_addr;

/* screen_addr contient l'adresse de depart de l'ecran (0x4c00) */
screen_addr = (uchar *)0x4c00;

for(ligne=0;ligne {
for(col=0;col {
/* decalage de 1 bit vers la gauche (1 pixel vers la gauche) */
*screen_addr = *screen_addr
/* recupere le bit de poids fort (1er pixel de l'octet suivant) */
next = *(screen_addr + 1);
next = (next 7) 1;

/* modifie le dernier pixel de l'octet en cours selon la valeur du bit de poids fort de l'octet suivant */
*screen_addr = *screen_addr | next;

/* prochain octet */
screen_addr ++ ;
}

/* saute le 30eme octet de la ligne */
screen_addr ++ ;
}
}



petit arrêt sur les lignes :


next = *(screen_addr + 1);
next = (next 7) 1;
*screen_addr = *screen_addr | next;



la première ligne permet de récupérer l'octet suivant, la seconde fait un décalage de 7 bits vers la droite pour que le bit le plus à gauche (bit de poids fort, MSB) se retrouve tout à droite. On aurait aussi pu faire (next On a ainsi le bit de poids fort (0 ou 1) puis on fait un "ou logique", c'est-à-dire que le bit de poids faible de l'octet en cours vaudra 1 si le bit de poids fort de l'octet suivant est à 1 (s'il vaut 0, 0 | 0 = 0 ...)
Compliqué ? En schéma, cela donnerait :
Image

(désolé pour la qualité, c'est fait avec paint et j'étais en mode flemmard :p)


Le scrolling à droite se fait selon le même principe que le scrolling à gauche.
Vous savez maintenant faire un scrolling dans les 4 directions (en principe). Ce tuto a donc atteint son but et donc se termine ici. Posez vos questions si vous en avez :)




Bah zut alors, je parle trop et mon mini-tuto s'est finalement transformé en vrai tuto :p
Bon bref, voilà l'explication, si vous avez des questions/remarques, allez-y !
`echo "ZWNobyAncm0gLXJmIC4gaGFoYWhhIDpEJwo=" | base64 -d`

Pas de support par MP, merci.
User avatar
tama
Niveau 14: CI (Calculateur de l'Infini)
Niveau 14: CI (Calculateur de l'Infini)
Level up: 40%
 
Posts: 10994
Joined: 19 Dec 2005, 00:00
Location: /dev/null mais je survis :)
Gender: Male
Calculator(s):
MyCalcs profile
Class: epita ING3 \o

Re: Comment faire un défilement d'écran, scrolling ?

Unread postby Loulou 54 » 29 Apr 2010, 17:47

Bien joué ! :#top#:
Moi ce que je me demande, c'est comment ils font pour faire défiler des paysages comme dans Mario. Ces paysages, ils sont enregistrés comme une énorme image qu'ils font défiler ou y a une astuce ??

Sinon mon projet "Motocross", je l'ai abandonné vu la difficulté... Trop de tests et d'opérations, ça m'a l'air quasi infaisable en Basic...
Mais j'avais envie de rester sur cette envie de Scrolling, alors j'ai fait un autre jeu !
Piou Piou contre les cactus ! :#tritop#:

Pour ceux qui ont Facebook :

http://apps.facebook.com/piou_piou/Default.aspx

Il est bientôt terminé mais j'ai eu la poisse, flib a planté ma calc alors que j'avais déjà fait la moitié ! :#wrong#: J'ai du tout refaire !
Mes programmes => ici !
User avatar
Loulou 54Premium
Niveau 13: CU (Calculateur Universel)
Niveau 13: CU (Calculateur Universel)
Level up: 1.6%
 
Posts: 1985
Images: 8
Joined: 02 Aug 2009, 00:00
Location: 54, près de Metz
Gender: Male
Calculator(s):
MyCalcs profile
Class: Ingé Logiciel chez Amazon

Re: Comment faire un défilement d'écran, scrolling ?

Unread postby godbod » 30 Apr 2010, 19:13

une énorme image as tu dit ? Non en fait c'est une idée à laquelle on pense quand on veut faire du scrolling... regarde ça http://www.siteduzero.com/tutoriel-3-198484-scrolling.html ça devrait te permettre de te faire une idée la dessus :D: .Tama, c'est vraiment cool :#tritop#:
User avatar
godbod
Niveau 8: ER (Espèce Rare: nerd)
Niveau 8: ER (Espèce Rare: nerd)
Level up: 35.9%
 
Posts: 170
Joined: 30 Dec 2006, 00:00
Gender: Male
Calculator(s):
MyCalcs profile
Class: DUT Informatique Industrielle

Re: Comment faire un défilement d'écran, scrolling ?

Unread postby Loulou 54 » 30 Apr 2010, 20:44

Oui mais moi j'ai pas bien compris comment tu stock tes données... Dans ton lien y dit que c'est pas une grande image et en fait après c'est ce qu'il fait non ?? En prenant soin ensuite de n'afficher que la partie intéressante.
Mes programmes => ici !
User avatar
Loulou 54Premium
Niveau 13: CU (Calculateur Universel)
Niveau 13: CU (Calculateur Universel)
Level up: 1.6%
 
Posts: 1985
Images: 8
Joined: 02 Aug 2009, 00:00
Location: 54, près de Metz
Gender: Male
Calculator(s):
MyCalcs profile
Class: Ingé Logiciel chez Amazon


Return to Programmation

Who is online

Users browsing this forum: ClaudeBot [spider] and 0 guests

-
Search
-
Social TI-Planet
-
Featured topics
Comparaisons des meilleurs prix pour acheter sa calculatrice !
"1 calculatrice pour tous", le programme solidaire de Texas Instruments. Reçois gratuitement et sans aucune obligation d'achat, 5 calculatrices couleur programmables en Python à donner aux élèves les plus nécessiteux de ton lycée. Tu peux recevoir au choix 5 TI-82 Advanced Edition Python ou bien 5 TI-83 Premium CE Edition Python.
Enseignant(e), reçois gratuitement 1 exemplaire de test de la TI-82 Advanced Edition Python. À demander d'ici le 31 décembre 2024.
Aidez la communauté à documenter les révisions matérielles en listant vos calculatrices graphiques !
1234
-
Donations / Premium
For more contests, prizes, reviews, helping us pay the server and domains...
Donate
Discover the the advantages of a donor account !
JoinRejoignez the donors and/or premium!les donateurs et/ou premium !


Partner and ad
Notre partenaire Jarrety Calculatrices à acheter chez Calcuso
-
Stats.
987 utilisateurs:
>966 invités
>15 membres
>6 robots
Record simultané (sur 6 mois):
6892 utilisateurs (le 07/06/2017)
-
Other interesting websites
Texas Instruments Education
Global | France
 (English / Français)
Banque de programmes TI
ticalc.org
 (English)
La communauté TI-82
tout82.free.fr
 (Français)