Lógica do jogo

Concluído

Nesta unidade, abordamos conceitos como a maneira que o jogo "Connect Four" funciona e quais construções do Blazor você precisa saber para produzir um jogo.

Connect Four

A ideia com o jogo "Connect Four" é que você disponha quatro peças de jogo em uma linha horizontal, vertical ou diagonal antes do seu oponente. Coisas que você precisa considerar ao implementar este jogo é acompanhar o estado atual das peças do jogo, seus oponentes e verificar se há um vencedor. Ao programar, recomendamos usar um loop de jogo, um conjunto de ações que você precisa repetir até poder declarar um vencedor. Algo assim:

  1. Comece com um estado "redefinido", ou seja, um tabuleiro limpo sem peças de jogo.
  2. O usuário coloca uma peça do jogo.
  3. O adversário coloca uma peça do jogo.
  4. Verifique se há vencedor:
    1. Se houver um vencedor, declare o vencedor e termine o jogo ou reinicie o jogo.
    2. Se não houver vencedor, repita a etapa 2.

Representar o estado no código

Primeiro, o que é estado? O estado nos jogos é o que aconteceu no jogo, quantos pontos você tem, onde seus lugares de jogo estão localizados e assim por diante.

Uma orientação importante quando se trata de estado no desenvolvimento de jogos é manter o estado separado da IU, pois isso facilita as modificações e a leitura do seu código, entre outros benefícios.

No contexto do Blazor, isso significa que o estado e a lógica relacionados ao estado devem ter suas próprias classes C#, da seguinte maneira:

class State
{
    Player [] players;
    int gameRoundsPlayed;
    bool gameOver;

    State()
    {
        players = new Players[]
        {
            new Player() { Name= "Player", Points = 0 },
            new Player() { Name= "Opponent", Points = 0 }
        };
        gameRoundsPlayed = 0;
        gameOver = false;
    }

    void ResetGame() 
    {
        gameOver = false;
        players[0].Points = 0;
        players[1].Points = 0;
    }

    void EndGame()
    {
        gameOver = true;
        gameRoundsPlayed++;
        // award winner..
    } 
}

A classe State contém informações sobre quem está jogando o jogo, quantas rodadas de jogo já se passaram, se o jogo ainda está ativo, e assim por diante.

Você pode usar uma instância dessa classe State em seus componentes do Blazor para desenhar um tabuleiro e realizar outras ações conforme o jogo avança.

Redefina o estado do jogo em OnInitialized

No Blazor, há um método que é chamado quando o componente está sendo inicializado, antes que algo mais aconteça. Este método é adequado para códigos que colocam o jogo em um estado de "reinicialização", como criar o tabuleiro, os jogadores e redefinir as pontuações de sessões de jogo anteriores, se necessário.

O evento que manipula essa inicialização do componente é chamado de OnInitialized.

Um método OnInitialized que manipula a redefinição do estado do jogo pode ser semelhante a este:

void OnInitialized() 
{
    state.ResetGame();
}

Exatamente o que entra aqui cabe a você, mas esse código deve dar uma ideia.

Manipulando interações do jogador usando eventos

Quando você ou seus oponentes fazem um movimento, você precisa capturar essa interação. Você codifica interações do usuário como eventos aos quais seu jogo/aplicativo deve responder.

Por exemplo, você pode selecionar um botão ou executar um movimento arrastar e soltar para mover uma peça do jogo.

Veja como isso pode parecer no código:

<span title="Click to play a piece" @onclick="() => PlayPiece(0)">🔽</span>

No código acima, o atributo de diretiva @onclick especifica um manipulador para o evento click, ou seja, um usuário selecionou esse elemento. O evento é manipulado pelo código () => PlayPiece(0) que invoca a função PlayPiece(0).

Alterar a velocidade

Uma ação que acontece no jogo deve afetar o estado do jogo. No exemplo anterior em que invocamos PlayPiece(), devemos alterar o estado para dizer que esta parte do tabuleiro agora está ocupada por uma peça. Isso significa que, considerando nosso exemplo de classe State, precisamos de uma maneira de representar as peças do jogo, algo assim:

class State 
{
    // other code omitted
    Piece [] pieces;

    State()
    {
        pieces = new Piece[25]; // 5x5 board
    }

    void PlayPiece(int position)
    {
        pieces[position] = true; // true = occupied
    }
}