Dreidimensional mit Qt 3D Studio
3D-Applikationen waren bisher eher das Metier von Industrieunternehmen oder Unity-Spieleentwicklern. Die Qt Company verdankt Nvidia das Alternativsystem Qt 3D Studio, das die Entwicklung dreidimensionaler Szenen einfach und allgemein zugänglich machen soll.
(Bild: Qt Company)
- Tam Hanna
Qt 3D Studio – nicht zu verwechseln mit Qt 3D – ist ein an Unity und PowerPoint angelehntes Werkzeug, das Entwicklern einen dedizierten Editor zum Erzeugen von "Szenen" in 3D zur Verfügung stellt. Diese Szenen lassen sich mit Logik für einfache Animationen ausstatten.
Dieser Artikel setzt Grundkenntnisse der Arbeit mit Qt voraus. Allerdings unterscheidet sich der Workflow von Qt 3D Studio jedoch vom klassischen Qt, sodass umsteigende Programmierer zunächst einen genaueren Blick auf das Tool werfen sollten. Das Erzeugen benötigter Bilder-Assets mit Blender ist derweil eine Aufgabe, die vorzugsweise Grafiker übernehmen sollten – die nachfolgenden Beispiele beschränken sich daher auf die Verwendung von Vorlagen, die dem Produkt beiliegen.
Videotutorial zu Qt
Ein kostenpflichtiges Videotutorial des Autors zur Cross-Plattform-Entwicklung erklärt das Programmierframework im Detail.
Zum Einstieg Windows 10 oder macOS bevorzugt
Wer normalerweise unter Linux arbeitet, muss zum Start zahlreiche Kompilierungen über sich ergehen lassen, vor denen selbst Qt warnt. Für erste Gehversuche empfiehlt sich daher der Einsatz von Windows 10 oder macOS mit aktualisierten Grafiktreibern. Qt 3D Studio lässt sich dann einfach, wie in den Abbildungen 1 und 2 gezeigt, über die Checkboxen im Maintenance Tool installieren. Zu beachten ist dabei, dass die Laufzeitkomponenten zum Zeitpunkt der Abfassung dieses Artikels nur mit Qt 5.11 funktionieren.
Nach dem Start von Qt 3D Studio erscheint eine Kurzanleitung, die sich überspringen lässt. Mit einem Klick auf den Button Load Sample Project wird die .uip-Datei mit dem Projektbeispiel geladen. Qt 3D Studio bereichert die Welt des Qt-Programmierers um ein weiteres Dateiformat namens uip: Es enthält diverse Metadaten, nicht aber die eigentlichen Assets.
Mehr erfahren!
Die Qt Company bietet eine sehr detaillierte Besprechung der verschiedenen Möglichkeiten des Werkzeugs an. Wer mehr zu den im Artikel gezeigten Ausführungen erfahren möchte, sollte die Dokumentation definitiv lesen.
Dies ist insofern problematisch, als das "Umspeichern" der .uip-Datei über die Menüoption Save as oder Save as Copy zu einem nicht mehr funktionierenden Projekt führt. Daher ist es erforderlich, in den Ordner C:\Qt\Tools\Qt3DStudio-2.0.0\examples\studio3d zu wechseln und SampleProject an einen anderen Platz im Dateisystem zu kopieren. Anschließend sollte das Projekt aus dieser Kopie geladen werden – denn Qt 3D Studio hat die unangenehme Eigenheit, das Sample von Zeit zu Zeit zu überschreiben.
Bei ausreichend hoher Bildschirmauflösung präsentiert sich die in Abbildung 3 gezeigte Szene. Über einen Klick auf den grünen Play-Button in der Toolbar startet ein erster Durchlauf des Programms.
In der Spalte am linken Bildschirmrand finden sich – vergleichbar mit der Foliendarstellung in PowerPoint – drei Quader in Grün, Blau und Grau, die je eine Slide beschreiben. Die Slides dienen wie in PowerPoint als Basiselement der Präsentation. Alle in einer Szene enthaltenen Folien "erben" zudem die diversen im Master angelegten Elemente. Der Master-Bearbeitungsmodus öffnet und schließt sich per Klick auf den grünen Quader.
Auf der rechten Seite der Qt-3D-Studio-Oberfläche finden sich zwei Toolboxen. Nach Aktivierung des Tabs Project öffnet sich eine Liste aller im Projekt enthaltenen Assets. Dieses Steuerelement nimmt Eingaben per Drag&Drop entgegen. Abgelegte Steuerelemente werden prinzipiell ins Projekt-Stammverzeichnis kopiert, um die Originaldatei zu schützen. Auf der Unterseite findet sich die in Abbildung 4 gezeigte Rubrik, die von Qt bereitgestellte Elemente lädt.
Über das Symbol für Bilder lässt sich ein Betriebssystemfenster aufrufen, das Zugriff auf den Unterordner Logos gewährt. Dort können die gewünschten Assets zum Laden ausgewählt werden – sie erscheinen sodann mit grauem Hintergrund in der Projects-Liste.
Von eigenen Elementen
Der Import eigener Modelle in Qt 3D Studio gelingt nur dann reibungslos, wenn Anweisungen zur richtigen Einstellung häufig verwendeter Grafikprogramme berücksichtigt werden.
Qt 3D Studio unterscheidet sich insofern von Qt Creator, Visual Studio und Co., als dass die rechts oben eingeblendete Projektübersicht die Inhalte der aktuellen Szene nicht anzeigt. Diese erscheinen stattdessen im unten links eingeblendeten Timeline-Fenster.
Elemente lassen sich mehr oder weniger beliebig verschachteln. Das Logo aus dem Beispiel ist im Element Road3D abgelegt, um die dort angelegten Shader zu seiner Darstellung zu verwenden. Abbildung 5 zeigt, wie die Bitmap in der Mitte des Objekts schwebt.
Das Element in der Timeline wird durch einen Klick markiert. Der rechts davon platzierte Eigenschaftendialog – Rubrik Inspector Control – ist danach mit der Bitmap verbunden.
Qt 3D Studio geht beim GUI-Design eigene Wege
Qt 3D Studio unterscheidet sich wesentlich von klassischen GUI-Design-Werkzeugen. Die einzelnen Elemente werden in einer dreidimensionalen Szene angeordnet, weshalb ein nach dem in Abbildung 6 gezeigten Schema arbeitender Shader zum Einsatz kommt. Dabei ist zu beachten, dass die Reihenfolge der hier gezeigten Operationen in "Matrixdarstellung" umgekehrt ist – es geht nur um die logisch richtige Präsentation.
Die Befehle zum Anpassen von Skalierung und Rotation tun, was ihre Namen versprechen: Sie können die Größe des Elements mehr oder weniger nach Belieben anpassen. Das mit der Maus erfolgende Verschieben in der Szene verändert den Wert des Attributs Position. Interessanterweise verändert sich dabei auch die Helligkeit des Objekts. Dies liegt daran, dass Qt 3D Studio mit einer vollwertigen 3D-Engine rechnet, und dass das Logo von einer Lichtquelle beschienen wird, die nicht die gesamte Szene gleichermaßen ausleuchtet.
Über den Leave-Knopf verlässt man den Master, um in die Szene mit dem Tachometer zurückzukehren. Erneutes Klicken auf Play führt dazu, dass sich das Tachometer nach wie vor verändert. Nun ist allerdings das Qt-Logo zu sehen, dass außerdem vom vorbeiziehenden Zeiger beleuchtet wird.
Mehr Interaktivität
Das Verhalten von Master-Folien ist weitgehend wie von PowerPoint gewohnt. Allerdings wirkt sich das Verschieben des QT-Logos in der Tachometerszene in Qt 3D Studio auch auf den Master aus. Das sollte bei etwaigen Drag&Drop-Aktionen unbedingt berücksichtigt werden. Ein in diesem Zusammenhang interessanter Aspekt ist, dass sowohl in der Timeline als auch im Eigenschaftenfenster manche Attribute grau dargestellt werden, während andere in grüner Schrift erscheinen. Grüne Attribute kommen dabei vom Master, sind also für die Szene als Ganzes geteilt. Graue Attribute sind hingegen nur für einzelne Slides relevant.
Ein Rechtsklick auf das Rotation-Attribut an beliebiger Stelle –sowohl im Master, als auch in einer davon abgeleiteten Slide – veranlasst Qt 3D Studio dazu, ein Kontextmenü mit der Option Unlink Property from Master Slide einzublenden. Wird diese Aktion ausgeführt, erscheint der Rotation-Wert im Properties-Fenster grau. Das bedeutet, dass der Wert der Rotation ab sofort für eine bestimmte Seite festgelegt werden kann, und dass der Master nicht mehr die alleinige Herrschaft darüber hat.
Animation mit Keyframes
Animationen entstehen in Qt 3D Studio durch das Prinzip der Keyframes: Ein Animationsprozess wird durch einen Startzustand, einen oder mehrere Zwischenzustände und eine Easing Function beschrieben. Die Runtime interpoliert zur Laufzeit selbsttätig zwischen den einzelnen Punkten, um eine "fließende" Darstellung zu erreichen.
Sobald das Symbol in der Tachometerszene selektiert wird, erscheint das Rotation-Attribut grau. Mit einem Klick auf das kleine Uhrensymbol neben Rotation lässt dessen Farbe von Weiß auf Blau wechseln. Eine blau dargestellte Uhr steht hierbei für ein Attribut, dessen Animationsmöglichkeiten genutzt werden. Ist das Symbol grau, so ist das Element zwar ebenfalls animierbar, der Entwickler macht von dieser Möglichkeit im Moment allerdings keinen Gebrauch.
Das eigentliche Einpflegen der Keyframes ist eine herausfordernde Angelegenheit. Im ersten Schritt ist sicherzustellen, dass die Option Autoset Keyframes im Timeline-Menü selektiert ist. Die Funktion eingeschaltet zu lassen, ist jedoch mit Vorsicht zu genießen – denn dadurch kann es leichter passieren, dass zusätzliche Keyframes versehentlich platziert werden.
Nach dem Einschalten der erwähnten blauen Uhr erscheint In der Timeline der in Abbildung 7 gezeigte zusätzliche Arbeitsbereich, der den Zeitverlauf der Rotation beschreibt.
Sobald der Zeitschieber in der Timeline an den Anfang der Timeline geschoben und die Rotation auf den gewünschten Wert eingestellt ist, blendet Qt 3D Studio an dieser Stelle ein Diamantenpiktogramm ein. Es signalisiert, dass an diesem Platz im Zeitverlauf eine Stützstelle zu finden ist. In gleicher Weise lässt sich am Ende der Zeitleiste ein anderer Wert setzen. Das Aufscheinen des zweiten Piktogramms informiert anschließend über die erfolgreiche Einrichtung der Keyframe-Animation.
Ein nettes Detail der Benutzerschnittstelle ist, dass Anwender durch die Zeitleiste scrollen können. Die im Eigenschaftenfeld des jeweiligen Attributs angezeigten Werte spiegeln dabei den Zustand wieder, den die Engine zur Laufzeit errechnen würde. Lässt man Rotation.Y von -10 bis +10 laufen, springt das Logo fortan jedenfalls hin- und her.
Und jetzt, mit Code
Eine – im Alltag des Qt-Entwicklers nur wenig bedachte – Besonderheit von QML ist, dass das Produkt komplett auf OpenGL basiert. Eine der Grundideen hinter dem GUI-Stack war seinerzeit das Unabhängigwerden von der nativen Steuerelementebibliothek des zugrundeliegenden Betriebssystems.
Anstatt sich wie bisher bei jeder neuen Portierung mit den diversen Eigenheiten herumschlagen zu müssen, zeichnet man per OpenGL ein "Bild" eines mehr oder weniger nativ aussehenden Steuerelements. Für Qt 3D Studio ist dies insofern ein Geschenk, als die Interoperabilität zwischen den per QML und per Qt 3D Studio erzeugten Inhalten exzellent ist.
Mit dem Qt Creator lassen sich diese Möglichkeiten veranschaulichen. Ein auf Basis der Vorlage Application Qt Quick Application Empty im ersten Schritt erstelltes Projekt erhält im Beispiel den mehr oder weniger zufälligen Namen "HeiseStudioV2T1". Bei der Auswahl der Runtime-Version ist auf die Version 5.11 zu setzen, die bisher als einzige eine volle Implementierung der 3D-API hat.
Runtime und Compiler
Beim Kit fällt die Wahl auf Desktop Qt 5.11. Der Autor nutzt MSVC 2017, andere Compiler sollten aber ebenfalls problemlos funktionieren. Da Qt unter Windows zu Problemen neigt, sollte das generierte Projektskelett zunächst auf seine Funktionstüchtigkeit geprüft werden. Etwaige Fehler müssen behoben werden.
Das eingangs bereits beschriebene "Umspeichern" der .uip-Datei ist allein nicht ausreichend: Die einzelnen Ressourcen werden über lokale Pfade referenziert, die beim Verschieben des Files "brechen". Daher sollte der Ordner SampleProject als Ganzes in das Verzeichnis verschoben werden, das die .pro-Datei enthält. Anschließend ist der Inhalt von main.qml in Qt Creator zu ergänzen um:
import QtQuick 2.11
import QtQuick.Window 2.11
import QtStudio3D 2.0
Als Erstes ist der Import der QtStudio3D-Bibliothek erforderlich. Sie stellt intelligente Ressourcen zur Verfügung, die die Interaktion mit den Inhalten ermöglicht. Sie dient zudem als Test für die Korrektheit der Konfiguration. Wie in Abbildung 8 zu sehen, kann es anfangs passieren, dass sich Qt Creator beschwert. Das Bereitstellen beziehungsweise komplette Analysieren der Bibliothek ist ein durchaus arbeitsintensiver Prozess.
Das eigentliche Anzeigen der Elemente erfolgt dann über ein Presentation-Element, das sich seinerseits in einem Studio3D-Tag domiziliert:
Studio3D{
id: myStudio
anchors.fill: parent
ViewerSettings {
scaleMode: ViewerSettings.ScaleModeFill
}
Presentation {
source: "qrc:/uip/SampleProject.uia"
}
}
Interessant ist hier vor allem die Nutzung eines lokalen Pfads: Die diversen Beispiele der Qt Company bauen allesamt darauf, dass die Beschaffung der Inhalte aus dem Ressourcensystem erfolgen sollte. Das eigentliche Platzieren der Inhalte erfolgt wie bei der Arbeit mit Ressourcen.Es ist daher empfehlenswert, das Projekt als Ganzes in ein Unterverzeichnis der .pro-Datei zu kopieren und von dort zu bearbeiten. In der neusten Version Qt 3D Studio 2.0 finden sich allerdings auch Beispiele, die lokale Pfade verwenden.
Kompakter!
Wer keine "Raw-Ressourcen" in das Ressourcensystem einbinden möchte und eine kommerzielle Qt-Lizenz hat, findet Best Practises zur Kompression.
Ein Klick auf Run lässt den Tachometer in der Applikation erscheinen. Die Bereitstellung von Shader und Co. verursacht auch auf leistungsfähiger Hardware die eine oder andere Wartesekunde – an dieser Stelle ist daher ein wenig Geduld gefragt.
Interaktion mit Szenenelementen
Das Anzeigen einer dreidimensionalen Szene mag komfortabel sein, ist aber nur wenig sinnvoll – stattdessen ließe sich auch ein Film rendern und per Mediaplayer abspielen. Wirklich interessant wird Qt 3D Studio erst durch die Möglichkeit, mit Szeneninhalten dynamisch zu interagieren. Dahinter verbirgt sich der Gedanke, beispielsweise die Auslenkung des Zeigers programmatisch zu beeinflussen oder zwischen verschiedenen Szenen hin- und her wechseln zu können.
Wie bei den meisten auf Generatoren basierenden Projekten gilt auch hier, dass das Implementieren eines neuen Features im grafischen Teil des Produkts beginnt. Um mit der Bearbeitung der Szenenelemente beginnen zu können, ist zunächst die .uip-Datei zu öffnen, die vom Ressourcensystem in Qt 3D Studio geladen wird.
Mit Version 2.0 von Qt 3D Studio erzeugte Szenen sind automatisch mit zwei Slides ausgestattet, zwischen denen – zumindest in der Theorie – gewechselt werden sollten. Zur Anpassung sind folgende Änderungen am Code erforderlich:
Studio3D{
. . .
Presentation {
id: myPresentation
source: "qrc:/uip/SampleProject.uia"
}
onRunningChanged: {
myPresentation.goToSlide("Angle",1);
}
}
Grundlegende Interaktion mit den in Qt 3D Studio erzeugten Inhalten erfolgt prinzipiell über die Presentation-Klasse, der zur Sicherstellung der Ansprechbarkeit im ersten Schritt eine ID zugewiesen wird. Das Attribut onRunningChanged erlaubt das Festlegen von Code, der nach dem erfolgreichen Laden zur Ausführung gelangt.
Mit der Funktion goToSlide erfolgt der Wechsel zur zweiten Szene. Relevant ist dabei vor allem, dass das im Master angelegte Objekt hier nicht erscheint – es wird von einem der anderen Elemente in der Angle-Szene überdeckt.
Interessanter ist die Parametrierung der Methode. Die Funktion übernimmt den Namen der Szene und die numerische Idee der anzusprechenden Folie. Es ist möglich, in einer .uip-Datei mehrere Szenen anzulegen, die komplett unterschiedliche Inhalte generieren. Dies könnte zum Beispiel in einem Luftfahrzeug angebracht sein, wo die verschiedenen Systeme jeweils in einem eigenen Bildschirm dargestellt werden.
Um das Hantieren mit dem QML-Layoutsystem zu minimieren, sollte der Slider mit Margins integriert werden. Bei Bewegungen des Steuerelements treten aktuell gelegentliche Renderingfehler auf. Das Problem ist dem Qt-Team bekannt, ein Bugfix in Arbeit:
import QtQuick.Controls 1.4
Window { . . .
Slider {
id: mySlide
height: 50
value: 0.7
width: 600
}
Studio3D{
anchors.topMargin:50
An dieser Stelle lässt sich ein erster Versuch zur Beeinflussung der Szene unternehmen. Die Qt-3D-Studio-API macht einzelne Attribute der Elemente über jene Referenznamen ansprechbar, die auch im Rest von QML zum Einsatz kommen.
Der folgende Code soll probeweise ausgeführt werden:
Slider {
. . .
onValueChanged: {
myPresentation.setAttribute("Scene.Road3D.QT-symbol", "rotation.y", mySlide.value*200 );
myPresentation.setAttribute("DateAndTime", "textstring", mySlide.value*200);
. . .
setAttribute übernimmt hierbei drei Parameter: Erstens den Pfad, der das anzusprechende Element beschreibt. Hierbei handelt es sich im Grunde genommen um die Struktur, die in der Timeline des Qt-3D-Studio-Editors angezeigt wird – ein Rechtsklick auf ein Element öffnet das Kontextmenü mit Zugriff auf den Pfad. Zweitens folgt der Referenzattributname, und zu guter Letzt der jeweilige Wert.
Wird das Programm ausgeführt, verändert sich der Wert des Labels. Leider trifft das nicht auf die Drehung des Logos zu. Die Ursache dieses Verhaltens liegt darin, dass die Qt-3D-Studio-Runtime Attribute sammelt, bis ein neuer Frame gerendert werden kann. Im Fall des Programmbeispiels bedeutet dies, dass der durch setAttribute eingetragene Wert nie in der Renderingpipeline ankommt: Das in Qt 3D Studio enthaltene Animationsframework mahlt zuerst.
DataInput vollständig implementiert
Die Interaktion zwischen in QML und in Qt 3D Studio erzeugten Objekten soll über das Data-Inputs-Feature erfolgen. In der Version 1.0 war dies nicht komplett implementiert, Version 2 schafft Abhilfe.
Ein Klick auf File -> Data Inputs veranlasst Qt 3D Studio zur Anzeige aller im aktuellen Projekt deklarierten Inputs. Die generierte Szene enthält die in Abbildung 9 gezeigten Input-Felder.
Durch Klick auf das Plus-Symbol erscheint ein Dialog zum Anlegen eines neuen Eingabeobjekts auf dem Bildschirm. Zum Zeitpunkt der Veröffentlichung dieses Artikels kennt Qt 3D Studio zwei Eingabetypen: Erstens den Typ Ranged Number und zweitens einen String. Definierte Ressourcen lassen sich nach Belieben aus QML heraus ansprechen und im Editor mit Steuerelementen verdrahten:
DataInput {
id: animationInput
name: "animationInput"
value: 0
}
Um die Handhabung dieser API kompakt zu demonstrieren, soll eines der vorgegebenen Attribute angepasst werden.
Presentation {
property int howFast: 22
DataInput {
name: "speed"
value: myPresentation.howFast
}
id: myPresentation
DataInput-Elemente quartieren sich prinzipiell in der Präsentation ein, die die zu beeinflussenden Elemente enthält. Wichtig ist, dass das Value-Attribut in der Praxis immer in Form eines QML-Attributs vorliegen sollte – beim direkten Übergeben normaler Werte kam es in verschiedenen vom Autor durchgeführten Tests zu unerklärlichem Verhalten.
Zur Fertigstellung ist schließlich nur noch eine Änderung von howFast durchzuführen – eine Aufgabe, die der Slider übernehmen kann:
Slider {
id: mySlide
. . .
onValueChanged: {
myPresentation.howFast=mySlide.value*300;
}
}
Mehr Beispiele!
Die Qt Company bietet eine Gruppe von sehr komplizierten Beispielen an, die die Interaktion zwischen QML und 3D Studio illustrieren.
Wird der Slider während der Ausführung des Programms über den Bildschirm gezogen, erscheint der im Tachometer angezeigte Wert automatisch. Nach dem Loslassen des Sliders läuft die Bewegung weiter, da es zu einem Konflikt zwischen der in der Szene angelegten Animation und dem Attribut kommt. Werte größer 260 kappt die Runtime übrigens automatisch, da der DataInput in Qt 3D Studio mit einer Beschränkung ausgestattet wurde.
Fazit
Vielen Desktop- beziehungsweise App-Programmierern dürfte Qt weniger vertraut sein, denn die Qt Company ist seit Jahrzehnten überwiegend im Embedded-Markt vertreten. Das bereitgestellte Demobeispiel – ein Instrument eines Fahrzeugs – stammt daher ebenfalls aus dem Embedded-Umfeld. Die Spezialität von Qt 3D Studio ist die Umsetzung ebensolcher aufwändiger Elemente, die sich mit QML nur schwierig erschaffen lassen. Die momentanen Kinderkrankheiten dürften binnen kurzer Zeit der Vergangenheit angehören.
Als Werkzeug für die Realisierung "allgemeinerer" 3D-Szenen taugt das Produkt hingegen weniger – die Experten beim 3D-Spiele-Spezialisten Unity müssen den Konkurrenten, zumindest vorläufig, nicht allzu sehr fürchten.
Tam Hanna
befasst sich seit dem Jahr 2004 mit Handcomputern und Elektronik. Derzeit liegt sein Fokus auf interdisziplinären Anwendungen von Informationstechnologie.
(map)
