SVG-Grafiken direkt in XNA rendern

36

Angenommen, ich habe ein paar 2D-Grafiken in einem vektorisierten Format wie SVG. Gibt es eine einfache Möglichkeit, dies direkt zu rendern, ohne selbst einen vollständigen SVG-Renderer implementieren zu müssen?

Natürlich könnte ich es offline rastern (z. B. in der Inhaltspipeline), um verschiedene Auflösungen / Zoomstufen zu erzielen, aber ich möchte die gestochen scharfe Grafik mit kontinuierlichen Zoomstufen beibehalten, die Vektorgrafiken bieten.

drxzcl
quelle

Antworten:

24

Eine gute frage Ich habe an einem Punkt damit experimentiert - ich konnte keine einfache, vorgefertigte Lösung finden. Aber lassen Sie mich auf einige der Ressourcen verweisen, die ich gefunden habe, als ich versuchte, sie selbst zu implementieren:


Zunächst gibt es einen Artikel von GPU Gems 3: Rendering von Vektorgrafiken auf der GPU (und dem dazugehörigen Loop-Blinn-Papier ).

Das Schwierigste daran ist, dass das Zeichnen von quadratischen Kurven zwar einfach ist, kubische Kurven (wie sie in einem typischen SVG zu finden sind) jedoch erheblich schwieriger sind. Der Artikel geht ausführlich darauf ein, aber Sie müssen Ihren Mathematikhut mitbringen.

Die Alternative zum Rendern von kubischen Kurven besteht darin, die kubischen Kurven in quadratische Kurven umzuwandeln. Auch ein nicht triviales Problem.

Sobald Sie Vektorkurven auf der GPU rendern können, müssen Sie die SVG-Datei in Ihrer Inhaltspipeline nur noch analysieren und in ein Netz verwandeln, das Sie rendern können. Das Parsen von SVG ist übrigens einfach .

Eine andere, möglicherweise einfachere Alternative besteht darin, auf alle Kurven zu verzichten und einfach eine lineare Approximation Ihrer SVG zu triangulieren.

Beide Lösungen erfordern eine Triangulation - hier ist ein für XNA geeigneter Triangulator .


Als völlig andere Alternative können Sie ein "Distanzfeld" verwenden, um Sprites mit fast vektorähnlichen scharfen Kanten zu rendern.

Hier ist ein Beitrag von Valve aus SIGGRAPH 2007 dazu: Verbesserte Alpha-getestete Vergrößerung für Vektortexturen und Spezialeffekte (PDF)

Die grundlegende Methode ist hier sehr einfach zu implementieren. Die Schwierigkeit entsteht, wenn versucht wird, scharfe Ecken zu unterstützen (etwas, das nur im Papier berührt wird). Diese Methode hat auch einige ziemlich strenge Einschränkungen, außer das Zeichnen einfacher Formen. Es ist am besten für UI-Text und Abziehbilder geeignet (wie Valve es verwendet).


Jetzt, wo ich das alles gesagt habe, muss ich sagen, dass sich die Mühe hier meiner Erfahrung nach nicht lohnt!

Wenn Ihr Gameplay nicht hauptsächlich auf extremen Vektor-Zoom-Effekten wie der sehr coolen Masagin- Demo basiert , können Sie das SVG vorab rendern und einfach Bitmap-Techniken verwenden (einfacher, besser unterstützt usw.).

(Eine der ersten Techniken, die in den Sinn kommen, ist das Mipmapping ( Wiki ) von hochauflösenden Versionen Ihrer Sprites, damit Sie bis zu Ihrer maximalen Sprite-Größe unabhängig von der Auflösung sind.)

Dieser Blog-Beitrag ist wahrscheinlich ein guter Einstieg, um Ihre XNA-Inhalts-Pipeline um SVG-Rendering-Unterstützung zu erweitern.

Andrew Russell
quelle
Ausgezeichnete Antwort, danke! Das ist mehr als genug Seil, um mich damit aufzuhängen. Am Ende werde ich wahrscheinlich Ihren Rat befolgen, um die Bitmap-Route zu wählen. In der Zwischenzeit habe ich etwas zu lesen! : P
drxzcl
Ist diese Antwort noch korrekt?
Lochok
@lochok Ja. Meine Antwort enthält nichts, was plötzlich nicht mehr funktioniert. Es ist möglich, dass in Zukunft eine bessere Methode zum Erstellen von Vektoren entwickelt wird - aber zum Zeitpunkt des Schreibens habe ich noch nichts Neues gehört.
Andrew Russell
Ich meinte außerdem, es gäbe keine Lösung
Lochok