NeHe PL :: Lekcja 3

Lekcja 3. Dodawnie koloru
Autor: Maksymilian 'MaxBog' Boguń
Oryginał: Adding Color (Jeff 'NeHe' Molofee)
Źródła: http://nehe.gamedev.net/data/lessons/vc/lesson03.zip

W ostatniej lekcji nauczyłem Cię jak wyświetlać na ekranie Trójkąty (ang. Triangles) i czworokąty (ang. Quads) . W tej lekcji nauczę Cię jak pokolorować trójkąt i czworokąt na 2 różne sposoby. Dzięki cieniowaniu płaskiemu (ang. Flat coloring) czworokąt będzie miał jednolity kolor. Cieniowanie gładkie (ang. Smooth coloring) wymiesza 3 kolory ustawione dla każdego punktu (wierzchołka) trójkąta, tworząc ładną mieszankę kolorów.

Używając kodu z ostatniej lekcji, będziemy tylko zmieniać funkcję DrawGLScene. Przepiszę całą funkcję poniżej, więc jeśli chcesz zmienić kod z ostatniej lekcji, możesz zastąpić funkcję DrawGLScene kodem zaprezentowanym poniżej, lub po prostu dodawać do niej to czego nie było w ostatniej lekcji.

int DrawGLScene(GLvoid)         // Tu wszystko rysujemy
{
    glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);         // Wyczyść bufor ekranu i głębokości
    glLoadIdentity();         // Zresetuj aktualną macierz widoku modelu (ang. Modelview Matrix)
    glTranslatef(-1.5f,0.0f,-6.0f);         // Przesuń w lewo o 1.5 jednostki, a potem 6 jednostek w głąb ekranu
    glBegin(GL_TRIANGLES);         // Rozpocznij rysowanie trójkątów

Jeśli pamiętasz ostatnią lekcję, to jest część kodu odpowiedzialna za rysowanie trójkąta na lewej połówce ekranu. W następnej linii po raz pierwszy użyjemy funkcji glColor3f(r, g, b). Trzy parametry w nawiasie to natężenie kolorów: czerwonego (red), zielonego (green) i niebieskiego (blue). Mogą one przyjmować wartości od 0.0f do 1.0f. Działa to tak samo jak wartości kolorów, których użyliśmy do wyczyszczenie tła ekranu.

Ustawiamy kolor na czerwony (pełne natężenie czerwonego , brak zielonego i niebieskiego). W następnej linii kodu tworzymy wierzchołek (góra trójkąta), który zostanie narysowany w aktualnym kolorze tj. czerwonym. Wszystko co będziemy rysować od tej chwili będzie czerwone aż zmienimy kolor na inny.

glColor3f(1.0f,0.0f,0.0f); // Ustaw kolor na czerwony
glVertex3f( 0.0f, 1.0f, 0.0f); // Przenieś o jedną jednostkę w górę od środka (Górny ponkt)

Ustawiliśmy pierwszy wierzchołek (w kolorze czerwonym) na ekranie. Teraz, zanim narysujemy drugi, zmienimy kolor na zielony. Dzięki temu drugi wierzchołek, który jest w lewym rogu trójkąta będzie ustawiony na kolor zielony.

glColor3f(0.0f,1.0f,0.0f); // Ustaw kolor na zielony
glVertex3f(-1.0f,-1.0f, 0.0f); // W lewo i w dół o jedną jednostkę(Dolny lewy punkt)

Teraz jesteśmy przy trzecim i ostatnim wierzchołku. Zaraz zanim go narysujemy, ustawiamy kolor na niebieski. To będzie prawy dolny wierzchołek trójkąta. Jak tylko glEnd() zostanie wywołane, wielokąt zostanie wypełniony. Ale ponieważ ma on inny kolor dla każdego z wierzchołków, raczej niż jednolity kolor, zostanie on rozproszony od każdego z wierzchołków, w końcu spotykając się na środku, gdzie kolory się wymieszają. To jest cieniownie gładkie.

        glColor3f(0.0f,0.0f,1.0f);         // Ustaw kolor na niebieski
        glVertex3f( 1.0f,-1.0f, 0.0f);         // Wprawo i w dół po jednej jednostce (Prawy dolny wierzchołek)
    glEnd();         // Zakończone rysowanie trójkątów
    glTranslatef(3.0f,0.0f,0.0f);         // Od prawego punktu rusz się 3 jednostki w prawo

Teraz narysujemy prostokąt o jednolitym kolorze. Ważne jest aby zapamiętać, że wszystko rysowane po ustawieniu koloru, będzie miało ten kolor. Każdy projekt, który stworzysz, będzie używał kolorowania w ten, czy inny sposób . Nawet w scenach, gdzie wszystko jest mapowane teksturami, glColor3f() wciąż może być użyty by zmienić odcień tekstury itp. Więcej o tym w późniejszych lekcjach.

Więc by narysować kwadrat w jednym kolorze, wszystko co musimy zrobić to ustawić kolor raz na taki jaki chcemy (w tym przykładzie niebieski), i wtedy narysować prostokąt. Kolor niebieski zostanie użyty dla każdego wierzchołka, ponieważ nie mówimy OpenGL aby zmieniał kolor dla każdego wierzchołka. Ostateczny rezultat to? jednolity niebieski kwadrat. Znowu kwadrat (czworokąt) jest rysowany zgodnie z ruchem wskazówek zegara, co znaczy, że zaczynamy patrząc na tył czworoboka.

    glColor3f(0.5f,0.5f,1.0f);         // Ustaw kolor na niebieski
    glBegin(GL_QUADS);         // Rozpocznij rysowanie czworokątów
        glVertex3f(-1.0f, 1.0f, 0.0f);         // W górę i w lewo o 1 jednostkę (Lewy górny wierzchołek)
        glVertex3f( 1.0f, 1.0f, 0.0f);         // W górę i w prawo o 1 jednostkę (Prawy górny wierzchołek)
        glVertex3f( 1.0f,-1.0f, 0.0f);         // W dół i w prawo o 1 jednostkę (Prawy dolny wierzchołek)
        glVertex3f(-1.0f,-1.0f, 0.0f);         // W dół i w lewo o 1 jednostkę (Lewy dolny wierzchołek)
    glEnd();         // Zakończone rysowanie czworokątów
    return TRUE;         // Idź dalej
}

W końcu modyfikujemy kod odpowiedzialny za zmianę wyświetlania w oknie/na pełnym ekranie, tak, że napis na pasku tytułowym jest prawidłowy.

            if (keys[VK_F1])         // Czy F1 jest naciśnięte?
            {
                keys[VK_F1]=FALSE;         // Jeśli tak, ustaw ten przycisk na FALSE
                KillGLWindow();         // Zniszcz aktualne okno
                fullscreen=!fullscreen;         // Przełącz na okno/ pełny ekran
        // Stwórz nowe okno OpenGL ( ZMODYFIKOWANE )
                if (!CreateGLWindow("Lekcja NeHe o kolorach",640,480,16,fullscreen))
                {
                    return 0;         // Wyjdź, jeśli okno nie zostało stworzone
                }
            }

W tej lekcji próbowałem wyjaśnić w jak najdrobniejszych detalach, jak dodać płaskie lub gładkie cieniowanie do twoich wieloboków. Pobaw się trochę z kodem, spróbuj zmieniać wartości koloru czerwonego, zielonego i niebieskiego. Zobacz jakie kolory potrafisz stworzyć. Jeśli masz jakieś pytania lub uwagi, wyślij mi e-maila. Jeśli czujesz, że coś źle skomentowałem, lub kod mógłby być lepszy w niektórych miejscach, daj mi o tym znać. Chcę tworzyć najlepsze lekcje OpenGL jakie potrafię. Jestem zainteresowany twoim wsparciem.