Qt Quick Controls - Kontaktliste

Das Kontaktlisten-Beispiel zeigt, wie ein C++-Backend so integriert werden kann, dass es mit Qt Quick Designer kompatibel ist. Für die deklarativen Teile der Benutzeroberfläche werden .ui.qml-Dateien verwendet, die im Qt Quick Designer visuell bearbeitet werden können.

C++ Backend

Die Kontaktlistenanwendung ermöglicht es dem Benutzer, Kontakte hinzuzufügen, zu bearbeiten und zu entfernen. Die eigentliche Implementierung erfolgt in C++ und wird als QAbstractListModel dargestellt.

Die C++-Klasse ContactModel wird in einem Namespace registriert und später von MainForm.ui.qml importiert und instanziiert. Weitere Informationen zur Registrierung von C++-Klassen als QML-Typen finden Sie unter Definieren von QML-Typen in C++.

#include <QtQml/qqml.h>
...
qmlRegisterType<ContactModel>("Backend", 1, 0, "ContactModel");
...

Designer-Unterstützung

Im Unterverzeichnis designer erstellen wir ein Plugin, das das ContactModel in Qt Quick Designer ersetzt. Damit dies funktioniert, fügen wir die folgende Zeile in contactlist.pro ein.

QML_DESIGNER_IMPORT_PATH = $$PWD/designer

Da Qt Quick Designer die ContactModel C++ Klasse nicht instanziieren kann, definieren wir ein Mockup unter Verwendung eines ListModel. Dies stellt sicher, dass das ListView, das das Modell verwendet, etwas in Qt Quick Designer anzeigt.

Ausführen des Beispiels

Zum Ausführen des Beispiels von Qt Creatorzu starten, öffnen Sie den Modus Welcome und wählen Sie das Beispiel unter Examples aus. Weitere Informationen finden Sie unter Erstellen und Ausführen eines Beispiels.

Beispielprojekt @ code.qt.io