Menu

07 – Tutorial Intermediário – Escolhendo Personagem

E aê indies, preparados para mais um tutorial? No post de hoje vamos aprender como fazer uma tela de seleção de personagens!

Sem muita conversa hoje, vamos direto ao assunto continuando exatamente de ontem paramos na tela de Menu Principal.

Aqui vocês podem duplicar (Ctrl+D ou Ctrl+C e depois Ctrl+V) algum dos painéis existente. Eu irei fazer com o PainelConfiguracoes, porque ele já tem o botão de volta. Irei renomear para PainelSelecaoPersonagem e apagar tudo, deixando apenas o botão de voltar:

Aproveitei para dá uma esticada também nesse painel (Pode esticar tanto segurando as bordas na aba Scene ou alterando os valores Width e Heigh na aba Inspector, mas tente sempre deixar centralizado e na altura dos outros painéis).

Bom, o próximo passo é ter um botão para cada personagem que nosso jogo vai ter, porém vamos fazer apenas um e depois o duplicamos e fazemos as alterações necessárias.

Então dentro do painel adicione um botão (UI >> Button). Neste botão iremos aumentar o seu tamanho e retirar o campo Text:

A ideia aqui é que dentro deste botão tenha a imagem do nosso personagem e suas informações de HP, MP e Ataque. E que quando a gente clicar no botão ele vai mudar para indicar que está selecionado.

Eu até que gostei dessa cor branca ai. Poderíamos usar a branca para não selecionado e verde para selecionado, maaaas vamos trabalhar com imagens para vocês verem como ficaria. Então as Imagens que eu irie utilizar estão lá no nosso sprites Window. Seriam uns retângulos assim:

No meu caso Window_51 para personagem não selecionado:

E Window_30 para personagem selecionado:

Quando você for escolher as suas imagens, pense sempre em escolher imagens retangulares maiores na vertical, já que nosso botão é assim, dessa forma a imagem não perde tanto a qualidade.

Bom, após deixar selecionado a sua imagem de botão não selecionado (No meu caso Window_51), vou renomear o botão para BotaoPersonagem1 e vou adicionar mais um objeto UI do tipo Image dentro do Botão:

Essa imagem branca dentro do objeto BotaoPersonagem1 será a imagem do personagem. Eu coloquei por enquanto 60 de largura (width), mas depois iremos ajustar melhor esse tamanho quando tivermos a imagem do personagem. Próximo passo é renomear esse objeto Image para SpritePersonagem e o posiciona-lo a esquerda do botão:

Tudo tranquilo até aqui? Então vamos adicionar um Objeto UI do tipo Text dentro do BotaoPersonagem1:

E altere o nome do objeto para TextoHP:

Aqui é semelhante ao post anterior. Vamos alterar a fonte do texto (A cor também se quiser), vamos posiciona-lo depois do SpritePersonagem e adicionarmos o texto HP:

Dentro agora de TextoHP,v amos adicionar um componente novo para vocês, chamado Slider (Vou colocar dentro, pois assim se precisarmos mexer o TextoHP, esse Slider vai junto):

O nome que darei é StatusHP:

Caso repare, lá no Texto já apareceu um Slider, não é mesmo?

Aqui a minha ideia é fazer que nem aqueles perfis de Status no jogo que mostram o status do personagem através de barras, sabe?

(Jogo: Shin Megami Tensei)

(Jogo Borderlands)

Então nós não vamos precisar dessa bolinha ai no nosso Slider. Só que antes de remove-la, bora entender esse componente que é um pouco mais complexo do que os anteriores?

O objeto Slider (Que renomeamos para StatsHP) é onde está toda a magia do Slider, onde se alteramos o campo Value, a barra irá se mover:

Min Value e Max Value definem o inicio e o fim do Slider (Se fosse volume, o Min seria 0 e o máximo 100, por exemplo).

O Checbox Interactable lá em cima permite que o jogador altere esse valor clicando na bolinha e a arrastando. No nosso caso esses valores serão fixos e não controlado pelo jogador (Será igual aos exemplos que usei lá em cima dos jogos. Ou seja, cada personagem já terá seu Status definido), neste caso podemos remover esse Interactable:

Existe algumas outras coisas no Slider que não iremos usar, mas vai ai umas explicações. Caso a sua barra seja na vertical e não na horizontal, pode trocar isso em Direction:

Mas esse não é o nosso caso, então deixem Left to Right mesmo.

O campo Target Graphic, representa o objeto da bolinha do nosso Slider. As opções Normal Color (Cor normal), Highlighter Color (Cor com o mouse por cima), Pressed Color (Cor ao pressionar a bolinha) e Disabled Color (Cor quando Interactable está desmarcado) são aplicados a essa bolinha:

Porém como falei, nós não vamos utiliza-la, então podemos simplesmente excluir essa bolinha. Clica lá no Handle Slide Area na aba Hierarchy e aperta delete:

Adeus bolinha:

No objeto Background tem a imagem ou cor de fundo da nossa barra, que vou deixar um cinza escuro só para ilustração:

O Objeto Fill determina o tamanho da barra quando completa:

Agora, vai acontecer algo curioso. Vamos voltar lá no nosso Slider (StatusHP) e dizer que ele está completo (Value = 1):

Você vai perceber que mesmo estando topado, nossa barra não fica completa:

Ainda falta um trechinho.

“Oooxe! Por que isso, Carlos?”

Esqueceu que tiramos a nossa bolinha? Esse era o espaço dela. Como não estamos mais usando, podemos preencher esse espaço alterando o tamanho da Fill Area. Então clica lá no objeto em Fill Area e no Inspetor altera esses Left e Right para 0:

E nossa barra já fica completa. Caso você repare Fill Area tem suas ancoras do tipo Stretch ou seja que estica. Se a distancia dela do lado esquerdo e direito em relação ao pai for zero, então ela fica exatamente do mesmo tamanho. Foi isso que acabamos de fazer ^^

Agora o Objeto Fill é a imagem branca em si. O Fill Area é apenas o caminho que essa área pode ir, mas a barra mesmo é o Fill. Então vamos entrar nele e alterar a cor para vermelho:

Bora para mais uma curiosidade em relação novamente a bolinha? Bora alterar o valor agora do Slider para 0 (Value = 0)

Caso reparem ainda fica um pontinho vermelho lá na nossa barra. Isso novamente é por conta da bolinha que existia antes e não existe mais. Para arrumar isso, basta a gente ir no Objeto Fill e trocar a sua largura (Width) para 0:

Prontinho, já resolveu o problema. Caso esteja vendo a bolinha ainda lá, não se preocupe, basta alterar o valor do Slider lá em value e depois voltar a 0 que ele desaparece.

Com isso já entendemos como funciona o nosso Slider. Já consegue pensar aonde iremos utilizar isso depois? Se pensou na barra de vida e de magia do personagem, acertou em cheio!

Mas vamos continuar com o nosso tutorial. Volte lá Slider (StatusHP) e vamos informar que o Max Value é 20:

De onde eu tirei esse 20? Lembra-se dos Status dos nossos personagens:

Personagem1

• HP: 20
• MP: 6
• Ataque: 10

Personagem2

• HP: 10
• MP: 12
• Ataque: 5

Aqui é bem simples. É só a gente pegar o maior valor entre todos os personagens. Ou seja, o Max Value de HP é 20, o Max Value de MP é 12 e o Max Value de Ataque é 10.

Estamos quase acabando esse Slider. Só precisamos agora posiciona-lo abaixo do HP (Ou do lado se preferir) e diminui seu tamanho:

Com o TextoHP todo pronto, podemos duplica-lo duas vezes! E renomea-los para TextoMP/StatusMP e TextoAtaque/StatusAtaque:

Nós Textos já podemos alterar para a posição correta e alterar os textos para seus respectivos textos:

Agora vamos no objeto Fill do StatusMP e alterar a cor de vermelho para Verde e depois no Fill de StatusAtaque e alterar para Azul:

Começando a ficar legal, né?

Em StatusMP, já podemos mudar o Max Value para 12 e em StatusAtaque mudamos o MaxValue para 10 (O motivo é aquele que acabamos de ver, colocamos o maior valor entre todos os personagens do nosso jogo):

Bom, agora iremos adicionar o nosso prefab Personagem1 dentro do botão.

“Que?! Que loucura é essa Carlos, ele nem ao menos é um tipo de campo UI e nosso personagem vai ficar movendo lá?”

Calma, calma, calma. Nós ainda vamos arrumar isso. A forma mais fácil de fazer seria desabilitar o Objeto:

Pronto, com isso ele já não vai mais se mover, nem aparecer, nem fazer nada. Porém ele ainda existe na Scene, o que significa que outros Scripts podem acessa-lo e pegar suas informações como Imagem e Status.

Porém isso implicaria em vários problemas como por exemplo o método Awake que define o Status do personagem NUNCA iria ser iniciado enquanto o personagem estiver desabilitado.

ENTÃO NÃO VAMOS FAZER ISSO, OK? DEIXE O PERSONAGEM1 AINDA ATIVO!

Neste caso no script Jogador vamos precisar fazer umas alterações para quando o nosso personagem não puder se mover nem fazer nada (Que é uma ideia parecida com as cutscenes de conversa onde seu personagem trava e não pode fazer nada).

Abra o Script jogador e adicione mais uma variável do tipo booleana chamada desabilitarComandos:

Script: Jogador.cs

    public bool desabilitarComandos = false; //Não permite controlar o personagem

E a próxima alteração é lá no método Update:

Script: Jogador.cs

    void Update() {
        if (desabilitarComandos) 
            GetComponent().isKinematic = true;    
        else {
            GetComponent().isKinematic = false;
            if (!atacando)
                mover();
            if (estaNoChao)
                atacar();
        }
    }

Antes só tínhamos o if do atacando e o do está no chão, agora temos mais um if e usamos o Kinematic do Rigidbody2D.

A ideia aqui é simples, se desabilitarComandos for verdade, os métodos mover() e atacar() não serão executados (Afinal, eles estão no else) e ainda por cima vamos dizer que a física como gravidade, força, colisão também não irão funcionar por conta do isKinematic ativado. Esse método normalmente é utilizado quando o personagem é controlado sozinho via script em cutscenes, por isso o nome kinematic (cinemático).

Então se desabilitamos os comandos, removemos também esses efeitos de física, beleza?

Huuuuum, estão após esse ajuste já estão começando a entender então o papel do Personagem1 lá no botão? Só tem um porém, nós vamos acessar os dados do personagem através da nossa interface (capa) IPersonagem, afinal pode ser diferentes tipos de personagens ai nesse botão, mas não existe nenhum método que retorne a imagem na nossa Interface. Então esta será a hora de fazer!

Abre lá aquele Script que vocês nem se lembram mais:

Aqui iremos adicionar um único método, que deve retornar o Sprite do personagem:

Sprite getSprite();

Script: IPersonagem.cs

using UnityEngine;
using System.Collections;

public interface IPersonagem {
    Status getStatus();
    void recebeDano(int dano);
    Sprite getSprite();
}

Depois disso, precisamos abrir novamente o Script Jogador. Nele vamos adicionar o seguinte método:

Script: Jogador.cs

    public Sprite getSprite() {
        return GetComponent().sprite;
    }

Ele pega o Componente Sprite Renderer e pega o Sprite que estiver lá:

Agora sim já temos como recupera a imagem do personagem e seu status através da Interface IPersonagem.

EXTRA: Há uma forma de buscar o Sprite do personagem e desabilitar os comandos do personagem? Sim, há! É mais fácil? Bem mais. Como faz? Fica ai como desafio para vocês. O primeiro que resolver esse mistério, estou pensando em dar alguma key de algum jogo indie como presente, como uma forma de incentivar a vocês a pensarem.
Então só precisamos criar um script para o botão. Neste caso de volta ao Unity crie um Script (C#) dentro de controller chamado BotaoSelecaoPersonagem:

Não adicionei o GC, pois não ele não terá função de controlar o jogo em sim, apenas a funcionalidade do botão (Então, se preferir separar em outra pasta, fique a vontade).

Nesse Script vamos adicionar 4 variáveis :

Script: BotaoSelecaoPersonagem.cs

    public Sprite spriteSelecionado;    //Imagem do botão não selecionado
    public Sprite spriteNaoSelecionado; //Imagem do botão selecionado
    public bool selecionado;            //Verifica se esse botão está selecionado
    public IPersonagem personagem;      //Pega os dados do personagem do botão  

As duas primeiras serão os sprites do botão lembra (Window_30 e Window_51)? O selecionado é uma variável do tipo booleana para verifica se o botão atual está ou não selecionado. E o personagem é o que irá guardar os dados do personagem do botão.

Bom, feito isso no método Start, podemos buscar o personagem:

Script: BotaoSelecaoPersonagem.cs

	void Start () {
        personagem = GetComponentInChildren();
	}

O método GetComponentInChildren(), vai buscar o objeto que tiver o componente informado (IPersonagem) entre os seus filhos. Ou seja, vai buscar entre os seus objetos filhos, o que tiver o script com a interface IPersonagem.

O próximo passo é a gente pegar agora o SpritePersonagem . E aqui vamos conhecer mais um comando do Unity, tem a funcionaidade de pega o objeto filho de acordo com a sua posição entre os objetos filhos:

	void Start () {
        personagem = GetComponentInChildren();//Recupera os dados do personagem do botão

        //Gera a Imagem do personagem no SpritePersonagem
        var spritePersonagem = transform.GetChild(0).GetComponent(); //Recupera o Script Image do primeiro filho
        spritePersonagem.sprite = personagem.getSprite();                   //Insere o sprite do personagem
	}

O que fizemos aqui? Bom, o transform.GetChild permite pegar um dos filhos do objeto. O 0 significa a posição dele, sendo que a contagem começa com 0, então, se quisermos personagem o Personagem1 lá temos que ver a sua posição menos 1:

E ao usar esse método temos que ter MUUUUITO cuidado, pois se você mudar a posição do objeto, já sabe que vai dar erro.

Recuperamos o SpritePersonagem (Que é o filho 0) e pegamos o seu script Image, onde podemos trocar sua imagem.
Agora é possível que seu código esteja dando um erro. Já vimos isso antes o porquê, mas acho que você vai ter se esquecido. Image, Slider, Text entre outros são scripts do tipo UI e estão em um pacote separado. Neste caso precisamos chamar esse pacote lá no inicio do script (using UnityEngine.UI;):

Script: BotaoSelecaoPersonagem.cs

using UnityEngine;
using UnityEngine.UI;
using System.Collections;

public class BotaoSelecaoPersonagem : MonoBehaviour {
...

Pronto, já não terá mais problemas com os scripts do tipo UI.

Os próximos passos é a gente pegar os filhos 1 (TextoHP), 2 (TextoMP) e 3 (TextoAtaque) e ai sim pegaremos o filho que tiver o componente Slider (GetComponentInChildren) de cada um deles para alterarmos o valor de value de cada slider:

	void Start () {
        personagem = GetComponentInChildren(); //Recupera os dados do personagem do botão

        //Gera a Imagem do personagem no SpritePersonagem
        var spritePersonagem = transform.GetChild(0).GetComponent(); //Recupera o Script Image do primeiro filho
        spritePersonagem.sprite = personagem.getSprite();                   //Insere o sprite do personagem

        //Status
        //HP
        var sliderHP = transform.GetChild(1).GetComponentInChildren();
        sliderHP.value = personagem.getStatus().getHPMax();

        //MP
        var sliderMP = transform.GetChild(2).GetComponentInChildren();
        sliderMP.value = personagem.getStatus().getMPMax();

        //Ataque
        var sliderAtaque = transform.GetChild(3).GetComponentInChildren();
        sliderAtaque.value = personagem.getStatus().getAtaque();
    }

Deixando mais claro primeiro pegamos os Textos e depois pegamos os Sliders (Status) dentro dos textos:

E ai, já quer testar? É só voltar no Unity e adicionar o Script BotaoSelecaoPersonagem ao
BotaoPersonagem1:

Agora vai no Personagem1 e clique no Desabilitar Comando no script Personagem1 para que ele não possa se mover nem nada:

Pronto, só dá play agora:

Nosso botão está quase pronto, o próximo passo será criar os métodos de selecionar e deselecionar (Se é que essa palavra existe) o botão no script BotaoSelecaoPersonagem:

Script: BotaoSelecaoPersonagem.cs

    public void ativarBotao() {
        selecionado = true;
        GetComponent().sprite = spriteSelecionado;
    }

    public void desativarBotao() {
        selecionado = false;
        GetComponent().sprite = spriteNaoSelecionado;
    }

Bem, facinho e sem grande mistério não é mesmo? Só informamos para a variável selecionado se ele está ou não selecionado e mudamos a imagem que representa o botão.

Bom, agora vamos criar o do OnClick nesse script:

Script: BotaoSelecaoPersonagem.cs

    public void clicou() {
        var listaBotoes = FindObjectsOfType();
        foreach (var botao in listaBotoes) {
            botao.desativarBotao();
        }
        ativarBotao();
    }

Aqui a coisa já mudou um pouquinho para vocês, mas sem desespero. Continua sendo fácil. O FindObjectsOfType (Com um S após o Object), vai pegar todos os objetos que tiverem o script BotaoSelecaoPersonagem. Por enquanto só temos um, mas depois teremos 2 e você pode fazer vários de acordo com o número de personagens que criar.

Após pegar todos os objetos que tiverem esse script e jogar na variável listaBotoes, usamos uma estrutura de repetição chama de foreach. Uma estrutura de repetição, ele repete determinamos códigos por uma certa quantidade de vezes. Aqui podemos ver estruturas de repetição como o while, for e foreach.

O foreach como o próprio nome diz será uma repetição “para cada” (tradução de foreach) item da listaBotoes. Ou seja, ele irá pegar um item da lista e vai jogar dentro do var botao. E dentro do foreach, iremos desabilitar todos os botões na lista.

Por fim, após ter deselecionado todos os botões de seleção de personagem, eu apenas ativo o botão atual ativarBotao();.

Depois iremos fazer outra alteração nesse método, mas por hora é só.

Bom, já podemos voltar para o unity, adicionar o script ao botão caso já não o tenha feito e informar quem são os sprites:

No Script Button do seu BotaoPersonagem1, defina quem é o método que será chamado no On Click(), que é o método “clicou” do script BotaoSelecionarPersonagem do mesmo objeto:

Agora basta dá play e ver se vai funcionar:

Se tiver tudo ok, então o que faremos é:

1 – Duplicar o botão BotaoPersonagem1
2 – Renomear o novo botão para BotaoPersonagem2
3 – Remover o prefab do Personagem1 nesse novo botão e adicionando o Personagem2 (Não se esqueça de marcar a opção Desabilitar Comando no script Personagem2 e se lembre de manter os objetos filhos na mesma ordem para não dá problema com o GetChild)
4 – Ajustar os botões um do lado do outro

Depois é só testar:

Estamos caminhando para o final. Agora precisamos criar outro botão lá embaixo com o nome BotaoSelecionarPersonagem e desativado:

Já vimos como podemos criar um botão assim na aula passada não é mesmo? Não é difícil. Caso não lembre, dá um pulinho lá na aula passada para revisar.

Bom, agora iremos voltar ao script BotaoSelecaoPersonagem, lá no método ativarBotao. A ideia será que se um botão foi selecionado, então iremos buscar o botão BotaoSelecionarPersonagem, pegar o componente Button e tornar ele interativo:

Script: BotaoSelecaoPersonagem.cs

	public void ativarBotao() {
        selecionado = true;
        GetComponent().sprite = spriteSelecionado;

        var botaoSelecionar = GameObject.Find("BotaoSelecionarPersonagem").GetComponent

Depois que você pega o jeito com os scripts, fica bem fácil, né? Bem, bem, bem. Agora vamos precisar criar um novo script chamado GameStatus, que vai guardar os dados do seu jogo, como Fases Liberadas, Status do personagem e o nome do Prefab do personagem. Essa nova classe ela não poderá herdar de MonoBehaviour. Vocês entenderam o motivo mais para frente quando fizemos uma o tutorial e save e load.

Então bora lá, crie um script (C#) chamado GameStatus na pasta scripts/controllers:

Abra esse script e remova a herança que ele possui. Também aproveite e já crie 3 variáveis publicas:

Script: GameStatus.cs

using UnityEngine;
using System.Collections;

public class GameStatus {

    public int faseLiberada;            //Guarda a ultima fase liberada
    public Status status;               //Guarda o Status do personagem
    public string prefabPersonagem;     //Guarda o nome do prefab do personagem
}

Sim, esse script só terá isso e nada mais. Bem simples, com a única funcionalidade de guarda o andamento do jogo.
O próximo script (C#) que iremos criar agora dentro da pasta scripts/controllers será o GCJogo. Bem genérico assim mesmo, porém de super importância. O objeto que tiver esse script para se ter ideia vai existir em TODAS as scenes e será responsável por guardar os dados do jogador durante todo o jogo, ou seja, ele terá a classe GameStatus com ele.

Ao abrir esse script, iremos adicionar uma variável privada do tipo GameStatus:

Script: GCJogo.cs

private GameStatus gameStatus;

Definimos como private, para evitar que algum script altere a classe sem passar pelo GCJogo, mesmo ela ainda podendo alterar os valores de GameStatus que são público. Mas se quiser deixar como público não terá problema.

Caso criem a variável como private, então criem o método getGameStatus():

Script: GCJogo.cs

    public GameStatus getGameStatus() {
        return gameStatus;
    }

No método Awake iremos iniciar essa variável e dizer para o Unity que quando mudarmos de cena, esse objeto não vai ser destruído e continuará existindo nas outras cenas através do método DontDestroyOnLoad:

Script: GCJogo.cs

using UnityEngine;
using System.Collections;

public class GCJogo : MonoBehaviour {

    private GameStatus gameStatus;

	void Start () {
        gameStatus = new GameStatus();
        DontDestroyOnLoad(this.gameObject);
	}

    public GameStatus getGameStatus() {
        return gameStatus;
    } 
}

O método DontDestroyOnLoad como já falei, serve para informar o Unity que quando mudarmos de cena, o objeto informado ainda vai continuar existindo. E no caso estamos informando que esse objeto é o mesmo objeto que tiver esse script (this.gameObject).

Aqui, podemos opcionalmente criar um método para quando o jogo for iniciado. O método irá passar as informações para o gameStatus:

Script: GCJogo.cs

    public void novoJogo(string prefabPersonagem, Status statusJogador) {
        gameStatus.faseLiberada = 1;
        gameStatus.prefabPersonagem = prefabPersonagem;
        gameStatus.status = statusJogador;
    }

Já deu para perceber que esse script será o que script que fará todo o controle do jogo em relação ao seu andamento, como liberar a próxima fase e tudo mais né? Como este é um novo jogo, significa que só tem uma fase libera, a primeira.

Tudo ok, agora vamos criar mais um script chamado GCSelecaoPersonagem. Este terá o método do OnClick do botão BotaoSelecionarPersonagem. Ele fará a relação entre pegar as informações do jogo e lançar pro GameStatus passando pelo método novoJogo:

Esse script terá que pegar o Status e o nome do prefab que você selecionou. Todavia, nós ainda não temos nada na nossa interface IPersonagem que retorne o nome do prefab não é mesmo? Então bora fazer agora antes de continuar com o nosso GCSelecaoPersonagem.

Abra o Script IPersonagem e adicione o novo método getNomePrefab():

Script: IPersonagem.cs

using UnityEngine;
using System.Collections;

public interface IPersonagem {
    Status getStatus();
    void recebeDano(int dano);
    Sprite getSprite();
    string getNomePrefab();
}

Agora, abra o script Jogador e adicione o seguinte método:

Script: Jogador.cs

    public string getNomePrefab() {
        return this.gameObject.name;
    }

O nome dos nossos prefabs lá na pasta Project não é o mesmo nome dos nossos objetos na aba Hierarchy? Então se recuperarmos o nome do objeto lá na aba Hierarchy, também recuperamos o nome do nosso prefab!
Bom, agora já temos como recuperar o nome do nosso prefab. Isso permitirá a gente nas fases criar o prefab do personagem que selecionamos.

Já podemos voltar aonde estávamos. Abra o Script GCSelecaoPersonagem e adicione o método novoJogo():

Script: GCSelecaoPersonagem.cs

using UnityEngine;
using System.Collections;

public class GCSelecaoPersonagem : MonoBehaviour {

    public void novoJogo() {
        var listaBotoes = FindObjectsOfType();
        var GCJogo = FindObjectOfType();

        foreach (var botao in listaBotoes) {
            if (botao.selecionado == true) {
                var status = botao.personagem.getStatus();
                var prefabPersonagem = botao.personagem.getNomePrefab();
                GCJogo.novoJogo(prefabPersonagem, status);
                break;
            }
        }
    }
}

Bora entender o script. Primeiro buscamos todos os botões que tenham o script BotaoSelecaoPersonagem e logo em seguida buscamos o objeto que tem o script GCJogo (Reparem que um traz a lista FindObjectssssssofType e o outro traz apenas um único objeto FindObjectOfType).

Em seguida percorremos todos os botões através do foreach, para verificar qual deles é o selecionado (através do if).
Após achar o botão que está selecionado, recuperamos o status do IPersonagem do que está vinculado ao botão:

E também recuperamos o nome do prefab através do método que criamos agora a pouco (getNomePrefab).

Por fim passamos essas informações o gameStatus através do método novoJogo da classe GCJogo.

O comando abaixo chamado break, serve para sair da repetição antes de completar toda a lista, afinal já pegamos o botão ativo que queríamos. Todos os próximos que existirem terão a opção selecionado == false, então não faria sentido continuar na repetição.

E com isso terminamos esse script por hora. No próximo post, iremos fazer uma pequena alteração nesse método, fazendo com que ele saia da Scene atual e vá para a Scene de Seleção de fase (Quem quiser, poderá ver um exemplo baixando o projeto).

Agora sim para finalizar de vez esse post, é só criar adicionar esse GCSelecaoPersonagem ao objeto GC e informar o método novoJogo ao método OnClick do BotaoSelecionarPersonagem:

Em seguida crie um novo GameObject chamado GCJogo e adicione o script GCJogo a ele:

E então chegamos ao final desse tutorial. Com isso você já tem o painel de seleção de personagem, sabe como clicar em um personagem e deixar ele selecionado. E por fim clicar no botão selecionar, que irá guardar as informações da escolher do jogador para iniciar o jogo. Também ficamos conhecendo o componente Slider.

Na aula passada aprendemos a trabalhar com o Canvas e os Botões, então ficará como desafio para vocês a seguinte atividade baseada na aula passada:

1 – Desativar o PainelSelecaoPersonagens
2 – Alterar o Script GCMenuPrincipal de forma que quando clicar no botão NovoJogo do PainelPrincipal, abre o PainelSelecaoPersonagens.
3 – Ao clicar no botão voltar do PainelSelecaoPersonagens, desapareça o painel de seleção de personagens e volte o PainelPrincipal.
4 – Adicionar o método botaoNovoJogo do GCMenuPrincipal ao OnClick do botão NovoJogo.

É bem simples. Caso tenham dificuldade (O que acho que vão ter) podem olhar como eu fiz baixando o projeto, maaaaaas eu recomendo muito que tentem fazer antes de olhar, para ver se realmente fixaram a ideia.

Então é isso pessoal. Espero que tenham gostado e até a próxima. Qualquer dúvida, já sabem, deixem nos comentários. 😉

Índice Tutorial Intermediário

Download do Projeto

Download do Jogo

Criador do Jogos Indie, amante de jogos, terror, música, anime e programação. Estudante de mestrado com foco em jogos na educação. Louco por Resident Evil e... sei lá, acho que é isso O.o

8 comments

  1. Deyvid Lira disse:

    Mais uma vez excelente o tutorial, muito obrigado pela ajuda cada vez mais aprendo com você, tirou muita dúvida minha quanto as UIs. No meu eu alterei o “UI Scale Mode” em Canvas para “Scale With Screen Size” para quando dar play não ficar de tamanho diferente as UIs. Ainda não conseguir encontrar a outra forma que você falou sobre pegar os sprites e desativar os comandos, de maneira mais fácil, estou tentando \o/.

  2. Natalie disse:

    Oi Carlos, Primeiramente muito obrigada pelos seus tutoriais..
    Eu estou tendo um problema nessa parte.. no menu de selecionar o personagem meu boneco aparece dentro do espaço ‘imagem’ mas ele aparece atrás do menu também.. eu ja tentei de todas as maneiras alterar isso mas eu nao consigo.. é como se o jogo tivesse começado, eu nao posso move-lo, provavelmente por causa do “desabilitar movimentos” mas ele aparece lá atras do “window’.. O que você acha que pode ser.. ja chequei a ordem dos objetos na hieraquia, ja chequei todo o codigo mil vezes e nao vejo nada diferente do seu.. até baixei o seu projeto mas não acho o erro.

    • Opa Natalie, tudo joia?

      Feliz que esteja gostando 😉

      Quanto ao personagem aparecendo atrás do menu, já tentou mover ele para um local fora do alcance da camera? Se funciona?

  3. wellington disse:

    Estamos caminhando para o final. Agora precisamos criar outro botão lá embaixo com o nome BotaoSelecionarPersonagem e desativado, nao entendi direito aqui, preciso criar o botao embaixo da onde e praque \o/

    • Opa Wellington!

      O BotaoSelecionarPersonagem vai ser criado dentro do PainelSelecaoPersonagens e seu papel será confirmar que irá usar o personagem selecionado e iniciar o jogo o/

      Por isso o deixamos como desativado inicialmente, pois não temos nenhum personagem selecionado ainda. Quando clicarmos em um personagem, ai si ativamos o botão.

      O local não importa, pode ficar aonde quiser. Eu normalmente coloco na parte de baixo do lado direito do painel, pois acho que mais mais bonitinho ^^

  4. wellington disse:

    obrigado pela atenção man, esse dia que fiz a pergunta tava morrendo de sono e n tava entendendo nd no outro dia que reparei direitinho kk

  5. miranda disse:

    bom dia Carlos!! eu queria te fazer uma pergunta ?? se eu tiver só um personagem eu posso pular este tutorial e fazer o outro de seleção de fases ? aguardo sua responta ansiosamente!!

Deixe uma resposta

Parceiros

Steam Brasil LoboLimão Centro RPG Lab Indie
Mundo Gamer PodTerror

Anunciantes

Aglomerando - Agregador de conteúdo
Uêba - Os Melhores Links GeraLinks - Agregador de links Piadas Idiotas - São idiotas mas o faz rir Tedioso: Os melhores links LinkLog MeusLinks.com - Informação e conteúdo todos os dias para você! Agregador de Links - Madruga Links 4Blogs - Agregador de conteúdo Está no seu momento de descanso né? Entao clique aqui!