Niveau : Intermédiaire.
Prérequis : Les 4 cours sur le Ruby.
Outils : Créer un nouveau projet vierge RMVX comme si vous vouliez commencer un nouveau jeu.
Sujets traités : Premiere approche du RGSS2.
Etude de scene simple et des window de base.

Un RPG s'articule généralement autour de trois axes :
- La map.
- Les combats.
- Les menus.

C'est ce dernier axe qui sera au coeur des deux prochains cours !!


Cours :

Definition des termes :

Une scene :
En RGSS, "scene" est une terme générique utilisé pour designer une phase de jeu.
Cette phase peut prendre differentes formes :
L'ecran titre, le menu principal, chaque options du menu, la map, les combats, voila autant de phase de jeu diferrentes, donc de scene differentes.
RMVX mets en evidence toutes ces scenes, chaque scene est une classe au fonctionnement bien particulier.

Une window :
Une window est un terme générique utilisé pour designer une fenetre d'affichage.
L'ecran titre est composé d'une window, en combat on affiche successivement des dizaines de window differentes.

- Les windows sont affichées par le biais de scenes.
Il n'est pas necessaire de créer une scene pour chaque window ( exemple des combats sus-mentionné, il n'y a qu'une scene mais des dizaines de window ).
Une scene peut parfaitement n'utiliser aucune window.
C'est le cas de Scene_Map par exemple, c'est aussi le cas sur ce screen :

Spoiler:

La scene qui affiche cela n'utilise aucune window !!


Etude du fonctionnement d'une scene :

Si vous ne connaissez pas à 600% le cours N° 3, c'est le moment idéal d'aller reviser !!

A partir de maintenant, vous avez RMVX ainsi que le manuel ( F1 - votre second meilleur ami !! ) ouvert sous les yeux.
Ouvrez l'editeur des script ( F11 - definitivement votre meilleur ami !! ) et regardez tout en bas => "Main".

Le bloc "begin ... end" n'a plus de secret pour vous normalement.
Nous allons regarder ceci de plus pres :

Code:

  $scene = Scene_Title.new
  $scene.main while $scene != nil

Voila RMVX !!
( oui, je sais, ça n'a l'air de rien ... )

La variable globale "$scene" est affecté avec un nouvel objet de la classe Scene_Title.
Une boucle appelle la methode "main" de la scene tant que notre variable est differente de "nil".
Pour passer d'une scene à l'autre, il nous suffira donc de modifier la variable "$scene".
La boucle fera le reste ( en admettant que notre nouvelle scene possede bien une methode "main" ... ).
Tant que "$scene" est different de "nil", nous pourrons passer d'une scene à l'autre, c'est ainsi que fonctionnera votre jeu.

Pour vous simplifier la vie, les créateurs ont integré une classe spécifique qui sert de modele à toutes les scenes.
C'est grace à l'héritage que nous nous assurons que toutes les scenes possedent bien une methode "main" !!

Cette scene s'appelle "Scene_Base", toutes les autres scenes que vous pouvez voir dans l'editeur lui doivent tout !!
( C'est à dire, qu'elles en héritent ... )

Examinons là de plus pres :

Quel est la premiere chose que nous voyons ?
Une methode "main", ouf, nous voila rassuré ...

Cette methode est donc appellé en permanence dans le script "main", elle dois donc etre tres importante.
En effet, elle agit au sein de votre scene de la même maniere que "main" agit au sein de votre jeu.
C'est à dire, il se passe quelque chose tant qu'elle se repete.

Spoiler:

Cette methode appelle dans un ordre prédeterminé d'autres methodes.
On entre ensuite dans une boucle qui se repetera sauf si "$scene != self", c'est à dire, la boucle prendra fin si on change de scene.
Si on sort de la boucle, "main" appelle d'autre methode ...

Pour toutes les scenes de base ( et aussi pour 99.9999 % de celle que vous trouverez sur le Net ou créerez ), "main" est identique.
La methode n'est pas reprise dans les autres classes "Scene_...", une fois de plus, c'est l'héritage qui joue !!
C'est par une definition differentes des methodes appellés par "main" que s'explique la diversité entre les scenes.

Avant d'aller plus loin, expliquons ces lignes :

Code:

Input.update                  # Update input information
Graphics.update            # Update game screen
Graphics.freeze              # Prepare transition

Input et Graphics sont des modules.
En RGSS2, il y a 7 modules spécifiques.
3 sont present dans l'editeur ( an haut ), les autres sont détaillé dans le manuel.
Rapidement car nous y reviendrons souvent :

- Vocab regroupe sous forme de String tout ce qui est lexique.
( Tous les termes que vous avez defini dans la BDD ou directement dans le script Vocab et qui sont utilisé frequemment !! ).

- Sound regroupe tout ce qui est effet sonore.
( Le bruit "Cursor", "Buzzer", bref tous les sons utilisés frequemment !! )

- Cache regroupe tout ce qui est acces aux ressources ( RTP ou importé ).

- Audio regroupe tous ce qui est acces aux differentes ressources sonores ( BGM, BGS, ME, SE ).
( Sound offre en fait un raccourci vers Audio pour certains sons tres utilisés )

- Graphics regroupe tout ce qui est gestion graphique ( donc, tout ce qui se passe à l'ecran ).
( Dans la boucle de la methode "main" de "Scene_Base", une mise à jour graphique est donc effectué à chaques frames ).

- Input regroupe tout ce qui gestion des entrées clavier.
( Dans la boucle de la methode "main" de "Scene_Base", une mise à jour est donc effectué à chaques frames ).

- RPG regroupe tout ce qui est defini dans l'editeur ( Map, evenement, BDD ).

Retour à nos methodes maintenant !!
Parmis toutes les methodes appellés par "main", il y a en trois de FONDAMENTALES !!
( Z'avez vu, j'ai ecrit en majuscules et en gras, ça doit etre important ... )
Trois methodes qui sont le minimum pour créer une scene.

"start" est la premiere methode appellé par "main", et comme son nom l'indique, c'est celle qui demarre la scene.
Elle permet de mettre la scene dans un état lui permettant d'être affiché par l'interface graphique.
C'est à dire, elle crée tout ce qui doit etre créer dés le debut ( Window, Sprite, ... ).

"update" est la seule methode appellé dans la boucle avec les mises à jour des modules sus-mentionnés.
C'est donc par cette methode que va passer toutes les actions que l'on pourra effectuer durant la scene.

"terminate" est la derniere methode appellé par "main", et comme son nom l'indique, c'est celle qui mets fin à la scene.
C'est à dire, detruit tout ce qui à été crée.

Il est donc temps pour nous de créer notre premiere scene !!
Créer un nouveau script dans Materials et entrez ceci :

Code:

class Scene_Test < Scene_Base
 
  def start
 
  end
 
  def terminate
 
  end
 
  def update
 
  end
 
end

C'est le minimum, certe, mais il ne va pas se passer grand chose ...
Et sans possiblité de sortir de cette scene, ça ne va etre tres pratique.

On va donc completer un peu la methode "update"

Code:

  def update
    if Input.trigger?(Input::B)
      Sound.play_cancel
      $scene = nil
    elsif Input.trigger?(Input::C)
      Sound.play_decision
      $scene = Scene_Map.new
    end
  end

La methode "trigger?" du module "Input" verifie si la touche indiqué en parametre en appuyer ou non.
C'est l'appui qui est controlé ( instantané ), donc, ni la pression ( continue ), ni la répétition.
La constante "B" du module Input correspond à la touche "Annulation" et "C" à la touche "Validation".
En ce qui concerne les actions executées :
On utilise ici deux sons bien connu ( "Annulation" et "Validation" pour coller aux touches utilisées ).
"$scene = nil", pour ceux qui n'ont pas suivi, entrainera la fermeture du jeu. ( Souvenez vous du script "main" )
"$scene = Scene_Map.new" nous entrainera vers une nouvelle scene ( ici, ce sera une map ).

Pour tester ça, utilisons une insertion de script dans un PNJ, par exmple !!
( Insertion de script => $scene = Scene_Test.new )

Comme rien n'a été crée dans cette scene, l'ecran est noir.
Mais nos Input fonctionne parfaitement.
La base de notre scene est donc opérationnelle !!
Mais, je vous l'accorde, ça ne rime à rien pour l'instant ...

Sprite, Bitmap ? Qu'est-ce que c'est ? :

Vous en apprendrez d'avantage en regardant les sections sur les differentes classes ci-dessous dans le manuel.

Un Sprite :
J'utilise une majuscules car il s'agit d'une classe du RGSS2.
Un Sprite, c'est une surface.
Cette surface en elle même ne ressemble à rien, mais elle offre un support pour d'autres elements.
Cette surface, on peut la deplacer, l'aggrandir, la faire tourner, onduler, changer sa couleur, en prendre un petit bout, ...

Un Bitmap :
La surface n'est rien sans un Bitmap pour lui donner "apparence".
Cette apparence est le plus souvent une ressource mais ça peut etre une apparance "vide".
( Dois-je vous rappeler l'existance du module Cache ? Non, vous etes des eleves attentifs, hein ? )
Tout comme pour les Sprites, il est possible de faire plein de chose avec les Bitmaps !!
( Les decouper, les etirer, dessiner dessus - rectangle, dégradé de couleur, pixel par pixel -, ecrire dessus, ... )

Vous avez été sage, c'est l'heure de la récréation !!

Code:

class Scene_Test < Scene_Base
 
  def start
    @fond = Sprite.new
    @fond.bitmap = Bitmap.new(544, 416)
    @compteur = 1
  end
 
  def terminate
    @fond.dispose
  end
 
  def update
    if Input.trigger?(Input::B)
      Sound.play_cancel
      $scene = Scene_Map.new
    elsif Input.trigger?(Input::C)
      Sound.play_decision
      @compteur.times do
        x = rand(544)
        y = rand(416)
        color = Color.new(rand(255), rand(255), rand(255))
        @fond.bitmap.set_pixel(x, y, color)
      end
      @compteur *= 2 if @compteur < 200
    end
  end
 
end

Allez, amusez vous !!

Tout d'abord, dans "start", on crée un Sprite, et on lui associe un Bitmap ( de la taille de l'ecran ).
Ce Bitmap n'a pas d'apparence pour l'instant.
On crée un Sprite dans "start" donc on detruit un Sprite dans "terminate", la methode "dispose" est spécialement conçu pour ça !!
( Cela doit devenir automatique pour vous création/destruction, je mettrais toujours la methode "terminate" juste sous "start" pour ne pas oublier )
Le Bitmap est automatiquement liberé quant on libere le Sprite ( normal, ils sont associés ).
Le compteur est là pour eviter le lag et rendre ça plus visuel ...
Voici un truc interessant :

Code:

@fond.bitmap.set_pixel(x, y, color)

Le methode "set_pixel" de la classe "Bitmap" sert à "colorier" un pixel du Bitmap.
On doit juste indiquer les coordonnées x / y où agir ainsi que la couleur.
ici, on choisit un emplacement aléatoire et une couleur aléatoire.
( Nous reverrons plus tard en detail les couleurs )

Il est temps ( enfin ) de s'interesser aux window !!

Etude des windows ( partie 1 ) :

Une window est en fait un objet de la classe Window.
Il s'agit d'un type particulier d'association Sprite/Bitmap.
Il existe une classe Window_Base qui sert de classe par defaut pour les window.
Les fenetres sont composées d'un cadre de 16 pixels et d'une surface interieure sur laquel on peut faire ce qu'on veux.
( Il s'agit d'un Bitmap donc vous savez à quoi vous attendre !! )

Créons donc notre premiere fenetre :

Code:

class Scene_Test < Scene_Base
 
  def start
    @fenetre = Window_Base.new(0, 0, 544, 416)
  end
 
  def terminate
    @fenetre.dispose
  end
 
  def update
    if Input.trigger?(Input::B)
      Sound.play_cancel
      $scene = Scene_Map.new
    end
  end
 
end

Ca fonctionne mais ça n'est pas terrible ...
Les parametres utilisés à la création de notre fenetre sont de gauche à droite :
Position x de la fenetre, position y de la fenetre, largeur de la fenetre, hauteur de la fenetre.
Pour connaitre les parametres, pas de secret, on regarde dans les scripts de base ou le manuel la methode "initialize".

Code:

class Window_Base < Window
  #--------------------------------------------------------------------------
  # * Constants
  #--------------------------------------------------------------------------
  WLH = 24                  # Window Line Height
  #--------------------------------------------------------------------------
  # * Object Initialization
  #    x      : window x-coordinate
  #    y      : window y-coordinate
  #    width  : window width
  #    height : window height
  #--------------------------------------------------------------------------
  def initialize(x, y, width, height)
    super()
    self.windowskin = Cache.system("Window")
    self.x = x
    self.y = y
    self.width = width
    self.height = height
    self.z = 100
    self.back_opacity = 200
    self.openness = 255
    create_contents
    @opening = false
    @closing = false
  end
end

On remarque que Window_Base herite de Window ( pour plus d'information sur celle ci, go manuel !! ).
Et les commentaires ( certe, en anglais ) prouve que je ne ment pas !!
"self" designe la fenetre en elle-même.
On associe un Bitmap particulier à cette fenetre ( le windowskin )
Les methodes x, y, width et height, vous pouvez facilement les comprendre ( déjà vu grace aux parametres )
La methode "z" designe la priorité d'affichage.
Si vous avez deux fenetres ayant respectivement un "z" de 50 et 120, celle à 50 apparaitra sous l'autre.
La methode "back_opacity" designe l'opacité de la zone de travail ( le Bitmap centrale ).
A 200 sur 255, elle est tres legerement transparente.
Pour voir le Bitmap de fond justement, il faut regarder la methode "create_contents" appellé un peu plus bas.

Code:

  def create_contents
    self.contents.dispose
    self.contents = Bitmap.new(width - 32, height - 32)
  end

Vous comprennez maintenant pourquoi j'ai parlé d'un cadre de 16 pixels !!

Tout à l'heure, on avait utilisé "@fond.bitmap.set_pixel()".
Dans une window, vous avez evidement devinez que nous utiliserons "self.contens.set_pixel()" !!

Pour pouvoir aller plus loin, on ne va pas utiliser la classe Window_Base, mais on va créer notre propre classe, rien qu'a nous !!

Nous avons vu plus tôt ce qu'etait une scene "minimum", voici une window "minimum" :

Code:

class Notre_Window < Window_Base
 
  def initialize
    super(0, 0, 544, 416)
    refresh
  end
 
  def refresh
    self.contents.clear
   
  end

end

On passe les dimensions de notre fenetre en parametre à Window_Base par l'intermediaire du "super".
( Pourquoi se fatiguer, laissons ça aux parents !! )
La methode "refresh" est celle qui va gerer tout l'affichage.
Avant de travailler, on nettoye la zone de travail ( self.contents.clear ), vous ne voudriez pas que le nouveau affichage se superpose à l'ancien à chaque fois ...
Voyons comment combler un peu ce grand espace tout vide ...

Spoiler:

Je sais, c'est pour vous inciter à taper le code vous même !!

La methode "fill_rect" sert à designer un zone de couleur ( carré ou rectangle facilement, plus si vous reflechissez un peu !! )
On peut facilement deviner les parametres, ce sont ceux qui reviendront tres souvent :
Coordonnée X, coordonnée Y, largeur, hauteur et couleur.

Les couleurs sont des objets de la classes couleurs.
Cette classe peut recevoir quatres parametres lors de sa création.
- Teneur de rouge dans le couleur ( entre 0 et 255 )
- Teneur de vert dans la couleur ( entre 0 et 255 )
- Teneur de bleu dans la couleur ( entre 0 et 255 )
- Valeur "alpha" la transparence en quelque sorte ( entre 0 et 255 )
Seul l'alpha peut etre "omis", elle sera alors par defaut de 255.

Voyons maintenant une fenetre un peu particuliere, les listes de choix.

Etude de Window_Command :

Window_Command est un type particulier de Window_Selectable.
Cette derniere classe est tres complexe et riche en possibilité, elle fera l'objet d'une etude approfondi dans le cours N° 6.
Mais Window_Command est une classe tellement simple à utiliser que nous allons la voir avant !!
Simple à utiliser car tout est déjà conçu, mais pas forcement simple à comprendre.

Spoiler:

Cette classe est assez courte, Window_Command est conçu pour vous permettre de créer facilement des listes de choix.
Elle est donc de ce point de vue limité, mais cependant tres pratique.

A sa création, elle attends deux parametres obligatoires et trois facultatifs.
- width designe la largeur de la fenetre.
- commands est un tableau de String, chaque entrée sera un choix possible.
- column_max designe le nombre de colonne.
Par defaut, il y a une seule colonne ( donc liste verticale ).
- row_max designe le nombre de rang.
Si rien n'est indiqué, le nombre de rang sera calculé automatiquement ( à partir du nombre de choix et du nombre de colonne ).
Cela pourra poser probleme si jamais vous avez par exemple 50 choix mais une colonne.
Une ligne de texte fait 24 pixels de haut ( voir la constante WLH de Window_Base ).
Donc 50 * 24 + 32 = 1232 comparé à nos 416 de hauteur pour la fenetre, effectivement il y a un probleme ...
D'où l'interet de definir un nombre de rang !!

Hélas, milles fois hélas, il y a un defaut de conception dans cette classe ...
En effet, aucune liste utilisé dans les scripts de base n'utilise plus de rang qu'il n'y a de place en hauteur, donc ce defaut n'apparait que si vous créé votre propre liste ...
Avant de vous dire comment regler ce probleme, je vais vous le montrer :

Code:

class Scene_Test < Scene_Base
 
  def start
    tab = []
    for x in 1..50
      tab.push("Choix N° #{x}")
    end
    @choix = Window_Command.new(150, tab, 1, 10)
  end
 
  def terminate
    @choix.dispose
  end
 
  def update
    @choix.update
    if Input.trigger?(Input::B)
      Sound.play_cancel
      $scene = Scene_Map.new
    elsif Input.trigger?(Input::C)
      Sound.play_decision

    end
  end
 
end

Je crée un tableau de 50 String pour faire mes choix en utilisant une boucle parce que je suis paresseux ...
Souvent, vous verrez plutôt cela :

Code:

    s1 = "Attaquer"
    s2 = "Magie"
    s3 = "Defense"
    s4 = "Objet"
    @choix = Window_Command.new(120, [s1, s2, s3, s4])

Mais ceci est parfaitement possible aussi :

Code:

    @choix = Window_Command.new(100, ["Oui", "Non"])

Mais là, avec 50 choix, une boucle me semble mieux ...
Une colonne, dix lignes, tout fonctionne parfaitement ( et tres simplement ) ... sauf si on descends ...
Hé oui, le voila le probleme sus-mentionné !!

Pour eviter ça, il suffit d'ajouter une ligne dans la methode "refresh" de Window_Command :

Code:

  def refresh
    self.contents.clear
    create_contents  ## A ajouter !!
    for i in 0...@item_max
      draw_item(i)
    end
  end

Il s'agit d'une methode que nous avons déjà vu, c'est celle qui crée le Bitmap "contents" de la window.
Ici, son role sera de recréer un Bitmap adapté à la situation, c'est aussi simple que ça ...

Maintenant que nous sommes des spécialistes de la création de Window_Command, il est tant de s'interesser à son fonctionnement !!
La création est simplifié, la gestion aussi.
Tout est automatiquement geré par la methode "update" de Window_Command.
( En fait, c'est celle de Window_Selectable, n'oubliez pas, on laisse les parents tout faire à notre place !! )

J'espere que vous aviez tous remarqué cette ligne :

Code:

    @choix.update

Sans vous en rendre compte, vous avez bougé le curseur de choix et il a obeit sans qu'on le programme ...
Pour l'instant, disons que c'est magique ... l'etude complete de Window_Selectable, c'est pour le cours suivant.

Scene, window, bitmap, vous en savez beaucoup.
Je crois qu'il est tant pour vous de créer votre premiere scene !!

Ma premiere scene :

Et pour ça, on va se faire une scene recapitulative, une démonstration des possibilités que nous offre les window.
Il faut donc reprendre du debut :

Code:

class Scene_Test < Scene_Base
 
  def start

  end
 
  def terminate

  end
 
  def update

  end
 
end

On crée ensuite une Window_Command où chaque choix est une possibilité des Bitmap.
Et, tant qu'on y est, on va créer la sortie de la scene ...

Code:

class Scene_Test < Scene_Base
 
  def start
    @controle = []
    s1 = "Coller un Bitmap"
    s2 = "Coller un Bitmap deformé"
    s3 = "Rectangle de couleur uni"
    s4 = "Rectangle avec degradé de couleur"
    s5 = "Colorier un pixel"
    s6 = "Controler la couleur d'un pixel"
    s7 = "Changer la teinte du Bitmap"
    s8 = "Effet flou"
    s9 = "Effet flou circulaire"
    s10 = "Ecrire"
    s11 = "Controler la taille d'une String"
    s12 = "Nettoyer le Bitmap"
    s13 = "Bah, aller se coucher ..."
    @choix = Window_Command.new(350, [s1,s2,s3,s4,s5,s6,s7,s8,s9,s10,s11,s12,s13], 1, 5)
    @choix.x = (544/2) - (350/2)
    @choix.y = (416/2) - ((5 * 24 + 32) / 2)
    @choix.z = 50
    @choix.draw_item(12, false)
  end
 
  def terminate
    @choix.dispose
  end
 
  def update
    @choix.update
    if Input.trigger?(Input::B)
      Sound.play_cancel
      $scene = Scene_Map.new
    elsif Input.trigger?(Input::C)
     
    end
  end
 
end

Et oui, on peut faire tout ça avec un Bitmap !!
les calculs "compliqués" servent juste à center la fenetre de choix.
La seule ligne que nous n'avons pas encore vu, c'est ça :

Code:

    @choix.draw_item(12, false)

Par defaut, le reglage est "true" c'est à dire que le choix est ecrit en couleur normal.
Si on indique un index ( la position dans le tableau "commands", ici 12, le dernier choix ) et un reglage "false", ce choix sera ecrit en couleur semi transparente.
( Choix impossible en langague RPG ... )
Bah, oui, on ira se coucher quand on aura tout testé, pas avant !!
On ne va pas jouer avec la fenetre de choix, il nous faut donc une autre fenetre qu'on affichera derriere.

Code:

class Window_Test < Window_Base
  def initialize
    super(0, 0, 544, 416)
    @action = nil
    refresh
  end
 
  def set_action(num)
    @action = num
    refresh
  end

  def refresh
    case @action
    when 0 # "Coller un Bitmap"
    when 1 # "Coller un Bitmap deformé"
    when 2 # "Rectangle de couleur uni"
    when 3 # "Rectangle avec degradé de couleur"
    when 4 # "Colorier un pixel"
    when 5 # "Controler la couleur d'un pixel"
    when 6 # "Changer la teinte du Bitmap"
    when 7 # "Effet flou"
    when 8 # "Effet flou circulaire"
    when 9 # "Ecrire"
    when 10 # "Controler la taille d'une String"
    when 11 # "Nettoyer le Bitmap"
      self.contents.clear
    end
  end
end

Là, il n'y a rien de nouveau ...
Avant de completer les differentes actions, on va d'abord finir la scene, histoire de pouvoir tester au fur et à mesure.

Code:

class Scene_Test < Scene_Base
 
  def start
    @controle = []
    @compteur = -1
    s1 = "Coller un Bitmap"
    s2 = "Coller un Bitmap deformé"
    s3 = "Rectangle de couleur uni"
    s4 = "Rectangle avec degradé de couleur"
    s5 = "Colorier un pixel"
    s6 = "Controler la couleur d'un pixel"
    s7 = "Changer la teinte du Bitmap"
    s8 = "Effet flou"
    s9 = "Effet flou circulaire"
    s10 = "Ecrire"
    s11 = "Controler la taille d'une String"
    s12 = "Nettoyer le Bitmap"
    s13 = "Bah, aller se coucher ..."
    @choix = Window_Command.new(350, [s1,s2,s3,s4,s5,s6,s7,s8,s9,s10,s11,s12,s13], 1, 5)
    @choix.x = (544/2) - (350/2)
    @choix.y = (416/2) - ((5 * 24 + 32) / 2)
    @choix.z = 50
    @choix.draw_item(12, false)
    @window = Window_Test.new
    @window.z = 10
  end
 
  def terminate
    @choix.dispose
    @window.dispose
  end
 
  def update
    if @controle.size == 12
      @choix.draw_item(12, true)
    end
    @choix.update
    if @compteur > 0
      @compteur -= 1
      return
    elsif @compteur == 0
      @choix.active = true
      @choix.visible = true
      @compteur = -1
      return
    end
    if Input.trigger?(Input::B)
      Sound.play_cancel
      $scene = Scene_Map.new
    elsif Input.trigger?(Input::C)
      if @choix.index == 12
        if @controle.size == 12
          Sound.play_decision
          $scene = Scene_Map.new
        else
          Sound.play_buzzer
        end
      else
        Sound.play_decision
        @choix.visible = false
        @choix.active = false
        unless @controle.include?(@choix.index)
          @controle.push(@choix.index)
        end
        @compteur = 80
        @window.set_action(@choix.index)
      end
    end
  end
 
end

Quant on choisit une option, la fenetre de choix disparait durant 80 frames pour nous permettre de voir l'effet du choix.
L'option finale ne devient valable que si on a déjà utilisé au moins une fois les autres choix.
La variable "@action" de Window_Test nous indiquera quoi faire.
Le "refresh" fera le reste.
Le "refresh" est appellé dans la methode "set_action".
J'aurais certe pu l'appelé dans l'update de ma scene, il aurait tout aussi bien réagi au changement de valeur de "@action".
Mais ainsi, la methode aurait été appellé à chaques frames.
Donc, le Bitmap aurait été modifié à chaque frames, ce qui entraine un gros risque de lag.
( Surtout que certaines options ici representé sont plutôt gourmande en fps alors utilisé à chaque frames ... )
C'est quelque chose qui doit etre present dans votre esprit, surtout si vous utilisez une fenetre qui doit etre souvent mise à jour.
L'idéal, c'est de n'appeller la methode "refresh" que si effectivement, il y a un changement à faire.
C'est le cas ici ainsi placé dans la methode "set_action".
Si vous constaté une chute importante des fps, essayez d'optimiser au maximum vos mises à jour !!

Vous avez sans doute remarqué ces lignes :

Code:

      @choix.active = true
      @choix.visible = true
#
        @choix.visible = false
        @choix.active = false

Une fenetre peut etre créé mais n'est pas forcement active ou visible.
A vous de voir si dans votre scene, il vaut mieux avoir la fenetre mais masqué ou si vous ne la créé qu'au moment de l'utiliser.
Dans Scene_Battle, par exemple, le HUD et la liste de commande est masqué au besoin.
Par contre, les fenetres de choix d'objets, de competences ne sont créées qu'au moment d'etre utilisées et supprimées une fois que vous validez.

Bon, en théorie, je pourrais vous laissez vous debrouiller seul pour le reste.
La structure globale est fonctionnelle, il ne reste qu'a completer le "refresh" avec chaque action.
Chose que vous pouvez aisement faire en regardant dans le manuel !!
Mais bon, c'est un cours, donc continuons ensemble !!
( Les plus téméraires d'entre vous peuvent essayer seul, quitte à venir voir ici en cas de probleme !! )

On va commencer par ce que vous attendez tous depuis le debut du cours, "Ecrire" !!
Et c'est aussi la methode que vous utiliserez le plus souvent ...

Code:

bitmap.draw_text(x, y, w, h, text, align)

Les quatres premiers parametres, on les connait par coeur maintenant !!
x et y sont les coordonnées d'affichage.
w et h sont la largeur et la hauteur de la zone de texte.
Si w ou h ne sont pas suffisament elevé pour le texte à afficher, celui ci sera automatiquement reduit.
( Afficher "Anticonstitutionnellement" dans une zone de 5/5 pixels n'est pas une bonne idée ... )
"text" est une String ou sinon ça sera converti ( to_s ).
"align" designe l'alignement horizontale sous forme d'Integer.
0 => Gauche ( par defaut si rien n'est indiqué ).
1 => Centré.
2 => Droite.

Sur le principe, vous n'avez pas besoin d'autre chose pour ecrire du texte.
Mais il y a des bonus !!
Un objet de la classe Font ( Police ) est associé à votre Bitmap.
Vous pouvez donc choisir avec quelle police sera ecrit votre texte.
Vous pouvez aussi choisir la couleur, si c'est ecrit en gras, en italique, et si vous voulez utiliser l'ombre.

A rajouter dans le "refresh" :

Code:

    when 9 # "Ecrire"
      text = "Ceci est un texte de test !!"
      ecrire(new_rect, text)

Et aussi, on rajoute nos nouvelles methodes :

Code:

  def ecrire(rect, text)
    self.contents.font.name = ["Verdana", "Arial", "Courier New"][rand(3)]
    self.contents.font.size = (rand(20) + 10)
    self.contents.font.bold = (rand(2) == 1)
    self.contents.font.italic = (rand(2) == 1)
    self.contents.font.shadow = (rand(2) == 1)
    self.contents.font.color = new_color
    self.contents.draw_text(rect, text, rand(3))
  end
 
  def new_color
    return Color.new(rand(255), rand(255), rand(255))
  end
 
  def new_rect
    w = rand(self.width)
    h = rand(self.height)
    x = rand(self.width - w)
    y = rand(self.height - h)
    return Rect.new(x, y, w, h)
  end

Si j'utilise cette organisation particuliere, c'est pas ce que je compte bien réutiliser ces methodes dans d'autres circonstances ...
Vous remarquez une nouvelle classe "Rect", qui crée un rectangle.
Ca remplace ici les quatres premiers parametres.

Tant qu'on est dans le texte, continuons avec l'option N° 10.

Code:

    when 10 # "Controler la taille d'une String"
      text = ""
      (rand(11)).times do
        text += (rand(256).chr)
      end
      w = self.contents.text_size(text).width
      new_text = "#{text} mesure #{w} pixels de large !!"
      ecrire(new_rect, new_text)

Code:

bitmap.text_size(string)

Cette methode retourne un Rect aux dimensions de la string passé en parametre.
Dans la pratique, il n'y a guere que la largeur qui nous interesse ... mais c'est utile vu ce qu'on sait de "draw_text".

Continuons avec les options N° 4 et 5 :

Code:

    when 4 # "Colorier un pixel"
      x = rand(544)
      y = rand(416)
      self.contents.set_pixel(x, y, new_color)
    when 5 # "Controler la couleur d'un pixel"
      x = rand(544)
      y = rand(416)
      color = self.contents.get_pixel(x, y)
      r = color.red
      v = color.green
      b = color.blue
      text = "La couleur du pixel X = #{x} / Y = #{y} est R = #{r} / V = #{v} / B = #{b}"
      self.contents.draw_text(0, rand(self.height - 24), self.width, 24, text, 1)

"set_pixel", on connait déjà mais c'est toujours bien de revoir.
"get_pixel" par contre, c'est nouveau.
Cette methode renvoi un objet de la classe Color.
Voyez comment on peut recuperer la valeur propre aux trois couleurs RVB ( RGB ).

Dans les methodes que l'on utilise souvent, il reste les options N° 2 et 3 :

Code:

    when 2 # "Rectangle de couleur uni"
      self.contents.fill_rect(new_rect, new_color)
    when 3 # "Rectangle avec degradé de couleur"
      flag = (rand(3) == 1)
      self.contents.gradient_fill_rect(new_rect, new_color, new_color, flag)

"fill_rect" dessine un rectangle de couleur uni.
"gradient_fill_rect" dessine un degradé de couleur, de la couleur N° 1, à la couleur N° 2.
Le flag indique si le degradé est horizontale ( false, par defaut ) ou verticale ( true ).
A l'instar de "draw_text", vous pouvez utliser un Rect ou les quatres parametres classique, au choix.

Les options N° 6, 7, 8 sont egalement tres simple à utiliser :

Code:

    when 6 # "Changer la teinte du Bitmap"
      self.contents.hue_change(rand(361))
    when 7 # "Effet flou"
      self.contents.blur
    when 8 # "Effet flou circulaire"
      self.contents.radial_blur(rand(360), (rand(199) + 2)) 

Le changement de teinte ne se verra pas si "contents" est vide.
Testez d'autres options avant d'essayer celle là.
Le parametre est compris entre 0 et 360.
Dans l'onglet "Monstres" de la BDD, il est possible de modifier la teinte des battlers, ici, c'est le même principe.
"blur" et "radial_blur" sont des effets que vous connaissez déjà, ils sont utilisés pour créer le fond en combats.
Pour "radial_blur", les parametres sont :
- l'angle de modification ( de 0 à 360 ).
- l'impact de l'effet ( de 2 à 200 ).

Ouf, nous y sommes presque, voici les deux dernieres options :

Code:

    when 0 # "Coller un Bitmap"
      bitmap = Cache.character("People#{(rand(5) + 1)}")
      w = rand(bitmap.width)
      h = rand(bitmap.height)
      x = rand(bitmap.width - w)
      y = rand(bitmap.height - h)
      rect = Rect.new(x, y, w, h)
      opacity = rand(256)
      px = rand(self.width - w)
      py = rand(self.height - h)
      self.contents.blt(px, py, bitmap, rect, opacity)
    when 1 # "Coller un Bitmap deformé"
      bitmap = Cache.character("People#{(rand(5) + 1)}")
      w = rand(bitmap.width)
      h = rand(bitmap.height)
      x = rand(bitmap.width - w)
      y = rand(bitmap.height - h)
      src_rect = Rect.new(x, y, w, h)
      opacity = rand(256)
      pw = rand(self.width)
      ph = rand(self.height)
      px = rand(self.width - pw)
      py = rand(self.height - ph)
      dest_rect = Rect.new(px, py, pw, ph)
      self.contents.stretch_blt(dest_rect, bitmap, src_rect, opacity)

Code:

bitmap.blt(x, y, new_bitmap, rect, opacity)

Cette methode permet de coller un bitmap sur un autre bitmap.
Bien evidement, vous pouvez "jouer" avec le nouveau bitmap avant de le coller sur l'autre.
Les deux premiers parametres sont simple à comprendre, il s'agit des coordonnées X / Y d'affichage du nouveau bitmap.
"new_bitmap", comme ça le suggere, c'est le nouveau bitmap.
Le Rect suivant s'applique au nouveau bitmap.
Il sert à determiner quelle partie du nouveau bitmap on utilise.
( Ca peut etre le bitmap en entier, ou juste une partie par exemple un carré de 32 pixels si vous voyez de quoi je parle ... )
Et "opacity", c'est la transparence du nouveau bitmap.

Code:

bitmap.stretch_blt(rect_deformé, new_bitmap, rect_origine, opacity)

Cette methode ressemble beaucoup à la precedente, mais, elle "etire" le nouveau bitmap.
"rect_origine" sert à prendre une portion du nouveau bitmap.
"rect_deformé" comme le suggere le nom que je lui donne, va etirer "rect_origine" vers une nouvelle proportion.

Ces deux options sont simple à utiliser en réalité.
Ne vous laissez pas tromper par mon code qui n'a d'autre but qu'offrir quelque chose de visuel.

Je vous donne le code de la scene, dans son integralité :

Spoiler:

Vous connaissez maintenant l'essentiel des methodes à utiliser avec les bitmap.
Le reste n'est que pratique, pratique et aussi une bonne dose de pratique.
Ah, et de la pratique en plus ...

Avant de vous laisser entre les mains experte d'Hikari et de ses questionnaires, il me reste des trucs à vous dire.

Si jamais vous devez utiliser une valeur de la base de donnée, vous avez besoin de deux choses :
- Le module RPG qui est detaillé dans le manuel.
- Et ceci :

Code:

  def load_database
    $data_actors        = load_data("Data/Actors.rvdata")
    $data_classes      = load_data("Data/Classes.rvdata")
    $data_skills        = load_data("Data/Skills.rvdata")
    $data_items        = load_data("Data/Items.rvdata")
    $data_weapons      = load_data("Data/Weapons.rvdata")
    $data_armors        = load_data("Data/Armors.rvdata")
    $data_enemies      = load_data("Data/Enemies.rvdata")
    $data_troops        = load_data("Data/Troops.rvdata")
    $data_states        = load_data("Data/States.rvdata")
    $data_animations    = load_data("Data/Animations.rvdata")
    $data_common_events = load_data("Data/CommonEvents.rvdata")
    $data_system        = load_data("Data/System.rvdata")
    $data_areas        = load_data("Data/Areas.rvdata")
  end

Chaque onglet de la BDD est regroupé dans une variable globale.
Vous pouvez donc acceder aux données de la BDD par leurs intermediaires.

Quel est le prix de l'objet d'ID 18 :

Citation :

$data_items[18].price

Combien de temps dure l'animation d'ID 37 :

Citation :

$data_animations[37].frame_max

Derniere chose :
Window_Base offre de nombreuses methodes tres pratique que nous n'avons pas etudiés.
Jetez y un oeil à l'occasion !!

ASHKA

Merci ASHKA pour le cours. Ça me déleste un peu... Mais attends toi à des commentaires du genre «C'est trop long»... Mais ce n'est pas grave. Je donne mon accord sur le contenue du cours, c'est moi qui l'a demandé ainsi. Tu as fait du bon boulot. Merci encore.

Voici les question pour le TP #5

1. Dans vos mots, à quoi sert la méthode (4pts)
a) start
b) terminate
c) update
d) initialize

2. En allant chercher dans les scripts, de quelle classe hérite la classe (3pts)
a) Window_Item
b) Scene_Skill
c) Game_Actor
d) Game_Vehicle
e) Sprite_Battler
f) Scene_Base

3. Faites un affichage comprenant la scene et la fenêtre pour afficher un choix multiple concernant des actions devant un gros cailloux (pousser, faire exploser, laisser sur place) (6 pts)

4. Faite une fenêtre qui affiche le portrait des joueurs de l'équipe (7pts)

Bonne chance à tous.

Enfin les commentaires du genre "C'est trop long" il suffira de leur répondre, si vous voulez apprendre un langage de programmation sans un minimum d'effort c'est même pas la peine d'essayer c'est tout :p

Je me lance dans les exos du 4, puis le 5 ^^ Je verrait pour l'examen :p

C'est long ><
Bon bah après que Blockade et Hikari on dit que sa devait être... C'est que doit être long ^^'
Donc je tiens à vous dire à tous que je ferrais pas tout de suite les exo ^^'
Faut d'abord que j'arrive à tout lire...
Et que je m'entraine !

C'est long parce que c'est le premier cours sur le RGSS2 et que je suis obligé d'abord plusieurs themes pour vous permettre de rentrer dedans.

Le cours est donc divisé en plusieurs partie :
- Une partie explicative pour vous permettre de comprendre la base du fonctionnement de RMVX.
- Une partie definition de terme car vous ne connaissait pas la "terminologie" RGSS.
( C'est utile car si je parle de Bitmap, il faut que vous visualisez la même chose que moi ).
- Une partie théorique sur les scenes et les windows.
- Et enfin, la plus grosse partie, une scene construite pas à pas qui vous permettra d'essayer TOUTES les fonctions de base des Bitmap donc des fenetres.
Cette partie est tres importante car elle offre beaucoup de théorie mais surtout c'est votre premiere experience pratique en RGSS2.
Il fallait vous "guider" pas à pas.

ASHKA

Je ne trouve pas que c'est long, car c'est intéressant. Si tu trouves un bouquin intéressant de 1000 pages, tu vas le lire du début à la fin, et tu ne l'auras pas trouvé long.

Bref, très bon cours comme d'habitude ASHKA,j'attend la suite avec envie.

Nan mais je rigoler quand je disais que c'été long !
Par contre ce code ne marche pas...

Code:

class Scene_Test < Scene_Base
 
  def start
    tab = ["Rectangle", "Dégradé", "Texte"]
    @fenetre = Window_Command.new(150, tab, 1, 3)   
    @fenetre.x = (544/2) - (350/2)
    @fenetre.y = (416/2) - ((5 * 24 + 32) / 2)
  end
 
  def terminate
    @fenetre.dispose   
  end
 
  def update
    @fenetre.update
    if Input.trigger?(Input::C)
      Sound.play_decision
    elsif Input.trigger?(Input::B)
      Sound.play_cancel
      $scene = Scene_Map.new
    end
  end
 
end
########################################
class Notre_Window < Window_Base
 
  def initialize
    self.contents.blur
    @action = 0
    refresh 
  end
 
  def set_action(num)
    @action = num
    refresh
  end
   
  def refresh
    case @action
    when 0
      self.contents.fill_rect([rand(255), rand(255), 32, 64], [126, 212, 025])
    when 1
      flag = (rand(3) == 1)
      self.contents.gradient_fill_rect([rand(255), rand(255), 32, 64], [178, 21, 147], [25, 156, 85], flag)     
    when 2
      text = "Option super méga cool !"
      bitmap.draw_text(32, 32, 250, 50, text, 2)
    end
  end 
 
end

Des que choisi n'importe quelle option, la commande que j'ai mit dans le when du window ne s'effectue pas... Aurais-je oublé quelque chose ?

Dans la scène tu n'as pas créer de fenêtre Notre_windows et dans
if Input:c tu n'as pas mis qu'il affiche la fenêtre
si tu veux je le corrige et je te montres comment tu devrais faire

Oui je veux bien que tu me montre...
Est ce que tu pourrais juste un mettre un commentaire à côté de là ou tu as rajouté pour que je fasse plus attention la prochaine fois !

Merci ^^

Je vais peut être dire une connerie mais j'aurais fait ça

Code:

class Scene_Test < Scene_Base
 
  def start
    @test_window = Notre_Window.new            # Création de l'objet
    tab = ["Rectangle", "Dégradé", "Texte"]
    @fenetre = Window_Command.new(150, tab, 1, 3) 
    @fenetre.x = (544/2) - (350/2)
    @fenetre.y = (416/2) - ((5 * 24 + 32) / 2)
  end
 
  def terminate
    @fenetre.dispose
    @test_window.dispose        # Destruction de l'objet 
  end
 
  def update
    @fenetre.update
    if Input.trigger?(Input::C)
      @test_window.set_action(@tab.index)   
#si entrée appuyée, on appelle la méthode set_action de notre objet,en passant l'index de notre tableau
# set_action pour te rappeler appelle refresh qui effectuera tes case
      Sound.play_decision
    elsif Input.trigger?(Input::B)
      Sound.play_cancel
      $scene = Scene_Map.new
    end
  end
 
end
########################################
class Notre_Window < Window_Base
 
  def initialize
    self.contents.blur
    @action = 0
    refresh
  end
 
  def set_action(num)
    @action = num
    refresh
  end
 
  def refresh
    self.contents.clear               
    case @action
    when 0
      self.contents.fill_rect([rand(255), rand(255), 32, 64], [126, 212, 025])
    when 1
      flag = (rand(3) == 1)
      self.contents.gradient_fill_rect([rand(255), rand(255), 32, 64], [178, 21, 147], [25, 156, 85], flag)   
    when 2
      text = "Option super méga cool !"
      bitmap.draw_text(32, 32, 250, 50, text, 2)
    end
  end
 
end

Voilà, désolé si c'est pas ça,mais je suis comme toi,j'apprends

ouais c'est ça mais t'as oublié de disposer test_windows
je crois aussi que dans le refresh tu aurais du mettre self.contents.clear
pour ne pas avoir plusieurs texte qui se superpose

Edit: désolé j'avais pas vu que t'a disposer test_windows

Edit: il manque aussi super dans la création de ta fenetre

ASHKA, il y a plein d'autres modules ^^
Class, GC, Kernel, Object, Math... mais la je chipotte

il aurait peut etre fallu que tu développes un peu plus le super et le bmp contents !
mais ton tuto est vraiment très claire et bien construit !
Bravo !
(ca me donne une petite idée...)


berka

J'étais en train d'éditer quand tu as posté

Edit : exact je l'avais oublié celui là, ne l'oublie pas car sinon ça va se ré écrire par dessus.

La Meche : Il ne suffit de copier-coller-modifier un script, il faut aussi essayer de le comprendre !!

Petit exemple :

Code:

    @fenetre = Window_Command.new(150, tab, 1, 3)

Dans ce cas, les deux derniers parametres sont inutiles, le reglage par defaut donne le même resultat.

Code:

    @fenetre.x = (544/2) - (350/2)
    @fenetre.y = (416/2) - ((5 * 24 + 32) / 2)

J'utilise cette "formule" pour centrer ma fenetre.
Ici, la largeur de ta fenetre est 150 et non pas 350.
Tu as trois lignes et non pas 5.
Est-ce que tu as essayé de comprendr ele code avant de le reproduire ?

Code:

self.contents.fill_rect([rand(255), rand(255), 32, 64], [126, 212, 025])

"fill_rect" attends comme parametre un objet de la classe Rect et un de la classe Color, tu lui passe deux Array ...

Code:

self.contents.gradient_fill_rect([rand(255), rand(255), 32, 64], [178, 21, 147], [25, 156, 85], flag)

"gradient_fill_rect" attends un Rect, deux Color et un booléen.
Toi, tu lui passe trois Array et un booléen.

Dans l'initialize de ta Window,il n'y a pas de "super", donc comment est-ce que tout va se créer ?
C'est l'initialize de "Window_Base" et de "Window" qui fait ça normalement, mais là, il ne pourra pas vu que tu ne l'appelle pas.
Où va-elle' s'afficher ?
Quelle sera sa taille ?

S'il y a quelque chose que tu ne comprends pas, dis le, je suis pres à t'expliquer en detail.
Mais comme ça, tu n'arrivera à rien d'autre qu'a te decourager !!

ASHKA

Houlà,ben j'ai encore des choses à apprendre moi. Le coup de "super",je suis c** je le sais en plus

@berka : Pour les modules, je voulais dire ceux du RGSS2.
Le Ruby, c'est Hikari !!

Par contre, tu as raison sur un point et le post de La Meche en est le meilleur exemple, il faut que je retravaille la partie que tu mentionne ...

ASHKA

au fait Ashka je ne comprends pas comment fonctionne fill_rect et gradient_fill_rect
lorsque je met 2 tableau en paramètres il m'affiche une erreur me disant qu'il
en faut 5

Citation :

"fill_rect" attends comme parametre un objet de la classe Rect et un de la classe Color

Citation :

"gradient_fill_rect" attends un Rect, deux Color et un booléen.

Tu as fait les mêmes erreurs que La Meche apparament

Comme je l'ai dit juste au dessus, les parametres du script de La Meche ne sont pas bon.

Il ne faut pas passer un tableau mais un objet particulier au RGSS2, un Rect.

Au lieu de faire [0, 0, 150, 50], tu peux faire deux choses :

Code:

self.contents.fill_rect(0, 0, 150, 50, normal_color)
# ou
rect = Rect.new(0, 0, 150, 50)
self.contents.fill_rect(rect, normal_color)

Soit un Rect, soit des Integer, mais pas d'Array.

Même chose avec les couleurs, il lui faut un ( ou deux pour "gradient_fill_rect" ) objet de la classe Color.

Donc, au lieu de faire [150, 58, 96], tu doit faire :

Code:

self.contents.fill_rect(rect, Color.new(150, 58, 96))
# ou
color = Color.new(150, 58, 96)
self.contents.fill_rect(rect, color)

ASHKA

Nouvelle question !
Quel est la commande qui permet de définir la face d'un hero ?
(C'est pour l'exo 4 !)

Merci de vos futur réponse !

Petit extrait de Game_Actor :

Code:

  #--------------------------------------------------------------------------
  # * Change Graphics
  #    character_name  : new character graphic filename
  #    character_index : new character graphic index
  #    face_name      : new face graphic filename
  #    face_index      : new face graphic index
  #--------------------------------------------------------------------------
  def set_graphic(character_name, character_index, face_name, face_index)
    @character_name = character_name
    @character_index = character_index
    @face_name = face_name
    @face_index = face_index
  end

Et pour l'utiliser :

Code:

$game_actors[ID].set_graphic( ... )

ASHKA

c'est plus facile d'utiliser

Code:

draw_actor_face($game_party.members[i],x,y)

au fait ne peut on pas utiliser des images à la place
du texte dans windows_command