2D Sprite - Principe de base

[falsam]

Pourrais tu poster un code SB d'un jeu très basique ? (pour voir les différences entre PB et SB)

■ Une application web de jeu ne fonctionne pas comme une application codée pour un système d'exploitation comme Windows.

■ Une application Web sera interprété et s'exécutera dans ton navigateur Web.
SpiderBasic va générer ton application sous la forme d'un fichier HTML et d'un fichier JavaSript.
Javascript est un langage événementiel. Le code de ton application n'est pas destiné à s’exécuter séquentiellement, ligne après ligne, du début à la fin. Mais il attend jusqu'à ce qu'un événement soit détecté pour qu'une partie du code s’exécute.

Un exemple : Quand tu charge un sprite, un callback de chargement de ce sprite sera appelée. Ce callback doit être enregistré dans la file d'attente évènementielle de JavaScript.

Code : Tout sélectionner

;
; Evenement chargement des éléments de jeu (Images et sons)
Procedure Loading(Type, Filename.s, ObjectId)
EndProcedure

; Enregistrement des événements
BindEvent(#PB_Event_Loading, @Loading())

; Chargement d'un sprite
LoadSprite(0, "https://pixijs.com/assets/eggHead.png")

De la même manière, tu devras déclarer un callback pour traiter les erreurs de chargement des éléments de ton jeu ainsi qu'un callback pour le rendu de ton jeu.

■ Voila le squelette de base de ton application de jeu.

Code : Tout sélectionner

;
; Evenement chargement des éléments de jeu (Images et sons)
Procedure Loading(Type, Filename.s, ObjectId)
EndProcedure

; Evenement erreur de chargement d'un element de jeu
Procedure LoadingError(Type, Filename.s, ObjectId)
EndProcedure

; Affichage du rendu
Procedure RenderFrame()
EndProcedure

; Enregistrement des événements
BindEvent(#PB_Event_Loading, @Loading())
BindEvent(#PB_Event_LoadingError, @LoadingError())
BindEvent(#PB_Event_RenderFrame, @RenderFrame())

; Chargement d'un sprite
LoadSprite(0, "https://pixijs.com/assets/eggHead.png")

■ Ton jeu fera appel au framework pixijs

■ Tu peux tester ce petit code qui te permet de déplacer un sprite avec les flèches de direction de ton clavier et de changer l'apparence du sprite avec la touche espace.

Code : Tout sélectionner

EnableExplicit

;
; Evenement chargement des éléments de jeu (Images et sons)
Procedure Loading(Type, Filename.s, ObjectId)
  Protected MaxElements = 5
  Static NbLoadedElements 
  
  Debug "Chargement de " + Filename
  NbLoadedElements + 1
  
  ; Est ce que tous les éléments sont chargés ?
  If NbLoadedElements = MaxElements 
    ; Full screen du background
    ZoomSprite(4, ScreenWidth(), ScreenHeight())
    
    ; Démarrage du rendu visuel
    Debug "■ Utiliser les fléches de déplacement"
    Debug "■ Barre d'espace pour changer de personnage"
    FlipBuffers()
  EndIf
EndProcedure

;
; Evenement erreur de chargement d'un element de jeu
Procedure LoadingError(Type, Filename.s, ObjectId)
  Debug Filename + " : Erreur de chargement"
EndProcedure

; Affichage du rendu
Procedure RenderFrame()
  Static PosX = 100, PosY = 100
  Static CurrentSprite = 0
  
  ; Préparation de l'affichage
  ClearScreen(RGB(0, 0, 0))
  
  ; Affichage du background
  DisplaySprite(4, 0, 0)
  
  ; Evenements clavier
  If ExamineKeyboard()
    ; Gauche ou droite
    If KeyboardPushed(#PB_Key_Left)
      PosX-2
    ElseIf KeyboardPushed(#PB_Key_Right)
      PosX+2
    EndIf
    
    ; En haut ou en bas
    If KeyboardPushed(#PB_Key_Up)
      PosY-2
    ElseIf KeyboardPushed(#PB_Key_Down)
      PosY+2
    EndIf
    
    ; Changement de sprite
    If KeyboardReleased(#PB_Key_Space)
      CurrentSprite + 1
      If CurrentSprite = 4
        CurrentSprite = 0
      EndIf
    EndIf
    
    ; Affichage du personnage 
    DisplaySprite(CurrentSprite, PosX, PosY)
  EndIf
  
  ; Affichage du rendu actuel
  FlipBuffers()
EndProcedure

;
; Ouverture d'une fenetre en plein écran
OpenWindow(0, 0, 0, 0, 0, "Basic example", #PB_Window_Background)
OpenWindowedScreen(WindowID(0), 0, 0, WindowWidth(0), WindowHeight(0))
SetFrameRate(60)


;
; Enregistrement des événements du jeu dans la file d'attente evenentielle 
BindEvent(#PB_Event_Loading, @Loading())
BindEvent(#PB_Event_LoadingError, @LoadingError())
BindEvent(#PB_Event_RenderFrame, @RenderFrame())

;
; Chargement des sprites
LoadSprite(0, "https://pixijs.com/assets/eggHead.png")    ;Sprite 0
LoadSprite(1, "https://pixijs.com/assets/flowerTop.png")  ;Sprite 1
LoadSprite(2, "https://pixijs.com/assets/helmlok.png")    ;Sprite 2
LoadSprite(3, "https://pixijs.com/assets/skully.png")     ;Sprite 3
LoadSprite(4, "https://pixijs.com/assets/bg_rotate.jpg")  ;Background

[Ar-S]

Merci pour cet exemple