Logika gry

Ukończone

W tej lekcji omówimy koncepcje, takie jak jak działa gra "Połączenie Four" i jakie konstrukcje Blazor musisz wiedzieć o tworzeniu gry.

Połączenie cztery

Pomysł z gry "Połączenie Four" jest dla Ciebie, aby ułożyć cztery kawałki gry w rzędzie poziomo, pionowo lub ukośnie przed przeciwnikiem. Kwestie, które należy wziąć pod uwagę podczas implementowania tej gry, to śledzenie bieżącego stanu elementów gry, przeciwników i sprawdzenie zwycięzcy. Jest to przydatne podczas programowania, aby myśleć o pętli gry, zestaw akcji, które należy powtórzyć, dopóki nie będzie można zadeklarować zwycięzcy. Coś takiego:

  1. Zacznij od stanu "reset", tj. czystej tablicy bez kawałków gry.
  2. Użytkownik umieszcza kawałek gry.
  3. Przeciwnik umieszcza kawałek gry.
  4. Sprawdź zwycięzcę:
    1. Jeśli jest zwycięzca, zadeklaruj zwycięzcę i koniec gry lub uruchom ponownie grę.
    2. Jeśli nie zwycięzca, powtórz krok 2.

Reprezentowanie stanu w kodzie

Po pierwsze, co to jest stan? State in games is what's place in the game, how many points you have, where your game places are placed, and so on.

Ważne wskazówki, jeśli chodzi o stan w tworzeniu gier, to zachowanie stanu oddzielonego od interfejsu użytkownika, ponieważ ułatwia modyfikowanie, a kod jest łatwiejszy do odczytania między innymi korzyściami.

W kontekście platformy Blazor oznacza to, że stan i logika wokół stanu powinny znajdować się we własnej klasie języka C#, w następujący sposób:

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

Klasa State zawiera informacje o tym, kto gra w grę, ile rund gry zostało rozegranych, jeśli gra jest nadal aktywna i tak dalej.

Możesz użyć wystąpienia tej State klasy w składnikach platformy Blazor, aby narysować tablicę i wykonać inne akcje w miarę postępu gry.

Resetuj stan gry w OnInitialized

W środowisku Blazor istnieje metoda, która jest wywoływana, gdy składnik jest inicjowany, zanim cokolwiek innego się stanie. Ta metoda jest dobrym miejscem, aby umieścić kod, który pomaga umieścić grę w stanie "reset", takich jak tworzenie tablicy, graczy i resetowanie wszelkich wyników w razie potrzeby z poprzednich sesji gry.

Metoda, która obsługuje tę inicjację składnika, nosi nazwę OnInitialized.

OnInitialized Metoda, która obsługuje resetowanie stanu gry, może wyglądać mniej więcej tak:

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

Dokładnie to, co dzieje się tutaj, to do Ciebie, ale ten kod powinien dać Ci pomysł.

Obsługa interakcji odtwarzacza przy użyciu zdarzeń

Gdy ty lub przeciwnicy przeniosą się, musisz uchwycić tę interakcję. Zakodujesz interakcje użytkowników jako zdarzenia, na które powinna odpowiadać twoja gra/aplikacja.

Możesz na przykład wybrać przycisk lub wykonać ruch przeciągania n upuszczania, aby przenieść element gry.

Oto, jak to może wyglądać w kodzie:

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

W powyższym kodzie @onclick atrybut dyrektywy określa procedurę obsługi zdarzenia click , tj. użytkownik wybrał ten element. Zdarzenie jest obsługiwane przez kod () => PlayPiece(0) , który wywołuje funkcję PlayPiece(0).

Zmienianie stanu

Akcja wykonywana w grze powinna mieć wpływ na stan gry. W poprzednim przykładzie, w którym wywołujemy PlayPiece()metodę , należy zmienić stan, aby powiedzieć, że ten fragment tablicy jest teraz zajęty przez element. Oznacza to, że biorąc pod uwagę naszą przykładową State klasę, potrzebujemy sposobu reprezentowania elementów gry w następujący sposób:

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

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

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