Na aula anterior vimos a estrutura básica de uma Scene. Se você foi curioso, com certeza já deu uma olhada nas Scenes dos seus projetos, e viu como é simples seu funcionamento. Porém para entendermos realmente como uma Scene funciona e se comporta em determinadas situações, vamos criar um menu personalizado, tranformando este menu:




Num menu diferenciado, para um único herói e com funcionamento integrado com o Sistema Squad Based Action System, Assim:



Eu postarei aqui um projeto com o Menu e com o sistema já em funcionamento. Vamos lá:

Primeiramente, crie um novo projeto, ou use o projeto de testes (aquele antigo). Abra o Editor de Scripts. Vá na área de sessões de Scenes, selecione a sessão Scene_Menu, copie-a e cole novamente antes do main. Remoneie-a para New_Menu. Esta será nossa base. Vamos criar, alterar e excluir código desta classe. Podíamos construir um menu do zero, mas levaríamos o triplo do tempo.

Os tipos principais de janelas de um menu:

Menus são baseados em dois tipos de janelas, as de Visualização, que são classes filhas de Window_Base, e as janelas de seleção, que é uma classe complementar chamada Window_Selectable. A janela de comandos do menu, é uma classe especial, chamada Window_Command, filha direta de W_selectable, que permite a criação rápida de um objeto de seleção de itens. Estas classes, além de controlarem o cursor (Veja o apêndice sobre a classe Window) geram um número de indexação, ou seja, A posição do cursor na janela. Vamos à nossa Scene. Observe este código:

Código:

s1 = $data_system.words.item
    s2 = $data_system.words.skill
    s3 = $data_system.words.equip
    s4 = "Status"
    s5 = "Salvar"
    s6 = "Fim de Jogo"
    @command_window = Window_Command.new(160, [s1, s2, s3, s4, s5, s6])
    @command_window.index = @menu_index

Veja que declaramos 6 vars, cada uma com um texto diferente, e depois criamos um array na definição da classe. Se você for até a sessão da Window_Command e observar seu funcionamento, vai entender que ela é pré-fabricada para isso. Você define a sua largura( o 160 do início ) e sua altura será definida pela quantidade de itens que você declarou. Quer ver isso acontecer? Remova o item Status da declaração. Não é necessário apagar a declaração dele, apenas na definição da classe, assim:

@command_window = Window_Command.new(160, [s1, s2, s3, s5, s6]). Rode o game. O menu ficou assim:



Se você tentar usar os dois ultimos itens do menu, vai ver que eles chamam Scenes diferentes da do seu nome. PORQUE ?? Não mantemos os números da forma como estavam? Apenas apagamos um item?

Por causa da Indexação. Para a W_Command, não importao que está escrito no item, mas sim a sua posição na hierarquia. De cima para baixo, conte os itens como 0(zero), 1,2...

Não se preocupe com isso agora, vamos "consertar" isso depois. Acho que já deu pra entender um pouco sobre a indexação. Ela será importante toda vez que você quiser criar um objeto de seleção, seja ele um simples W_Command ou uma seleção de heróis como esta:





Voltemos ao nosso Menu. Olhe a imagem final do novo menu. Ela possui alguns complementos, como barras de HP/SP, e o char do herói está dobrado de tamanho. No nosso exercício, ele também tem movimento, a animação dele andando é constante naquela janela. Observe que continuamos a usar as janelas de dinheiro,Passos e Tempo. porém com pequenas modificações. Uma coisa muito importante sobre janelas, que talvez você ainda não saiba, é que elas devem respeitar uma medida padrão, a de 32 pixels quadrados. Se vc dividir 640/32 = 20 e 480/32 = 15. Agora você sabe porque os mapas mínimos tem 20/15 quadros... ;D. então na hora de mudar o tamanho de uma janela, tente respeitar estas medidas.


** Edit: "Você não é obrigado a respeitar as medidas, elas existem para manter a beleza das janelas. Para manter a divisão exata e não ficar nem sobrando nem faltando espaços nos seus menus. Mas a decisão é sua."


Se for aumentar ou diminuir seus tamanhos, tente sempre aumentar ou diminuir de 32 em 32 pixels, para que sua janela esteja sempre bonitinha. Mas aonde eu mecho nisso??

Na 3º aula, quando fizemos nossa primeira janela, declaramos a seguinte linha no initialize da janela:

super(0, 0, 160, 64)

onde os valores são respectivamente x, y, Largura e Altura. Como já falamos sobre janelas e tem uma apêndice enorme pra ser lida, a alteração das janelas de Tempo, passos e dinheiro ficará por sua conta. Tente fazer e, só se não conseguir, copie os códigos abaixo:

Código:

class Window_PlayTime < Window_Base
  def initialize
    super(0, 0, 160, 64)
    self.contents = Bitmap.new(width - 32, height - 32)
        self.contents.font.name = $fontface
    self.contents.font.size = $fontsize
    refresh
  end
  def refresh
    self.contents.clear
    @total_sec = Graphics.frame_count / Graphics.frame_rate
    hour = @total_sec / 60 / 60
    min = @total_sec / 60 % 60
    sec = @total_sec % 60
    text = sprintf("%02d:%02d:%02d", hour, min, sec)
    self.contents.font.color = normal_color
    self.contents.draw_text(4, 4, 120, 24, text, 1)
  end
  def update
    super
    if Graphics.frame_count / Graphics.frame_rate != @total_sec
      refresh
    end
  end
end

Código:

class Window_Steps < Window_Base
  def initialize
    super(0, 0, 160, 64)
    self.contents = Bitmap.new(width - 32, height - 32)
        self.contents.font.name = $fontface
    self.contents.font.size = $fontsize
    refresh
  end
  def refresh
    self.contents.clear
    self.contents.font.color = system_color
    self.contents.draw_text(4, 0, 120, 32, "Passos")
    self.contents.font.color = normal_color
    self.contents.draw_text(4, 0, 120, 32, $game_party.steps.to_s, 2)
  end
end

Código:

class Window_Gold < Window_Base
  def initialize
    super(0, 0, 160, 64)
    self.contents = Bitmap.new(width - 32, height - 32)
        self.contents.font.name = $fontface
    self.contents.font.size = $fontsize
    refresh
  end
  def refresh
    self.contents.clear
    cx = contents.text_size($data_system.words.gold).width
    self.contents.font.color = normal_color
    self.contents.draw_text(4, 0, 120-cx-2, 32, $game_party.gold.to_s, 2)
    self.contents.font.color = system_color
    self.contents.draw_text(124-cx, 0, cx, 32, $data_system.words.gold, 2)
  end
end

Feito isso, nossa janela está assim:



Até aqui, com certeza você já se cansou. Eu ainda não, mas se eu continuar, talvez você não entenda bem o que está acontecendo e possa não "Querer" fazer isso. Faça tudo que foi dito, experimente, tente, poste dúvidas. A única coisa que eu quero é que continuem da forma como estão na imagem, para que possamos concluir o menu.

Na próxima aula, o Script de HP/SP e a janela de Status com o movimento do herói. Nosso menu vai ganhar mais vida !!

Até lá !