Qt5 stellt sich vor¶

Worauf sich Qt 5 fokussiert¶

Qt 5 ist eine komplette Überarbeitung der schon sehr erfolgreichen Qt 4 Veröffentlichung. Mit Qt 4.8, das Qt 4 Release ist fast 7 Jahre alt. Zeit um die beeindruckende Werkzeugsammlung noch beeindruckender zu machen. Qt 5 fokussiert sich auf folgendes:

• Herausragende Grafik: Qt Quick 2 basiert auf OpenGL (ES) und nutzt eine scene graph Implementierung. Der Grafikstack erlaubt ein neues Level an Grafikeffekten, die zusammen mit der einfachen Nutzung bisland unerreicht sind.

• Developer Productivity: QML und JavaScript werden als die Hauptwerkzeuge für die UI Erstellung gesehen. Das Backend wird in C++ realisiert. Die Trennung zwischen JavaScript und C++ erlaubt schnellere Zyklen sowohl Fronend-Entwickler, die sich auf hübsche Userinterfaces, als auch für Backend-Entwickler, die sich auf Stabilität, Performanz und das Laufzeitverhalten konzentrieren.

• Cross-Plattform Portabilität: Über die konsolidiert Qt Plattform Abstraktion ist es jetzt möglich, Qt auf eine größere Anzahl an Plattformen zu portieren. Qt 5 ist um das Konzept von Qt Essentials und Qt Add-ons strukturiert, welches Betriebssystementwicklern erlaubt sich auf die notwendigen Module zu konzentrieren, was dann zu einer schnelleren Laufzeit führt.

• Open Development: Qt ist jetzt ein wirklich open-governance Projekt, das unter qt.io gehostet wird. Die Entwicklung steht offen und wird von einer Community vorangebracht.

Qt Quick¶

Qt Quick ist der Überbegriff für die Benutzerschnittstellentechnologie (oft Userinterface oder kurz UI genannt) in Qt 5. Qt Quick selbst ist eine Sammlung mehrerer Technologien:

• QML - Die Auszeichnungssprache für die Userinterfaces

• JavaScript - Die dynamische Skriptsprache

• Qt C++ - eine hoch portable erweiterte C++ Bibliothek

Genau wie HTML ist QML eine Auszeichnungssprache. Sie besteht aus “Tags”, die in Qt Quick “Elemente” in genannt werden und deren Eigenschaften durch geschweifte Klammern umschlossen werden Item { }. Es wurde von Grund auf für die Erstellung von Userinterfaces, Geschwindigkeit und einfacher Lesbarkeit für die Entwickler konzipiert. Das Userinterface kann dann durch JavaScript Code verbessert werden. Qt Quick ist zudem durch Qt C++ einfach mit nativer, eigener Funktionalität erweiterbar. Kurzum, das beschreibende UI wird das Frontend genannt und die nativen Teile werden Backend genannt. Das erlaubt es, rechenintensive und systemspezifische Operationen deiner Anwendung von der Benutzerschnittstellt zu trennen.

In einem typischen Projekt wird das Frontend mit QML/JavaSCript entwickelt und der Backend Code, welcher mit dem System interoperiert und die rechenintensiven Dinge macht wird mit Qt C++ entwickelt. Das erlaubt es eine natürliche Trennung zwischen den eher Design-orientierten Entwicklern und den funktionalen Entwicklern zu machen. Typischerweise wird das Backend mit Qt-eigenen Testframeworks getestet und dann für die Frontend-Entwickler zur Verfügung gestellt.

Wir wagen uns an ein Userinterface¶

Erstellen wir ein einfaches Userinterface mit Qt Quick, welches ein paar Eigenschaften der QML Sprache präsentieren soll. Am Ende haben wir eine Papierwindmühle mit sich drehenden Rotorblättern.

Wir starten mit einem leeren Dokument, das wir main.qml nennen. Alle QML-Dateien bekommen die Endung .qml. Als Auszeichnungssprache (ebenso wie HTML) braucht ein QML-Dokument genau ein Wurzelelement, welches in unserem Beispiel das Image-Element mit einer Breite und einer Höhe sein wird, die auf der Geometrie des als Hintergrund verwendeten Bildes basiert:

import QtQuick 2.5

Image {
    id: root
    source: "images/background.png"
}

Weil QML keine Einschränkungen macht, welches Element die Wurzel darstellt, verwenden wir das Image-Element als Wurzel, für das wir die source-Eigenschaft auf das Hintergrundbild setzen.

Die Elemente Stab und Windrad im Vordergrund unseres Userintefaces werde als eigene Bilder platziert.

Der Stab muss horizontal mittig unten platziert werden und das Windrad kann in der Bildmitte des Hintergrunds erscheinen.

Normalerweise besteht dein Userinterface aus vielen verschiedenen Elementtypen und nicht nur aus image-Elementen wie in diesem Beispiel.

Image {
    id: root
    ...
    Image {
        id: pole
        anchors.horizontalCenter: parent.horizontalCenter
        anchors.bottom: parent.bottom
        source: "images/pole.png"
    }

    Image {
        id: wheel
        anchors.centerIn: parent
        source: "images/pinwheel.png"
    }
    ...
}

Um das Windrad mittig zu plazieren verwenden wir eine komplexe Eigenschaft mit dem Namen anchor (“Anker”). Das Verankern erlaubt dir eine geometrische Beziehung zwischen Eltern- und Geschwisterobjekten festzulegen. Beispielsweise bedeutet anchors.centerIn: parent “plaziere mich im Zentrum des Elternelements. Es gibt die Beziehungen “left”, “right”, “top”, “bottom”, “centerIn”, “fill”, “verticalCenter” und “horizontalCenter” auf beiden Seiten. Natürlich müssen diese zusammenpassen. Es ergibt keinen Sinn meine linke Seite an der Oberseite eines anderen Elements zu verankern.

So setzen wir das Windrad mittig auf den Hintergrund des Elternelements.

Um dieses Beispielprojekt ein bisschen interessanter zu gestalten, wollen wir die Szene interaktiv machen. Die Idee ist, dass das Rad sich dreht, wenn der Benutzer mit der Maus irgendwo in der Szene klickt.

Wir verwenden das MouseArea Element und machen es so groß wie unser Wurzelelement.

Image {
    id: root
    ...
    MouseArea {
        anchors.fill: parent
        onClicked: wheel.rotation += 90
    }
    ...
}

Die Mausfläche sendet ein Signal sobald der Benutzer innerhalb der bedeckten Fläche klickt. Man kann sich in dieses Signal einklinken, indem man die onClicked Funktion überschreibt. In diesem Fall binden daran das Bild des Rades und ändern dessen Drehung um +90 Grad.

Jetzt wird sich das Rad drehen, aber das funktioniert noch nicht flüssig. Die Drehung ändert sich sofort. Wir hätten aber lieber, dass sich die Eigenschaft mit der Zeit um 90 Grad ändert. Hier kommen Animationen ins Spiel. Eine Animation definiert wie sich eine Eigenschaft ändert über eine gewisse Zeitspanne. Dafür verwenden wir einen Animationstyp mit dem Namen Behaviour`. Dieses Verhalten einer Eigenschaft gibt genau an, wie die zugehörige Eigenschaft animiert werden soll, wenn eine Änderung für diese Eigenschaft ansteht. Kurz gesagt, sobald sich die Eigenschaft ändert, läuft die Animation los. Das ist nur eine von mehreren Möglichkeiten, eine Animation in QML zu definieren.

Image {
    id: root
    Image {
        id: wheel
        Behavior on rotation {
            NumberAnimation {
                duration: 250
            }
        }
    }
}

Immer wenn sich die Drehungseigenschaft des Rades ändert, wird dies über NumberAnimation animiert mit einer Dauer von 250ms, also wird jede 90 Grad-Drehung 250ms dauern.

Jetzt sieht das Rad viel besser aus. Ich hoffe, dieses Beispiel hat dir ein bisschen geholfen, die Programmierung mit Qt Quick zu verstehen.

Qt Module¶

Die “Qt Essentials” Module sind notwendig für eine auf Qt basierende Plattform. Sie bieten die Grundlage um eine moderne Qt 5 Anwendung mit Hilfe von Qt Quick 2 zu entwickeln.

Die “Core-Essential” Module

Eine minimale Sammlung von Qt 5 Modulen um mit QML zu programmieren.

Qt Addon Module

Neben den wichtigen Modulen bietet Qt zusätzliche Module für Softwareentwickler, die nicht Teil der Veröffentlichung sind. Hier ist eine kurze Liste von verfügbaren Addon Modulen.

• Qt 3D - Eine Menge von APIs um graphische 3D Programmierung einfach und beschreibend zu machen.

• Qt Bluetooth - C++ und QML APIs für Plattformen, die Bluetooth Technologie verwenden.

• Qt Contacts - C++ und QML APIs um Adressbücher und Kontaktdatenbanken anzusprechen.

• Qt Location - Erlaubt die Posititionierung, Kartierung, Navigation und Ortssuche über QML und eine C++ Schnittstelle. Es wird ein NMEA backend für die Positionierung verwendet.

• Qt Organizer - C++ und QML APIs um auf eine persönliche Informationsverwaltung (Organizer, Todos, Veranstaltungen, etc.) zuzugreifen.

• Qt Publish and Subscribe

• Qt Sensors - Zugriff auf Sensoren über ein QML und C++ Interface.

• Qt Service Framework - Anwendungen sollen Zugriff auf Änderungsnachrichten lesbar, navigierbar und abonnierbar haben.

• Qt System Info - Entdecke systembezogene Informationen und Fähigkeiten.

• Qt Versit - Unterstützung für vCard und iCalender Formate.

• Qt Wayland - Nur unter Linux. Enthält eine Qt Compositor API (server) und Wayland Plattform Plugins (clients).

• Qt Feedback - Fühlbare und Audio-Rückkopplung auf Benutzeraktionen.

• Qt JSON DB - Ein no-SQL Objektspeicher für Qt.

Unterstützte Plattformen¶

Qt unterstützt eine Reihe von Plattformen. Alle größeren Desktops und eingebettete Systeme werde unterstützt. Über die Abstraktion einer Qt Anwendung ist es heutzutage einfacher wenn nötig eine Qt auf deine eigene Plattform zu portieren.

Das Testen von Qt 5 auf einer Plattform ist zeitraubend. Eine Untermenge wurde vom Qt Projekt ausgesucht und bildet die Menge an Referenzplattformen. Diese Referenzplattformen wurden ausgiebig getestet um beste Qualität zu garantieren. Aber Vorsicht: kein Code ist fehlerfrei.