Gamelogica

In deze les behandelen we concepten zoals hoe het "Connect Four"-spel werkt en welke constructies van Blazor u moet weten over het produceren van een game.

Verbinding maken met vier

Het idee met het spel "Connect Four" is dat je vier spelstukken in een rij horizontaal, verticaal of diagonaal wilt indelen voordat je tegenstander dat doet. Dingen die je moet overwegen bij het implementeren van dit spel is om je huidige status van spelstukken, je tegenstanders bij te houden en te controleren op een winnaar. Het is handig bij het programmeren om een gamelus te bedenken, een reeks acties die u moet herhalen totdat u een winnaar kunt declareren. Zoiets als dit:

1. Begin met een "reset"-status, dat wil dus een schoon bord zonder spelstukken.
2. Gebruiker plaatst een spelstuk.
3. Tegenstander plaatst een spelstuk.
4. Controleer op winnaar:
   1. Als er een winnaar is, declareert u de winnaar en het eindspel of start u het spel opnieuw.
   2. Als er geen winnaar is, herhaalt u stap 2.

Status in code weergeven

Ten eerste, wat is staat? De speelstand in games is wat er in het spel plaatsvindt, hoeveel punten je hebt, waar je speelstukken staan, enzovoort.

Een belangrijke richtlijn bij het ontwikkelen van games is om de status gescheiden te houden van de gebruikersinterface, omdat het wijzigingen gemakkelijker maakt en uw code gemakkelijker te lezen is onder andere voordelen.

In de context van Blazor betekent dit dat status en logica rond de status een eigen C#-klasse moeten hebben, zoals:

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..
    } 
}

De State klasse bevat informatie over wie het spel speelt, hoeveel wedstrijdrondes er zijn gespeeld, als het spel nog actief is, enzovoort.

U kunt een exemplaar van deze State klasse in uw Blazor-onderdelen gebruiken om een bord te tekenen en andere acties uit te voeren terwijl het spel vordert.

De gamestatus opnieuw instellen in OnInitialized

In Blazor is er een methode die wordt aangeroepen wanneer het onderdeel wordt geïnitialiseerd, voordat er iets anders gebeurt. Deze methode is een goede plek om code te plaatsen waarmee u uw game in een 'reset'-status kunt plaatsen, zoals het maken van het bord, de spelers en het opnieuw instellen van scores indien nodig van vorige gamesessies.

De methode die deze initialisatie van het onderdeel verwerkt, wordt OnInitializedgenoemd.

Een OnInitialized methode die het opnieuw instellen van de gamestatus afhandelt, kan er ongeveer als volgt uitzien:

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

Precies wat hier gebeurt, is aan u, maar deze code moet u een idee geven.

Interactie tussen spelers verwerken met behulp van gebeurtenissen

Als je of je tegenstanders een beweging maken, moet je deze interactie vastleggen. U codeert gebruikersinteracties als gebeurtenissen waarop uw game/app moet reageren.

U kunt bijvoorbeeld een knop selecteren of een sleep-en-neerzet beweging uitvoeren om een spelstuk te verplaatsen.

Dit kan er als volgt uitzien in code:

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

In de bovenstaande code specificeert de @onclick-attribuut een handler voor de click-gebeurtenis, d.w.z. dat een gebruiker dit element heeft geselecteerd. De gebeurtenis wordt verwerkt door de code () => PlayPiece(0) die de functie PlayPiece(0)aanroept.

De status wijzigen

Een actie die in het spel plaatsvindt, moet van invloed zijn op uw gamestatus. In het voorgaande voorbeeld waarin we PlayPiece()oproepen, moeten we de status wijzigen zodat dit deel van het bord nu door een stuk wordt bezet. Dat betekent dat we, gezien ons voorbeeld State klasse, een manier nodig hebben om spelstukken te vertegenwoordigen, ongeveer als volgt:

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

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

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