Witaj! Dzisiaj stworzymy obiekty 3D jak na trójwymiarowy świat przystało. Zrobimy to przez dodanie lewej, tylniej i prawej ściany do naszego trójkąta - zmieni się on w piramidę. Dodamy też kilka ścienek do naszego kwadracika, który po dzisiejszej lekcji objawi się jako sześcian.

Kolory na ścianach piramidy będą gładko cieniowane (ang. smoothly colored), a ściany sześcianu pomalujemy każdą na inny kolor. Do dzieła!

Wielu z was skorzystało z kodu z poprzedniej lekcji i na własną rękę stworzyło trójwymiarowe obiekty. Zostałem zapytany 'dlaczego mój obiekt nie obraca się wokół własnej osi? Wygląda jakby obracał się wokół ekranu...'. Żeby obiekt obracał się wokół własnej osi musi zostać tak właśnie zaprojektowany. Powinieneś pamiętać, że środek obiektu musi być w punkcie (0,0,0).

Poniższy kod stworzy piramidkę wokół centralnej osi. Góra piramidy jest o jeden wyżej od środka, dół o jeden niżej od środka. Górny wierzchołek jest dokładnie na środku, a dolne są na lewo i na prawo od środka.

Zauważ, że wszystkie trójkąty zostały narysowane w kierunku przeciwnym do ruchu wskazówek zegara (counterclockwise). To bardzo istotne i zostanie wyjaśnone na przyszłych lekcjach. Teraz powinieneś zapamiętać, że obiekty powinny być tworzone zgodnie z ruchem wskazówek zegara (clockwise) albo przeciwnie do ich ruchu (counterclockwise) - nie powinieneś ich mieszać jeśli nie musisz.

Zaczynamy od narysowania przedniej ściany. Ponieważ wszystkie ściany (ang. face) współdzielą górny wierzchołek, pomalujemy go na czerwono we wszystkich trójkątach. Kolory dwóch dolnych punktów, będą występowały naprzemiennie. Lewy wirzchołek przedniej ściany pomalujemy na zielono, a prawy na niebiesko. Wtedy trójkąt po prawej stronie będzie musiał mieć niebieski wierzchołek po lewej, a zielony po swojej prawej stronie. Przez naprzemienne stosowanie dwóch kolorów na dole każdej ściany, tworzymy podobnie pomalowane punkty na każdej ze ścian.

Teraz rysujemy prawą ścianę. Zauważ, że obydwa dolne punkty są rysowane jeden w prawo od środka, górny jeden w górę na osi Y, a prawy pośrodku osi X. Powstaje zbocze od środka u góry do prawej strony ekranu na dole.

Zauważ, że lewy punkt jest rysowany na niebiesko. Robiąc tak, nadajemy mu ten sam kolor, co prawemu dolnemu ze ściany przedniej.

Zauważ jak pozostałe trzy ściany zostały włączone do tego samego glBegin(GL_TRIANGLES) i glEnd() co pierwsza ściana. Jako, że tworzymy cało obiekt z trójkątów, OpenGL będzie wiedział, że każde trzy kolejne wierzchołki mają stworzyć kolejny trójkąt. Jeżeli podamy cztwry punkty, to OpenGL narysuje trójkąt z pierwszych trzech, a czwarty zacznie nowy trójkąt. Nie powstanie czworokąt! Upewnij się że nie dodajesz żadnych dodatkowych punktów przez przypadek.

Teraz dla tylnej ściany. Kolory ponownie się zamieniają. Lewy punkt jest teraz zielony, bo narożnik, który dzieli z prawą ścianą jest zielony.

W końcu rysujemy lewą ścianę. Kolory zamieniają się poraz ostatni. Lewy punkt jest niebieski i miesza się z prawym punktem tylnej ściany. Prawy punkt jest zielony i miesza się z lewym punktem przedniej ściany

Skończyliśmy rysowanie piramidy. Jako, że obraca się tylko wokół osi Y, to nigdy nie zobaczymy jej spodu, więc nie ma potrzeby go rysować. Jeżeli chcesz poeksperymentować, spróbuj dodać spód używając czworokąta, następnie obróć piramidę wokół osi X, żeby zobaczyć czy zrobiłeś to poprawnie. Upewnij się, że kolory użyte na spodnim czworokącie pasują do kolorów na rogach piramidy.

Teraz zajmiemy się sześcianem. Jest zrobiona z sześciu czworokątów. Wszystkie są rysowane przeciwnie do ruchu wskazówek zegara (counterclockwise). Co znaczy: pierwszym punktem jest prawy górny, drugim lewy górny, trzecim lewy dolny, czwartym prawy dolny. Kiedy rysujemy tylną ścianę, może wydawać się że rysujemy zgodnie z ruchem wskazówek zegara, ale musimy pamiętać, że jesteśmy za sześcianem i patrzymy przed siebie. Lewa strona sześcianu jest wtedy po prawej stronie ekranu, a prawa po lewej.

Zauważ, że przesuwamy sześcian trochę dalej w ekran. Robiąc tak, rozmiar sześcianu jest podobny do rozmiaru piramidy. Gdybyśmy przesunęli tylko 6 jednostek w ekran, sześcian byłby większy od piramidy, a jego części mogły by nie mieścić się na ekranie. Pobaw się tymi parametrami i zobacz jak będzie się zmieniał rozmiar sześcianu - im dalej tym obiekt mniejszy, bo tak działa perspektywa.

Zaczniemy od narysowania góry sześcianu. Przesuwamy o jedną jednostkę w górę od środka sześcianu. Najpierw rysujemy prawy górny punkt - jedna jednostka w prawo i jedna w ekran. Drugi punkt przesuniemy o jedną jednostką w lewo i jedną w ekran. Teraz musimy narysować spód czworokąta w kierunku widza. Zamiast iść w ekran przesuwamy się jednostkę do ekranu. Czy to ma sens?

Spód jest rysowany dokładnie w ten sam sposób, ale jedną jednostkę w dół od środka sześcianu. Zauważ, że oś Y jest zawsze minus jeden. Gdybyśmy byli pod sześcianem i patrzyli na jego dolną ścianę, zauważylibyśmy, że prawy górny narożnik jest bliżej widza, więc zamiast rysować w oddali, rysujemy najpierw bliżej widza, potem po lewej stronie bliżej widza, a następnie "idziemy" w ekran i rysujemy dwa dolne punkty.

Jeżeli nie dbasz o kolejność (clockwise czy counterclockwise) rysowania wielokątów (ang. polygon), poprostu skopiuj ten sam kod co dla ściany górnej, przesuń w dół i będzie OK! Ale uważaj, ignorując kolejność rysowania ujrzysz dziwny wynik po np. oteksturowaniu.

Teraz rysujemy przód czworokąta. Przesuwamy się jednostkę do ekranu. Zauważ, że oś Z ma teraz zawsze wartość 1. W piramidzie nie zawsze było to 1. Na górze oś Z była równa 0. Jeśli zmniejszysz tę wartość to zobaczysz, że czworokąt przesuwa się "w ekran" (oddala się). Narazie jednak tego nie chcemy.

Tylna ściana jest takim samym czworokątem jak przednia tylko jest dalej - wartość -1 na osi Z.

Jeszcze tylko dwa czworokąty i gotowe! Jak zwykle zauważysz, że jedna z osi ma tą samą wartość dla wszystkich wierzchołków.

Oto ostatnia ściana. Oś X jest zawsze równa 1. Kolejność rysowania counterclockwise. Gdybyś miał ochotę, możesz nie rysować tej ściany i otrzymasz pudełko :)

Albo jeśli chcesz poeksperymentować, to zawsze możesz spróbować zmienić kolor każdego punktu, żeby sześcian wyglądał podobnie do piramidy. Możesz zobaczyć przykład wymieszanego sześcianu ściągając pierwsze demo Evil'a z mojej strony. Uruchom je i naciśnij TAB. Zobaczysz pięknie pokolorowany sześcian.

Teraz powinieneś lepiej zrozumieć sposób tworzenie obiektów w przestrzeni 3D. Musisz myśleć o przestrzeni jak o gigantycznej kartce papieru z wieloma przezroczystymi warstwami za nią. Jeżeli umiesz zwizualizować głębię na ekranie, nie powienineś mieć żadnych problemów z projektowaniem nowych obiektów 3D.

Jeżeli miałeś problemy ze zrozumieniem trójwymiarowej przestrzeni, nie przejmuj się. Początki bywają trudne. Obiekt typu sześcian jest bardzo dobrym przykładem do nauki. Zauważ że tylna ściana jest rysowana tak samo jak przednia - tylko że jest dalej. Pobaw się kodem. Jeżeli ci nie idzie, napisz od mnie. Postaram się odpowiedzieś na twoje pytania.