Heute möchte ich euch einmal zeigen, wie man sehr leicht PNG-Bilddateien in seinem Spiel verwenden kann. Als Sprache wird C++ verwendet, mit dem geladenen Bild kann man dann machen, was man will (OpenGL oder DX Textur und so weiter).
Warum PNG? Nun PNG ist ein weit verbreitetes Format, um Rastergrafiken (solche die aus einzelnen Pixel bestehen) komprimiert abspeichern zu können. Im Gegensatz zum ebenfalls weit verbreiteten JPEG-Formats ist PNG aber absolut verlustfrei. Außerdem kann es einen Alphawert speichern, was bei 2D Spielen und auch in vielen Situationen bei 3D Spielens sehr wichtig ist.
Zum Laden von PNG-Dateien gibt es eine Referenz Bibliothek, names libpng. Diese ist allerdings ein ziemlich Klotz und will erst einmal verstanden werden. In diesem Tutorial benutze ich aber nicht libpng, sondern picopng.
PicoPNG ist eine sehr kompakte Bibliothek. Obwohl Bibliothek eigentlich das falsche Wort ist, es handelt sich nur um eine einzige C++ Funktion. Das schöne an ihr ist, das keine externen Abhängigkeiten wie libpng oder zlib (PNG benutzt zlib zur Kompression) benötigt werden. Man hat in einer einzigen Funktion alles was man benötigt! Daher ist diese „Bibliothek“ auch so enorm klein, der gesamte Quelltext hat nur 33 kb (kompiliert dementsprechend noch kleiner).
Netterweise steht das ganze unter einer sehr liberalen OpenSource Lizenz, man kann damit so gut wie alles machen (benutzen, verbreiten, verändern, verkaufen, usw.).
Diese eine „magische“ Funktion heißt decodePNG. Sie erwartet einen Zeiger auf die PNG-Daten und liefert ein std::vector mit dem geladenen 32 Bit Bild. Daher müssen wir selber erst die Bilddatei in unseren Speicher laden und diesen dann decodePNG übergeben. Das hat den Vorteil, dass man nicht nur echte Dateien laden kann, sondern die Bilder auch aus einem Archiv oder aus einer Ressource oder direkt aus dem Internet geladen speichern kann. Fangen wir also an:
Als erstes laden wir PicoPNG runter. Zu finden ist das ganze unter:
http://members.gamedev.net/lode/projects/LodePNG/
Nun fügen wir unserem Projekt die picopng.cpp unserem Projekt hinzu. Die Mainfunktion, die sich ganz am Ende der Datei befindet, wird gelöscht oder auskommentiert, sie dient nur als Beispiel. Zusätzlich sollte man noch eine picopng.h anlegen, in der man den Prototypen der decodePNG schreibt.
Nun benutzen wir decodePNG um eine OpenGL Textur zu erstellen:
|
C-/C++-Quelltext
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
|
GLuint LoadPNG(std::string Filename)
{
std::ifstream File;
File.open(Filename.c_str(), std::ios::in | std::ios::binary);
File.seekg(0, std::ios::end);//zum ende der datei springen
int FileLength=File.tellg();
File.seekg(0, std::ios::beg);
std::vector<unsigned char> Buffer, Image;
Buffer.resize(FileLength);
File.read((char*)(&Buffer[0]), FileLength);
File.close();
unsigned long XSize=0, YSize=0;
decodePNG(Image, XSize, YSize, &Buffer[0], (unsigned long)Buffer.size());
//jetzt die Textur erstellen
GLuint NewTexture;
glGenTextures(1, &NewTexture);
glBindTexture(GL_TEXTURE_2D, NewTexture);
glTexImage2D(GL_TEXTURE_2D, 0, 4, XSize, YSize, 0, GL_RGBA, GL_UNSIGNED_BYTE, &Image[0]);
return NewTexture;
}
|
Und das wars auch schon
Wie man sieht, wird keinerlei Fehlerkontrolle vorgenommen, das sollte natürlich nicht so bleiben. So und jetzt noch ein paar Erläuterungen, was dieser Code den so macht:
Zuerst wird die Bilddatei geöffnet, und zwar im Binarymode. Das ist wichtig, da es sonst zu kleinen, aber schwerwiegenden Fehlern kommen kann. Dann springen wir zum Ende der Datei (seekg) hohlen uns die Adresse des Lesezeigers (tellg) und speichern diese. Den genau das ist ja unsere Dateigröße. Anschließend springen wir wieder zurück zum Anfang. Nun werden 2 Buffer angelegt, einen für die Rohdaten, und einen für das decodierte Bild. Wir lesen also die gesamte Datei (mit read) in den Buffer, und schließen sie anschließend wieder.
Die decodePNG erwartet 3 Referenzen, nämlich auf den Vector für das fertige Bild, und auf 2 Variablen, in denen später die Bildgröße stehen wird. Das Format ist beim laden immer RGBA, also muss uns das decodePNG nicht mehr mitteilen. Wir erstellen also die 2 Variablen um die Größe zu speichern, und rufen decodePNG auf. Der vierte Parameter ist der Zeiger auf die Rohdaten, der fünfte die Größe.
Jetzt haben wir also die fertige PNG Datei in unserem Speicher und können damit machen, was wir wollen. Ich habe hier mal eine einfache OpenGL Textur erstellt, aber mit wenig mehr Aufwand ließe sich auch eine D3D Textur oder ein Ddraw Surface erzeugen. Daher gehe ich hier auch nicht näher auf die erstellung der OpenGL Textur ein, sämtliche Funktionen sind ja im Internet ausreichend dokumentiert.
So und nun viel Spaß beim Laden von PNG Dateien!
PS: Ich weiß selber, dass es keine tolle Leistung ist, ein Tutorial über eine einzige Funktion zu schreiben. Ich hoffe lediglich ein paar Leuten zeigen zu können, wie schnell und einfach mal PNG-Dateien laden kann, ohne gleich Tonnen an fremden Code mitschleppen zu müssen.
Zitat von »"Jonathan_Klein"«
Hast du Texturen aktiviert? Wurde die Textur korrekt geladen?
;
19.04.2024, 21:22
Zum Seitenanfang
