GLFontRenderer
1.0.0
Mit diesem Code können Sie Hochleistungstext in Ihrer eigenen OpenGL -Anwendung rendern. Die Schriftrenderbibliothek wurde mühelos konzipiert und leistet die Leistung. Ich habe es in ~ 2010 geschrieben und ab und zu aktualisiert. Die in dieser Bibliothek gelesenen Schriftart Dateien folgen dem für den BM -Schriftgenerator entwickelten Format: http://angelcode.com/products/bmfont/. Die Schriftart Datei wird von einer Texturdatei begleitet. Die Bibliothek unterstützt Standard -RGBA -Texturen sowie SDF -Single -Kanal -SDF und sogar Multi -Kanal -SDFs.
Bleiben Sie dran.
Die Schriftbibliothek ist in die folgenden Dateien unterteilt:
Mit dem Draw -String -Funktionsaufruf folgt Folgendes: Empfängt String → Parse String → Erstellt die Liste der Quads → Übersetzen in ein Scheitelpunktpufferarray -> Zeichnet alle strukturierten Dreiecke. Während der Analyse wird die zum Zeichnen zu zeichnen nach Zeichen überprüft, die von der aktuellen Schriftart nicht zeichnen können. Für jedes Zeichen in der Zeichenfolge wird ein Quad erstellt und zur endgültigen Quad-Liste hinzugefügt. Dieses Quad enthält Informationen über die Position und Größe auf dem Bildschirm (2D, orthogonal!) Und die Texturkoordinate für diesen einen Zeichen innerhalb der Bitmap-Schriftart. Die Position eines Quad hängt von der Ausgangsposition der Saite und der Position des vorherigen Zeichens ab. Die spezifische Beziehung zwischen dem Abstand eines Charakters und dem nächsten wird als Kerning bezeichnet. Die Schriftart -Konfigurationsdatei enthält eine Tabelle mit allen Kerning -Informationen für diese bestimmte Schriftart. ZB es könnte sein, dass ein „a“ einem „M“ ein Pixel voneinander entfernt sein muss. Wenn jedoch ein „O“ einem „M“ folgt, ist es minus ein Pixel oder keine Pixel. Diese Informationen werden intern in einem zweidimensionalen Array zum schnellen Zugriff gespeichert. Um diese Zeichnung schnell genug zu machen, werden alle Informationen zu den Zeichen und Charakterbeziehungen (wie Kerning) sowie die Texturen auf dem Programm gestartet. Die Texte können so gespeichert werden, dass Vertex -Puffer nicht für jede Render -Schleifen -Iteration erstellt werden müssen.
Der einfachste Weg, um zu überprüfen, wie die Bibliothek funktioniert und wie Sie sie in Ihrem Projekt verwenden können, ist die Überprüfung der mit diesem Repo gelieferten Beispielimplementierung. Für den Fall, dass Sie jedoch weitere Informationen benötigen, lesen Sie bitte den Rest dieses Kapitels.
Sie müssen die 10 in der Übersicht genannten Dateien in Ihren Projektordner kopieren.
Erstellen Sie in Ihrem Code ein globales Schriftartbibliotheksobjekt, bevor Sie einen Rendering -Kontext eröffnen, wie dies:
// load openGL fonts
m_fontLibrary = new CFontLibrary(<PathToFontFolder>);
if (!m_fontLibrary-> ParseAllFontsInFolder ())
return; // no fonts found!Dadurch wird alle Schriftarten geladen, die im Ordner gespeichert sind, den Sie als Eingabeparameter angegeben haben. Nachdem der Rendering -Kontext erstellt wurde, müssen die Texturen wie SO geladen werden:
// init font library from the current rendering context!
theApp.m_fontLibrary-> InitGLFonts ();Dies kann beispielsweise in einer einmaligen Init -Funktion dieses Render -Kontextes erfolgen. Denken Sie daran, dass Sie Texturen nicht zwischen zwei oder mehr Kontexten mit dieser Bibliothek teilen können (ich habe sie nicht implementiert, da es zu dem Zeitpunkt keine effiziente Möglichkeit gab, dies zu tun, nur einige NVIDIA -Karten konnten und nur irgendwie). Sie müssen dies also für jeden neuen Rendering -Kontext nennen. Sobald dies erledigt ist, ist die Schriftbibliothek verwendet, sodass Sie die Methode Drawstring () aus dem Fontlibrary -Objekt aufrufen können.
(Hinweis: Dieses Kapitel benötigt eine Überholung. Es ist nur ungefähr korrekt, einige Funktionsparameter fehlen, aber meistens selbsterklärend.
void DrawString ( const std::string& textToDraw, int x, int y, float color[ 4 ], const std::string& font, float scale = 1 . 0f );Die Parameter sind nachstehend in der Tabelle beschrieben.
| Parameter | Beschreibung |
|---|---|
| const std :: string & textTodraw | Die Zeichenfolge, die als std :: string zeichnet, werden keine erkannten Zeichen als '?' Gezeichnet. Welche Zeichen gültig sind, hängt von der verwendeten Schriftart ab und kann beim Erstellen der Schriftart-Bitmap definiert werden. |
| int x | X-Position des Beginns der Zeichenfolge in Bildschirmkoordinaten. 0 - Breite |
| int y | Y-Position des Beginns der Zeichenfolge in Bildschirmkoordinaten. 0 - Höhe |
| Float Color [4] | Float -Array, das die Farbinformationen enthält, mit denen die Textur moduliert wird. Farbinformationen sind Werte von 0,0 bis 1,0 (inklusive), in der folgenden Standardreihenfolge: {r, g, b, alpha} offensichtlich .. |
| const std :: string & font | Dieser Parameter definiert den zu verwendenden Schriftart. Es können nur Schriftarten verwendet werden, die sich im Ordner befinden und zur Ladezeit dort waren. Sie können den Dateinamen dieser Schriftart ohne Erweiterung oder für mehr Code -Lesbarkeit und -sicherheit übergeben. Verwenden Sie das Define aus der Datei: fontlibrary.h. Hinweis: Wenn Sie fett oder kursiv drucken möchten, müssen Sie eine Schriftart verwenden, die dazu eingerichtet ist. |
| Float -Skala | Für RGBA -Texturen wird dringend empfohlen, die Standardeinstellung zu verwenden: 1.0f. Sie können nach oben oder unten skalieren, aber es sollte klar sein, dass dies zu Unschärfe führt. Mit SDF und MSDF sollten Sie jedoch in der Lage sein, weiter nach oben und unten zu skalieren, bevor Sie Artefakte sehen. |
Beachten Sie, dass es mehr Funktionen mit zusätzlichen Funktionen gibt, z. B. automatische Linienbrüche. Siehe Header -Datei der Schriftbibliothek. Beachten Sie auch, dass die zu zeichnen von String nach 10922 Zeichen abgeschnitten wird. Wenn Sie aus irgendeinem seltsamen Grund mehr Zeichen benötigen, verwenden Sie einfach zusätzliche Ziehaufrufe und teilen Sie die Zeichenfolge in Teile auf.
Dieses Kapitel befasst sich mit dem Hinzufügen Ihrer eigenen Schriftarten in die Schriftbibliothek.
Beachten Sie, dass ich hier auf Nicht-SDF-Schriftarten konzentriere. Die Schritte für SDF-Schriftarten sind ziemlich ähnlich, aber BM-Font-Gen reicht nicht aus. Sie können dieses Tool weiterhin verwenden, müssen jedoch einen Postverarbeitungsschritt mit Tools wie Imagemagick durchführen. Tutorial unten.
Um eine neue Schriftart zu integrieren, sind nur drei Schritte erforderlich: 1. Erstellen Sie die Schriftkonfiguration und die Schriftart-Bitmap mit BM-FONT-Generator 2. Kopieren Sie die beiden resultierenden Dateien in Ihren Schriftartenordner.
Im folgenden Abschnitt wird die Verwendung des BM-FONT-Generators ausführlich beschrieben, aber zunächst einige Notizen. Jedes von Ihnen produzierte Schriftart enthält nur eine Schriftart einer festen Größe. Außerdem wird sie bereits durch die Datei definiert, unabhängig davon, ob sie fett oder kursiv sind usw. Dieselben Zählungen für Umriss, Glätte der Schrift usw. Diese Angelegenheit wird mit dem folgenden Abschnitt klarer.
Für die Erzeugung der Schriftkonfiguration sowie die tatsächliche Schriftart-Bitmap verwende ich den "Bitmap-Schriftgenerator" von AngelCode. Dies kann von ihrer Website erhalten werden: http://angelcode.com/products/bmfont/ Nach der Installation öffnen Sie das Programm, es sollte wie in der folgenden Abbildung aussehen.
Öffnen Sie als erster Schritt die Schriftstellungen, indem Sie auf Optionen → Schrifteinstellungen klicken oder [F] klicken, die ein neues Fenster öffnen, wie in der nächsten Abbildung gezeigt.
Nachdem Sie diese Setups erstellt haben, schließen Sie das Fenster der Schrifteinstellungen und fahren Sie mit dem nächsten Schritt fort.
Zurück im Hauptfenster des Programms können Sie jetzt die Zeichensätze auswählen, die Sie einschließen möchten. Sie können entweder vollständige Sets auswählen oder nur bestimmte Zeichen eines Satzes auswählen. Als Beispiel siehe nächste Abbildung.
Wählen Sie als grundlegende Regel nur die Zeichen aus, die Sie wahrscheinlich verwenden. Dies spart die Verarbeitungszeit und vor allem Speicher, nicht nur einen Zeichen, sondern vieles mehr (Kerning, Bitmap -Größe, Arraygrößen in unserem Code usw.). Nachdem Sie alle Zeichen ausgewählt haben, die Ihre Schriftart enthalten muss, fahren Sie mit dem nächsten Abschnitt fort.
Es ist jetzt an der Zeit, die Schrift als Bitmap und eine Konfigurationsdatei für sie zu exportieren. Öffnen Sie die Exportoptionen, die entweder [t] oder auf Optionen klicken → Exportoptionen. Ein neues Fenster sollte auftauchen und sehen wie in der folgenden Abbildung aus.
Sobald diese Einstellungen abgeschlossen sind, schließen Sie das Fenster und fahren Sie mit dem nächsten Schritt fort.
Um sicherzustellen, dass Ihre Textur weder zu groß noch zu klein ist, drücken Sie [v] im Hauptfenster oder klicken Sie auf Optionen → Visualisieren. Wenn der Fenstertitel etwas anderes als „Vorschau 1/1“ sagt, ist Ihre Textur für alle Ihre Charaktere zu klein und das Programm würde mehr als eine Bitmap erzeugen. Öffnen Sie in diesem Fall die Exportoptionen und erhöhen Sie Ihre Texturgröße. Hinweis: Es muss nicht mehr quadratisch oder eine Kraft von zwei Personen mehr sein, dies war nur in OpenGL Version 1, der Fall. Ich würde es jedoch immer noch empfehlen, es als solche zu schaffen, da einige texturbezogene Funktionen für sie möglicherweise noch optimiert werden. Die Schriftribrary behandelt absichtlich nicht mehr als eine „Seite“ oder eine Textur, da dies bedeutet, die Textur während eines Zeichnungsstrichs zu binden/zu entbinden, der langsam ist! Machen Sie also genau eine Seite. Wenn Sie andererseits sehen, dass die Zeichen nur einen Teil der Bitmap füllen, reduzieren Sie die Texturgröße nach Möglichkeit, dies ist jedoch nicht so wichtig wie umgekehrt. Sobald Sie mit der Verwendung von Texturraum zufrieden sind, fahren Sie mit dem nächsten Schritt fort.
Jetzt, da alle Einstellungen vorgenommen werden, ist es Zeit, die Schriftart zu exportieren. Klicken Sie auf Optionen → Bitmap-FONT AS .. Der hier angegebene Dateiname wirkt sich auf den Namen für die Schriftart in der Schriftbibliothek aus. Wählen Sie ihn daher mit Bedacht aus. Aus Gründen der Bequemlichkeits- und Lesbarkeitsgründe schlage ich die folgende Namenskonvention vor:
< italic? > <BOLD> <_ umrissen? Größe?>
Hier sind einige Beispiele:
Klicken Sie auf Save, um den Prozess abzuschließen. Jetzt gibt es nur noch, die beiden Dateien für diese Schriftart in den Schriftfeld Ihrer Software zu kopieren. Sie können die TGA mit einem anderen Tool in PNG konvertieren. Denken Sie einfach daran, die Dateierweiterung in der FNT -Datei korrekt zu ändern.
Dies ist ein 3 -Stufen -Prozess.
Verwenden Sie zunächst den BMFont -Generator wie oben beschrieben. Verwenden Sie dann jedoch die folgenden Einstellungen, die sich unterscheiden können, was Sie zuvor verwendet haben.
Zuletzt müssen Sie Imagemagick (https://imagemagick.org/index.php) oder ein ähnliches Tool verwenden, um die Texturdatei in einen SDF zu konvertieren. Sobald Sie Imagemagick installiert haben, führen Sie Folgendes aus der Befehlszeile aus (Beispiel für Windows Power Shell, ist jedoch für UNIX sehr ähnlich):
magick convert --% Arial400_0.tga -filter Jinc ( +clone -negate -morphology Distance Euclidean -level 50%,-50% ) -morphology Distance Euclidean -compose Plus -composite -level 45%,55% -resize 25% Arial400_0.png
Als nächstes müssen wir die Fnt -Datei bearbeiten. Fügen Sie dem Fnt -Header meine Hand vor der Definition von CHARS hinzu:
fieldType=sdf
Dadurch wird die Schriftart LIB den Einzelkanal -SDF -Shader verwenden, wenn diese Schriftart verwendet wird.
Für Multi-Channel-SDFs können Sie den BM-Schriftgenerator nicht verwenden, sondern verwenden: https://soimy.github.io/msdf-bmfont-xml/ mit diesem Tool müssen Sie in einer TTF-Datei aus starten, aber Sie erhalten die übliche FNT plus eine PNG-Datei. Führen Sie nach der Installation Folgendes aus der Befehlszeile aus:
msdf-bmfont -o multisdf.png cour.ttf
Beachten Sie, dass Sie auch die Schriftgröße und andere Parameter über die Befehlszeile liefern können.
Dies ist optional: Machen Sie eine Definition für jede neue Schriftart, die Sie zur Schriftart hinzufügen. Dies sollte jedoch die Codierung erleichtern!
// font type defines, string must match the filename without extension in your fonts folder!
# define GLFONT_COURIER42_MSDF " Courier42_msdf "
# define GLFONT_ARIAL20 " Arial20 "
# define GLFONT_DINNEXTLTPROMED_SDF " DINNextLTProMED_SDF ".. Fügen Sie hier Ihre eigenen Defines hinzu!
