RGSS3 - Aula 7: Making of - Script de Tela de Titulo

[Brandt]

[box class=titlebg]RGSS3 - Aula 7: Making of - Script de Tela de Título[/box]

por Masked

[box class=titlebg]Introdução[/box]

Oi gente, bom, eu fiz essa aula porque muita gente está dizendo que tem o conhecimento necessário, já sabe dos comandos, já sabe das variáveis, métodos, classes... Mas não sabe como fazer um script.

Para quem estiver com essa dúvida, recomendo muito que leia essa aula.

Ah, e desculpem a demora para editar uma versão para a CRM, é um pouco trabalhoso converter as boxes.

[box class=titlebg]Índice[/box]

- Script de Tela de Título
     - Introdução
     - Base
     - Métodos
     - Variáveis
     - Configurações
     - Processo Principal
     - Finalização

[box class=titlebg]Script de tela de título[/box]

[box class=titlebg]Introdução

Bom, primeiro, vamos pensar em como será nosso script, geralmente, o pessoal gosta de coisas customizáveis, certo? Então podemos fazer ele customizável!

E não se preocupem, fazê-lo customizável não é tão mais difícil, vocês vão ver.

Agora, vamos pensar, vamos usar imagens ou texto? Eu vou fazer por imagens, mas fica como desafio fazer ele por texto ou com opção de usar ambos.

[box class=titlebg]Base[/box]

Essa é a parte inicial do script, primeiro de tudo temos que criar as classes e módulos que o script usará, pois é dentro deles que ficam os outros objetos.

Então, vejamos, como é um script de tela de título, usaremos a classe 'Scene_Title', e como ele será configurável, criaremos um módulo de configuração, então, ficará assim:

module RGSS3_Title_Config



end

class Scene_Title < Scene_Base



end

Como devem ter visto, a classe 'Scene_Title' foi declarada sub-classe de 'Scene_Base', que é sua super-classe original, como podem conferir na linha 7 do script no RTP.
Lembre-se de sempre conferir esse tipo de coisa, não especificar a super-classe de um script que originalmente tem uma pode causar erros.

Bom, agora, vamos adicionar comentários para melhor entendimento do código:

#==============================================================================
# RGSS3 - Aula 7: Script de Tela de Título
#
# O script modifica a tela de título do rpg maker, ele é customizável, é
# possível escolher onde ficará cada coisa. Outra característica desse script
# é que ele usa imagens para os botões de 'Novo Jogo', 'Continuar' e 'Sair', 
# além de permitir mais de 2 imagens de fundo, e de usar uma imagem para o 
# título do jogo.
#
#==============================================================================
#==============================================================================
# Configurações:
#==============================================================================
module RGSS3_Title_Config



end
#==============================================================================
# Fim das Configurações
#==============================================================================
#==============================================================================
# Scene_Title:
#==============================================================================
class Scene_Title < Scene_Base



end
#==============================================================================
# Fim do Script
#==============================================================================

Os comentários são parte muito importante  dos scripts, principalmente se o script inclui algum tipo de configuração, eles facilitam no entendimento e ajudam muito na hora de fazer alguma edição.

[box class=titlebg]Métodos[/box]

Agora já temos nossa classe e nosso módulo, agora, temos que criar os métodos, que constituirão o processo principal, eles serão: start, o método de inicialização, update, o método de atualização, terminate, o método de finalização, create_images, o método em que serão criadas a imagens, command_new_game (um método já existente, apenas vamos modificá-lo para não causar erros) que executa a função de criar um novo jogo, command_continue, que excuta a função de carregamento de um jogo, e command_shutdown, que executa a função de fechar a janela do jogo.

Então, fica assim:

#==============================================================================
# RGSS3 - Aula 7: Script de Tela de Título
#
# O script modifica a tela de título do rpg maker, ele é customizável, é
# possível escolher onde ficará cada coisa. Outra característica desse script
# é que ele usa imagens para os botões de 'Novo Jogo', 'Continuar' e 'Sair', 
# além de permitir mais de 2 imagens de fundo, e de usar uma imagem para o 
# título do jogo.
#
#==============================================================================
#==============================================================================
# Configurações:
#==============================================================================
module RGSS3_Title_Config



end
#==============================================================================
# Fim das Configurações
#==============================================================================
#==============================================================================
# Scene_Title:
#==============================================================================
class Scene_Title < Scene_Base

#==============================================================================
# * start:
#
# Esse é o método inicial do script, onde são criadas as variáveis e chamados 
# os métodos de criação
#
#==============================================================================
def start
  super
  
  
  
end

#==============================================================================
# * update:
#
# Esse é o método de atualização do script, ele roda indefinidamente enquanto a
# cena estiver ativa, nele são executados os processos de verificação das 
# teclas pressionadas.
#
#==============================================================================

def update
  super
  
  
  
end

#==============================================================================
# * create_images:
#
# Esse é o método de criação das imagens dos botões 'Novo Jogo', 'Continuar' e 
# 'Sair' e da imagem com o título do jogo.
#
#==============================================================================

def create_images
  
  
  
end

#==============================================================================
# * command_new_game:
#
# Esse é o método que executa as funções da criação de um novo jogo.
#
#==============================================================================

def command_new_game



end
  
#==============================================================================
# * command_continue:
#
# Esse é o método que executa o carregamento de um arquivo de jogo.
#
#==============================================================================

  def command_continue



end

#==============================================================================
# * command_shutdown:
#
# Esse é o método que fecha a janela do jogo.
#
#==============================================================================
  
  def command_shutdown



  end
#==============================================================================
# * terminate:
#
# Esse é o método de finalização do script, aqui as imagens serão apagadas.
#
#==============================================================================

def terminate
  super
  
  
  
end

end
#==============================================================================
# Fim do Script
#==============================================================================

Vocês devem ter percebido o 'super', que fica nos métodos start, update e terminate, esse super serve para chamar, junto do método atual, o método com mesmo nome da super-classe, ele obviamente só funciona no caso de a classe ter uma super-classe com um método de mesmo nome do método atualmente em uso.

Se um método não for definido e for chamado, ele chamará automaticamente o método de mesmo nome da super-classe.

[box class=titlebg]Variáveis[/box]

Agora, vamos criar as variáveis, elas serão: @background ([]), @ngame_button (Sprite.new), @continue_button (Sprite.new), @exit_button (Sprite.new), @title (Sprite.new) e @index (0), vamos criá-las no método de inicialização (start), assim elas existirão desde o começo do script e não teremos problemas com erros como 'undefinied method nome_do_metodo for nil:NilClass'

#==============================================================================
# RGSS3 - Aula 7: Script de Tela de Título
#
# O script modifica a tela de título do rpg maker, ele é customizável, é
# possível escolher onde ficará cada coisa. Outra característica desse script
# é que ele usa imagens para os botões de 'Novo Jogo', 'Continuar' e 'Sair', 
# além de permitir mais de 2 imagens de fundo, e de usar uma imagem para o 
# título do jogo.
#
#==============================================================================
#==============================================================================
# Configurações:
#==============================================================================
module RGSS3_Title_Config



end
#==============================================================================
# Fim das Configurações
#==============================================================================
#==============================================================================
# Scene_Title:
#==============================================================================
class Scene_Title < Scene_Base

#==============================================================================
# * start:
#
# Esse é o método inicial do script, onde são criadas as variáveis e chamados 
# os métodos de criação
#
#==============================================================================
def start
  super
  
  # Criação da array que guardará as imagens de fundo
  @background = []
  
  # Criação do Sprite dos botões, na ordem, de 'Novo Jogo', 'Continuar' e 
  # 'Sair'
  @ngame_button = Sprite.new

  @continue_button = Sprite.new
  
  @exit_button = Sprite.new
  
  # Criação do Sprite da imagem com o nome do jogo
  @title = Sprite.new

  # Criação da variável que guarda a posição do cursor, definindo qual botão
  # está selecionado no momento
  @index = 0  

end

#==============================================================================
# * update:
#
# Esse é o método de atualização do script, ele roda indefinidamente enquanto a
# cena estiver ativa, nele são executados os processos de verificação das 
# teclas pressionadas.
#
#==============================================================================

def update
  super
  
  
  
end

#==============================================================================
# * create_images:
#
# Esse é o método de criação das imagens dos botões 'Novo Jogo', 'Continuar' e 
# 'Sair' e da imagem com o título do jogo.
#
#==============================================================================

def create_images
  
  
  
end

#==============================================================================
# * terminate:
#
# Esse é o método de finalização do script, aqui as imagens serão apagadas.
#
#==============================================================================

def terminate
  super
  
  
  
end

end
#==============================================================================
# Fim do Script
#==============================================================================

Agora, veremos os tipos das variáveis e vou explicar para vocês, então, vamos lá, a variável @background é uma array, porque ela vai armazenar mais que um valor, como disse, poderão ser usadas mais de uma camadas na imagem de fundo.

As variáveis @ngame_button, @continue_button, @exit_button e @title são objetos da classe Sprite, que é a classe usada para criação de imagens na tela, além dela, podemos usar a classe Bitmap e a Plane, mas isso é outra história.

A variável @index é um Integer (número inteiro), e é usada para determinar qual o botão selecionado no memento.

[box class=titlebg]Configurações[/box]

Bom, antes de definirmos as posições e o gráfico das imagens, precisamos criar a parte das configurações, para isso, criaremos constantes, que são um tipo de variável que não pode ter seu valor alterado (quer dizer, no Ruby até pode, mas não é recomendado).

Elas serão BG_Images ([]), NGame_Images ([]), Continue_Images ([]), Exit_Images([]), Name_Image (" "), NGame_Positions ([]), Continue_Positions ([]), Exit_Positions ([]) e Name_Positions ([]). (Espero que tenham entendido a aula sobre arrays  :LOL:)

#==============================================================================
# RGSS3 - Aula 7: Script de Tela de Título
#
# O script modifica a tela de título do rpg maker, ele é customizável, é
# possível escolher onde ficará cada coisa. Outra característica desse script
# é que ele usa imagens para os botões de 'Novo Jogo', 'Continuar' e 'Sair', 
# além de permitir mais de 2 imagens de fundo, e de usar uma imagem para o 
# título do jogo.
#
#==============================================================================
#==============================================================================
# Configurações:
#==============================================================================
module RGSS3_Title_Config

# A lista dos nomes das imagens de fundo.
Background = ["Title_Background1", "Title_Background2"]

# Os nomes das imagens dos botões 'Novo Jogo', 'Continuar' e 'Sair', a primeira
# é do botão normal e a segunda é dele quando selecionado. As imagens devem 
# estar na pasta Graphics/Titles1
NGane_Images = ["Title_NewGame", "Title_NewGame_Selected"]

Continue_Images = ["Title_Continue", "Title_Continue_Selected"]

Exit_Images = ["Title_Exit", "Title_Exit_Selected"]

# Nome da imagem com o nome do jogo. A imagem deve estar na pasta 
# Graphics/Titles1
Name_Image = "Title_Name"

# As posições dos botões de 'Novo Jogo', 'Continuar' e 'Sair', o primeiro 
# número é a posição X (horizontal) e o segundo é a posição Y (vertical).
# Lembre-se que esta é a posição do canto superior esquerdo da imagem.
NGame_Positions = [100, 300]

Continue_Positions = [100, 375]

Exit_Positions = [100, 450]

# As posições da imagem com o nome do jogo. O primeiro número é a posição X 
# (horizontal) e o segundo é a posição Y (vertical). Lembre-se que esta é a 
# posição do canto superior esquerdo da imagem.
Name_Positions = [100, 75]

end
#==============================================================================
# Fim das Configurações
#==============================================================================
#==============================================================================
# Scene_Title:
#==============================================================================
class Scene_Title < Scene_Base

#==============================================================================
# * start:
#
# Esse é o método inicial do script, onde são criadas as variáveis e chamados 
# os métodos de criação
#
#==============================================================================
def start
  super
  
  # Criação da array que guardará as imagens de fundo
  @background = []
  
  # Criação do Sprite dos botões, na ordem, de 'Novo Jogo', 'Continuar' e 
  # 'Sair'
  @ngame_button = Sprite.new

  @continue_button = Sprite.new
  
  @exit_button = Sprite.new
  
  # Criação do Sprite da imagem com o nome do jogo
  @title = Sprite.new

  # Criação da variável que guarda a posição do cursor, definindo qual botão
  # está selecionado no momento
  @index = 0
  
end

#==============================================================================
# * update:
#
# Esse é o método de atualização do script, ele roda indefinidamente enquanto a
# cena estiver ativa, nele são executados os processos de verificação das 
# teclas pressionadas.
#
#==============================================================================

def update
  super
  
  
  
end

#==============================================================================
# * create_images:
#
# Esse é o método de criação das imagens dos botões 'Novo Jogo', 'Continuar' e 
# 'Sair' e da imagem com o título do jogo.
#
#==============================================================================

def create_images
  
  
  
end

#==============================================================================
# * terminate:
#
# Esse é o método de finalização do script, aqui as imagens serão apagadas.
#
#==============================================================================

def terminate
  super
  
  
  
end

end
#==============================================================================
# Fim do Script
#==============================================================================

Para mais informações, olhe nos comentários do script

[box class=titlebg]Processo Principal[/box]

Agora, faremos o script realmente funcionar, falta bem pouco, para isso, vamos fazer algumas coisas, por exemplo:

- Aplicar a posição e o gráfico dos botões, que será baseada nas configurações

- Criar as condições de tecla pressionada, para verificar se o jogador está mudando de botão e se está selecionando algum

- Criar as condições de verificação do botão atual, para aplicar o gráfico de selecionado nele.

Então, vamos lá:

#==============================================================================
# RGSS3 - Aula 7: Script de Tela de Título
#
# O script modifica a tela de título do rpg maker, ele é customizável, é
# possível escolher onde ficará cada coisa. Outra característica desse script
# é que ele usa imagens para os botões de 'Novo Jogo', 'Continuar' e 'Sair', 
# além de permitir mais de 2 imagens de fundo, e de usar uma imagem para o 
# título do jogo.
#
#==============================================================================
#==============================================================================
# Configurações:
#==============================================================================
module RGSS3_Title_Config

# A lista dos nomes das imagens de fundo. Elas devem estar na pasta Title1.
Background = ["Title_Background1", "Title_Background2", "Title_Background3"]

# Os nomes das imagens dos botões 'Novo Jogo', 'Continuar' e 'Sair', a primeira
# é do botão normal e a segunda é dele quando selecionado. As imagens devem 
# estar na pasta Graphics/Titles1
NGame_Images = ["Title_NewGame", "Title_NewGame_Selected"]

Continue_Images = ["Title_Continue", "Title_Continue_Selected"]

Exit_Images = ["Title_Exit", "Title_Exit_Selected"]

# Nome da imagem com o nome do jogo. A imagem deve estar na pasta 
# Graphics/Titles1
Name_Image = "Title_Name"

# As posições dos botões de 'Novo Jogo', 'Continuar' e 'Sair', o primeiro 
# número é a posição X (horizontal) e o segundo é a posição Y (vertical).
# Lembre-se que esta é a posição do canto superior esquerdo da imagem.
NGame_Positions = [170, 250]

Continue_Positions = [170, 290]

Exit_Positions = [170, 330]

# As posições da imagem com o nome do jogo. O primeiro número é a posição X 
# (horizontal) e o segundo é a posição Y (vertical). Lembre-se que esta é a 
# posição do canto superior esquerdo da imagem.
Name_Positions = [-30, 5]

end
#==============================================================================
# Fim das Configurações
#==============================================================================
#==============================================================================
# Scene_Title:
#==============================================================================
class Scene_Title < Scene_Base

#==============================================================================
# * start:
#
# Esse é o método inicial do script, onde são criadas as variáveis e chamados 
# os métodos de criação
#
#==============================================================================
def start
  super
  
  # Criação da array que guardará as imagens de fundo
  @background = []
  
  # Criação do Sprite dos botões, na ordem, de 'Novo Jogo', 'Continuar' e 
  # 'Sair'
  @ngame_button = Sprite.new

  @continue_button = Sprite.new
  
  @exit_button = Sprite.new
  
  # Criação do Sprite da imagem com o nome do jogo
  @title = Sprite.new
  
  # Criação da variável que guarda a posição do cursor, definindo qual botão
  # está selecionado no momento
  @index = 0
  
  # Chamando o método de criação das imagens, onde as posições e gráficos serão
  # aplicados nos Sprites criados
  create_images
  
  # Chamando o método que tocará a música definida para a tela de título
  play_title_music
  
end

#==============================================================================
# * update:
#
# Esse é o método de atualização do script, ele roda indefinidamente enquanto a
# cena estiver ativa, nele são executados os processos de verificação das 
# teclas pressionadas.
#
#==============================================================================

def update
  super
  
  if Input.trigger?(:DOWN) and @index < 2
    
    @index += 1
    
  elsif Input.trigger?(:UP) and @index > 0
    
    @index -= 1
    
  elsif Input.trigger?(:C)
  
    case @index
    
    when 0
      
      command_new_game
      
    when 1
      
      if DataManager.save_file_exists?
      command_continue
    else
      Sound.play_buzzer
      end
      
    when 2
      
      command_shutdown
      
    end
    
  end
  
  case @index
  
  when 0
    
    @ngame_button.bitmap = Cache.title1(RGSS3_Title_Config::NGame_Images[1])
    @continue_button.bitmap = Cache.title1(RGSS3_Title_Config::Continue_Images[0])
    @exit_button.bitmap = Cache.title1(RGSS3_Title_Config::Exit_Images[0])
    
  when 1
    
    @continue_button.bitmap = Cache.title1(RGSS3_Title_Config::Continue_Images[1])
    @ngame_button.bitmap = Cache.title1(RGSS3_Title_Config::NGame_Images[0])
    @exit_button.bitmap = Cache.title1(RGSS3_Title_Config::Exit_Images[0])
    
  when 2
  
    @exit_button.bitmap = Cache.title1(RGSS3_Title_Config::Exit_Images[1])
    @continue_button.bitmap = Cache.title1(RGSS3_Title_Config::Continue_Images[0])
    @ngame_button.bitmap = Cache.title1(RGSS3_Title_Config::NGame_Images[0])
    
  end
  
end

#==============================================================================
# * create_images:
#
# Esse é o método de criação das imagens dos botões 'Novo Jogo', 'Continuar' e 
# 'Sair' e da imagem com o título do jogo.
#
#==============================================================================

def create_images
  
for i in 0...RGSS3_Title_Config::Background.size
  
  @background.push(Sprite.new)
  @background[-1].bitmap = Cache.title1(RGSS3_Title_Config::Background[i])

end

@ngame_button.x = RGSS3_Title_Config::NGame_Positions[0]
@ngame_button.y = RGSS3_Title_Config::NGame_Positions[1]
@ngame_button.bitmap = Cache.title1(RGSS3_Title_Config::NGame_Images[0])

@continue_button.x = RGSS3_Title_Config::Continue_Positions[0]
@continue_button.y = RGSS3_Title_Config::Continue_Positions[1]
@continue_button.bitmap = Cache.title1(RGSS3_Title_Config::Continue_Images[0])

@exit_button.x = RGSS3_Title_Config::Exit_Positions[0]
@exit_button.y = RGSS3_Title_Config::Exit_Positions[1]
@exit_button.bitmap = Cache.title1(RGSS3_Title_Config::Exit_Images[0])

@title.x = RGSS3_Title_Config::Name_Positions[0]
@title.y = RGSS3_Title_Config::Name_Positions[1]
@title.bitmap = Cache.title1(RGSS3_Title_Config::Name_Image)

end

#==============================================================================
# * command_new_game:
#
# Esse é o método que executa as funções da criação de um novo jogo.
#
#==============================================================================

def command_new_game
    DataManager.setup_new_game
    fadeout_all
    $game_map.autoplay
    SceneManager.goto(Scene_Map)
  end
  
#==============================================================================
# * command_continue:
#
# Esse é o método que executa o carregamento de um arquivo de jogo.
#
#==============================================================================

  def command_continue
    SceneManager.call(Scene_Load)
  end

#==============================================================================
# * command_shutdown:
#
# Esse é o método que fecha a janela do jogo.
#
#==============================================================================
  
  def command_shutdown
    fadeout_all
    SceneManager.exit
  end

#==============================================================================
# * terminate:
#
# Esse é o método de finalização do script, aqui as imagens serão apagadas.
#
#==============================================================================

def terminate
  super
  
  
  
end

end
#==============================================================================
# Fim do Script
#==============================================================================

Agora bastante coisa foi modificada, vou começar pelo método start, nele foram adicionadas as seguintes linhas:

  # Chamando o método de criação das imagens, onde as posições e gráficos serão
  # aplicados nos Sprites criados
  create_images
  
  # Chamando o método que tocará a música definida para a tela de título
  play_title_music

Essas linhas, como explicado nos comentários, servem para aplicar as configurações aos Sprites (@ngame_button, @continue_button, @exit_button, @title) e para tocar a música da tela de título, o método play_title_music não foi definido de novo, ele já está presente na classe Scene_Title original e não causa erros junto dessa modificação.

Agora, o método update, basicamente escrevemos ele inteiro nessa etapa, vou explicar o que fizemos:

if Input.trigger?(:DOWN) and @index < 2
    
    @index += 1
    
  elsif Input.trigger?(:UP) and @index > 0
    
    @index -= 1
    
  elsif Input.trigger?(:C)
  
    case @index
    
    when 0
      
      command_new_game
      
    when 1
      
      if DataManager.save_file_exists?
      command_continue
    else
      Sound.play_buzzer
      end
      
    when 2
      
      command_shutdown
      
    end
    
  end
  
  case @index
  
  when 0
    
    @ngame_button.bitmap = Cache.title1(RGSS3_Title_Config::NGame_Images[1])
    @continue_button.bitmap = Cache.title1(RGSS3_Title_Config::Continue_Images[0])
    @exit_button.bitmap = Cache.title1(RGSS3_Title_Config::Exit_Images[0])
    
  when 1
    
    @continue_button.bitmap = Cache.title1(RGSS3_Title_Config::Continue_Images[1])
    @ngame_button.bitmap = Cache.title1(RGSS3_Title_Config::NGame_Images[0])
    @exit_button.bitmap = Cache.title1(RGSS3_Title_Config::Exit_Images[0])
    
  when 2
  
    @exit_button.bitmap = Cache.title1(RGSS3_Title_Config::Exit_Images[1])
    @continue_button.bitmap = Cache.title1(RGSS3_Title_Config::Continue_Images[0])
    @ngame_button.bitmap = Cache.title1(RGSS3_Title_Config::NGame_Images[0])
    
  end
 

Bom, primeiro, temos as verificações de botão pressionado, se o jogador pressionar o botão BAIXO, e a variável @index for menor que dois, a variável @index aumenta em 1, isso é para que o cursor possa se mover, mas não além dos limites, se @index for 2, o cursor está sobre a opção 'Sair', que é a última, então para evitar que o cursor saia das opções, precisamos colocar um número máximo nele.

Depois, se o botão CIMA for pressionado e a variável @index for maior que 0, @index aumenta em 1, esse processo segue o mesmo modelo que o anterior, mas para o cursor poder se mover para cima.

E, ainda, temos a condição de se o jogador pressionar o botão C (Enter/Espaço/Z), ele verifica qual o valor de @index e executa um método baseando-se nisso. Aí, vemos uma nova estrutura condicional, o case, o case serve para verificar o valor de uma variável/expressão, e dependendo disso ele executa um bloco de código, aí um modelo para uso do case:

case variavel_ou_expressão

when valor # Se a variável ou expressão tiver valor igual a 'valor', executa 'código'

código

when valor2 # Se a variável ou expressão tiver valor igual a 'valor2', executa 'código2'

código2

when valor3 # Se a variável ou expressão tiver valor igual a 'valor3', executa 'código3'

código3

else # Se a variável ou expressão não tiver nenhum dos valores acima executa 'código4'

código4

end

Lembrando que não há limite para o número de 'when' em um 'case'.

Agora, vamos ver os códigos que ele executa em cada uma cada hipóteses, bom, se @index for 0, ou seja, o cursor vai estar na primeira posição, no caso 'Novo Jogo', então, ele vai executar o método 'command_new_game', que irá criar um novo jogo, é assim para as posições 1 (botão 'Continuar') e 2 (botão 'Sair').

A posição 1, porém, tem uma pequena diferença, ela verifica primeiro se existe algum arquivo salvo (com o método DataManager.save_file_exists?, só de ler já dá para saber para que ele serve  :hehehe:), depois, se existir algum arquivo, ele executa o método de carregamento normalmente, se não, ele toca um som de erro.

Depois disso, temos outro 'case', que verifica também o valor de @index, mas desta vez ele faz isso para mudar o gráfico da imagem para o gráfico de botão selecionado, e mudar o gráfico das outras opções para o gráfico normal, para causar o efeito de movimento do cursor.

Depois do método 'update', temos o 'create_images', nele, temos algo interessante que é uma estrutura de repetição para permitir que o usuário possa usar mais que uma imagem para o fundo, então criamos, dentro de uma array (RGSS3_Title_Config::Background) tantos sprites quanto imagens configuradas, para isso, fazemos uma estrutura de repetição que vai rodar até que o ciclo complete 'Background.size' vezes, ou seja, ela vai executar o bloco uma vez para cada número dentro do alcance de 0 até a quantidade de objetos dentro da array Background.

for i in 0...RGSS3_Title_Config::Background.size
  
  @background.push(Sprite.new)
  @background[-1].bitmap = Cache.title1(RGSS3_Title_Config::Background[i])

end

@ngame_button.x = RGSS3_Title_Config::NGame_Positions[0]
@ngame_button.y = RGSS3_Title_Config::NGame_Positions[1]
@ngame_button.bitmap = Cache.title1(RGSS3_Title_Config::NGame_Images[0])

@continue_button.x = RGSS3_Title_Config::Continue_Positions[0]
@continue_button.y = RGSS3_Title_Config::Continue_Positions[1]
@continue_button.bitmap = Cache.title1(RGSS3_Title_Config::Continue_Images[0])

@exit_button.x = RGSS3_Title_Config::Exit_Positions[0]
@exit_button.y = RGSS3_Title_Config::Exit_Positions[1]
@exit_button.bitmap = Cache.title1(RGSS3_Title_Config::Exit_Images[0])

@title.x = RGSS3_Title_Config::Name_Positions[0]
@title.y = RGSS3_Title_Config::Name_Positions[1]
@title.bitmap = Cache.title1(RGSS3_Title_Config::Name_Image)

Agora, veremos o que o bloco dentro da estrutura de repetição faz, bom, ele, primeiro, 'pusha' (ou cria)
uma variável com valor Sprite.new (um objeto da classe sprite), é o que eu disse na parte anterior, criamos um sprite para cada imagem.

Depois, o bloco muda o gráfico do Sprite criado (que está na posição -1, ou seja, a última, podemos pensar como se arrays tivessem 'loop') para o gráfico definido para a imagem, que é, no caso, a imagem definida na posição 'i' (que é o número de vezes que o bloco já se repetiu).
Agora, depois de criar as imagens de fundo, temos um padrão para os três sprites dos botões:

@nome_button.x = RGSS3_Title_Config::Nome_Positions[0]
@nome_button.y = RGSS3_Title_Config::Nome_Positions[1]
@nome_button.bitmap = Cache.title1(RGSS3_Title_Config::Images[0])

Bom, o que esses comandos fazem, exatamente, é primeiro posicionar a imagem de acordo com o que foi configurado, depois, aplicar o gráfico configurado no sprite, então, para adquirir a posição 'x', usamos o valor na primeira posição da array 'Nome_Positions', e para a posição 'y', usamos o valor na segunda posição, assim como explicado nas instruções.

E o bitmap (gráfico) é definido usando o método 'title1' do módulo 'Cache', usado para adquirir imagens das pastas de gráficos do RPG Maker, usamos a imagem na primeira posição da array  porque essa é a imagem do botão normal, ainda não selecionado.

O Sprite '@title' segue quase o mesmo padrão, exceto porque a imagem que ele usa não está em uma array, porque o nome não possui imagem de 'Selecionado'.

[box class=titlebg]Finalização[/box]

Até que enfim, chegamos ao final do script!  :-D
A finalização é uma parte fácil e pequena, então, aí o código:

#==============================================================================
# RGSS3 - Aula 7: Script de Tela de Título
#
# O script modifica a tela de título do rpg maker, ele é customizável, é
# possível escolher onde ficará cada coisa. Outra característica desse script
# é que ele usa imagens para os botões de 'Novo Jogo', 'Continuar' e 'Sair', 
# além de permitir mais de 2 imagens de fundo, e de usar uma imagem para o 
# título do jogo.
#
#==============================================================================
#==============================================================================
# Configurações:
#==============================================================================
module RGSS3_Title_Config

# A lista dos nomes das imagens de fundo. Elas devem estar na pasta Title1.
Background = ["Title_Background1", "Title_Background2", "Title_Background3"]

# Os nomes das imagens dos botões 'Novo Jogo', 'Continuar' e 'Sair', a primeira
# é do botão normal e a segunda é dele quando selecionado. As imagens devem 
# estar na pasta Graphics/Titles1
NGame_Images = ["Title_NewGame", "Title_NewGame_Selected"]

Continue_Images = ["Title_Continue", "Title_Continue_Selected"]

Exit_Images = ["Title_Exit", "Title_Exit_Selected"]

# Nome da imagem com o nome do jogo. A imagem deve estar na pasta 
# Graphics/Titles1
Name_Image = "Title_Name"

# As posições dos botões de 'Novo Jogo', 'Continuar' e 'Sair', o primeiro 
# número é a posição X (horizontal) e o segundo é a posição Y (vertical).
# Lembre-se que esta é a posição do canto superior esquerdo da imagem.
NGame_Positions = [170, 250]

Continue_Positions = [170, 290]

Exit_Positions = [170, 330]

# As posições da imagem com o nome do jogo. O primeiro número é a posição X 
# (horizontal) e o segundo é a posição Y (vertical). Lembre-se que esta é a 
# posição do canto superior esquerdo da imagem.
Name_Positions = [-30, 5]

end
#==============================================================================
# Fim das Configurações
#==============================================================================
#==============================================================================
# Scene_Title:
#==============================================================================
class Scene_Title < Scene_Base

#==============================================================================
# * start:
#
# Esse é o método inicial do script, onde são criadas as variáveis e chamados 
# os métodos de criação
#
#==============================================================================
def start
  super
  
  # Criação da array que guardará as imagens de fundo
  @background = []
  
  # Criação do Sprite dos botões, na ordem, de 'Novo Jogo', 'Continuar' e 
  # 'Sair'
  @ngame_button = Sprite.new

  @continue_button = Sprite.new
  
  @exit_button = Sprite.new
  
  # Criação do Sprite da imagem com o nome do jogo
  @title = Sprite.new
  
  # Criação da variável que guarda a posição do cursor, definindo qual botão
  # está selecionado no momento
  @index = 0
  
  # Chamando o método de criação das imagens, onde as posições e gráficos serão
  # aplicados nos Sprites criados
  create_images
  
  # Chamando o método que tocará a música definida para a tela de título
  play_title_music
  
end

#==============================================================================
# * update:
#
# Esse é o método de atualização do script, ele roda indefinidamente enquanto a
# cena estiver ativa, nele são executados os processos de verificação das 
# teclas pressionadas.
#
#==============================================================================

def update
  super
  
  if Input.trigger?(:DOWN) and @index < 2
    
    @index += 1
    
  elsif Input.trigger?(:UP) and @index > 0
    
    @index -= 1
    
  elsif Input.trigger?(:C)
  
    case @index
    
    when 0
      
      command_new_game
      
    when 1
      
      if DataManager.save_file_exists?
      command_continue
    else
      Sound.play_buzzer
      end
      
    when 2
      
      command_shutdown
      
    end
    
  end
  
  case @index
  
  when 0
    
    @ngame_button.bitmap = Cache.title1(RGSS3_Title_Config::NGame_Images[1])
    @continue_button.bitmap = Cache.title1(RGSS3_Title_Config::Continue_Images[0])
    @exit_button.bitmap = Cache.title1(RGSS3_Title_Config::Exit_Images[0])
    
  when 1
    
    @continue_button.bitmap = Cache.title1(RGSS3_Title_Config::Continue_Images[1])
    @ngame_button.bitmap = Cache.title1(RGSS3_Title_Config::NGame_Images[0])
    @exit_button.bitmap = Cache.title1(RGSS3_Title_Config::Exit_Images[0])
    
  when 2
  
    @exit_button.bitmap = Cache.title1(RGSS3_Title_Config::Exit_Images[1])
    @continue_button.bitmap = Cache.title1(RGSS3_Title_Config::Continue_Images[0])
    @ngame_button.bitmap = Cache.title1(RGSS3_Title_Config::NGame_Images[0])
    
  end
  
end

#==============================================================================
# * create_images:
#
# Esse é o método de criação das imagens dos botões 'Novo Jogo', 'Continuar' e 
# 'Sair' e da imagem com o título do jogo.
#
#==============================================================================

def create_images
  
for i in 0...RGSS3_Title_Config::Background.size
  
  @background.push(Sprite.new)
  @background[-1].bitmap = Cache.title1(RGSS3_Title_Config::Background[i])

end

@ngame_button.x = RGSS3_Title_Config::NGame_Positions[0]
@ngame_button.y = RGSS3_Title_Config::NGame_Positions[1]
@ngame_button.bitmap = Cache.title1(RGSS3_Title_Config::NGame_Images[0])

@continue_button.x = RGSS3_Title_Config::Continue_Positions[0]
@continue_button.y = RGSS3_Title_Config::Continue_Positions[1]
@continue_button.bitmap = Cache.title1(RGSS3_Title_Config::Continue_Images[0])

@exit_button.x = RGSS3_Title_Config::Exit_Positions[0]
@exit_button.y = RGSS3_Title_Config::Exit_Positions[1]
@exit_button.bitmap = Cache.title1(RGSS3_Title_Config::Exit_Images[0])

@title.x = RGSS3_Title_Config::Name_Positions[0]
@title.y = RGSS3_Title_Config::Name_Positions[1]
@title.bitmap = Cache.title1(RGSS3_Title_Config::Name_Image)

end

#==============================================================================
# * command_new_game:
#
# Esse é o método que executa as funções da criação de um novo jogo.
#
#==============================================================================

def command_new_game
    DataManager.setup_new_game
    fadeout_all
    $game_map.autoplay
    SceneManager.goto(Scene_Map)
  end
  
#==============================================================================
# * command_continue:
#
# Esse é o método que executa o carregamento de um arquivo de jogo.
#
#==============================================================================

  def command_continue
    SceneManager.call(Scene_Load)
  end

#==============================================================================
# * command_shutdown:
#
# Esse é o método que fecha a janela do jogo.
#
#==============================================================================
  
  def command_shutdown
    fadeout_all
    SceneManager.exit
  end

#==============================================================================
# * terminate:
#
# Esse é o método de finalização do script, aqui as imagens serão apagadas.
#
#==============================================================================

def terminate
  super
  
  # Apagando os botões de 'Novo Jogo', 'Continuar' e 'Sair'
  @ngame_button.dispose
  @continue_button.dispose
  @exit_button.dispose
  
  # Apagando a imagem com o nome do jogo
  @title.dispose
  
  # Apagando cada imagem dentro da array @background
  @background.each {|image| image.dispose}
  
end

end
#==============================================================================
# Fim do Script
#==============================================================================

A modificação que fizemos foi esta:

  # Apagando os botões de 'Novo Jogo', 'Continuar' e 'Sair'
  @ngame_button.dispose
  @continue_button.dispose
  @exit_button.dispose
  
  # Apagando a imagem com o nome do jogo
  @title.dispose
  
  # Apagando cada imagem dentro da array @background
  @background.each {|image| image.dispose}

Este bloco foi adicionado ao terminate, que é o método executado quando a cena muda.

O método '.dispose' é um método usado para apagar uma janela ou imagem, lembrando que você precisa mostrar a imagem de novo quando for usá-la para não causar erros.

E temos algo interessante no @background, nele, usei o método .each, que tem a mesma função que o 'for', ou seja, ao invés de usar o '.each', poderíamos escrever assim:

for image in @background

image.dispose

end

Ele executa o bloco uma vez para cada objeto dentro da array (ou hash), e é possível manipular o objeto na posição atual usando a variável local escrita depois do for, no caso, 'image', que é um sprite, então ele vai apagar cada sprite que houver dentro da array.

É isso aí pessoal, essa foi nossa sétima aula de RGSS3, espero que tenham gostado e aprendido com ela, qualquer dúvida, podem perguntar, de preferência no tópico para ajudar também aos outros que tiverem a mesma dúvida.

[/box]

[Raizen]

O método '.dispose' é um método usado para apagar uma janela ou imagem, lembrando que você precisa mostrar a imagem de novo quando for usá-la para não causar erros.

Isso é tipo ultra-mega-hiper importante :P.

Para quem não manja, não dar dispose significa que o cara pode estar jogando o jogo lá, e em um dispose errado dar o RGSS3 Player parou de funcionar, li isso em um tópico na gringa x), só adicionando isso não porque sou manjão nem nada hsuAHS, mas é que eu li em uma matéria na rpgmakerweb e achei interessante.


Ah, eu geralmente dou dispose no bitmap também
tipo

image.bitmap.dispose
image.dispose

Não sei se sem isso vai dar erro, mas sempre coloquei.. vai que :P.


Cara muito boa a aula, legal fazer na prática, bem melhor do que ficar sempre no soma, multiplica, printa que parece ter um vão enorme entre quem está começando e quem já faz scripts, boa sorte nas próximas manolo.

[Brandt]

Obrigado por comentar Raizen 

Eu não sabia disso de poder dar problema no RGSS players sempre achei que fosse mais para evitar lag... E não sabia que era preciso dar dispose no bitmap também, o dispose do Sprite não faz isso?

Enfim, até mais, obrigado por comentar e acrescentar isso.

[miguel8884]

gostei muito, mas eu queria aprender mais a fazer uma hud! Mas ficou muito bom.

[Brandt]

Hehe, a próxima aula vai ser sobre fazer uma HUD 

E que bom que gostou.