Pretvaranje UI projekata u aplikacije

Konverzija projekta koji ima datoteku .qmlproject u projekt koji ima datoteku .pro.

Qt Quick UI Prototype projekti korisni su za izradu korisničkih sučelja. Da biste ih koristili za razvoj aplikacija u Qt Creator u, morate dodati:

• Konfiguracijska datoteka projekta (CMakeLists.txt ili .pro )
• C++ kôd (.cpp)
• Datoteke resursa
• Kod potreban za raspoređivanje aplikacija na uređaje

Za više informacija o integraciji QML-a i C++-a pogledajte Pregled – integracija QML-a i C++-a.

Za više informacija o korištenju Qt Design Studio za izradu projekata pogledajte dokumentaciju zaQt Design Studio . Da biste koristili qmake kao sustav za izgradnju, upotrijebite predložak čarobnjaka za Qt Creator za izradu aplikacije Qt Quick koja se gradi pomoću sustava za izgradnju qmake, a zatim kopirajte izvorne datoteke iz projekta Qt UI Quick u projekt aplikacije.

Možete koristiti opciju RESOURCES u konfiguracijskoj datoteci projekta za automatsko dodavanje svih QML datoteka i povezanih resursa u datoteku za prikupljanje Qt resursa (.qrc). Međutim, velike datoteke treba uključiti kao vanjske binarne resurse umjesto da se kompajliraju u binarnu datoteku.

Čarobnjak automatski dodaje opciju QML_IMPORT_PATH u datoteku projekta za navođenje potrebne putanje za uvoz QML-a. Putanja je potrebna samo ako više od jednog poddirektorija sadrži QML datoteke.

Zatim možete upotrijebiti klasu QQuickView u glavnoj C++ izvornoj datoteci kako biste prikazali glavnu QML datoteku pri pokretanju aplikacije.

Modul Qt Quick Studio Components instalira se kada instalirate Qt Design Studio. Ako u projektu koji želite uređivati u Qt Creator koristite Qt Quick Studio Components ili Effekte iz modula, morate izgraditi modul i instalirati ga u svoj Qt kako biste mogli izgraditi projekt. Za više informacija pogledajte Dodavanje Qt Quick Studio Components u Qt instalacije.

The Qt Quick Timeline modul je instaliran kada instalirate Qt Design Studio. Ako instalirate samo Qt Creator i Qt, ne zaboravite odabrati i modul Qt Quick Timeline za instalaciju. Ako je vaš Qt stariji od verzije 5.14, morate izgraditi modul Qt Quick Timeline i instalirati ga u svoj Qt kako biste mogli izgraditi svoj projekt.

Konverzija u qmake projekte

Za pretvorbu projekta koji ima datoteku .qmlproject u projekt koji ima datoteku .pro:

1. Odaberite File > New Project > Application (Qt) > Qt Quick Application > Choose.
2. U polju Build system odaberite qmake kao sustav za izgradnju koji ćete koristiti za izgradnju i pokretanje projekta, a zatim odaberite Next (ili Continue na macOS-u).
3. Slijedite upute čarobnjaka za stvaranje projekta.
4. U istraživaču datoteka kopirajte izvorne datoteke iz direktorija projekta Qt Quick UI u poddirektorij unutar direktorija projekta aplikacije. Za potrebe ovih uputa taj se direktorij naziva qml.
5. Otvorite datoteku projekta aplikacije i uredite vrijednost opcije RESOURCES kako biste dodali sljedeći redak:

   RESOURCES += \
       $$files(qml/*)

6. Također uredite vrijednost opcije QML_IMPORT_PATH kako biste naveli putanju uvoza QML-a:

   QML_IMPORT_PATH = qml/imports

   Gdje je qml/imports putanja uvoza.

7. Idite na Build i odaberite Run qmake kako biste primijenili opciju RESOURCES na konfiguraciju izgradnje.
8. Otvorite datotek main.cpp i zamijenite objekt QQmlApplicationEngine objektom QQuickView:

       QQuickView view;
       view.engine()->addImportPath("qrc:/qml/imports");
       view.setSource(QUrl("qrc:/qml/ProgressBar.ui.qml"));
       if (!view.errors().isEmpty())
           return -1;
       view.show();

   Gdje je qrc:/qml/imports putanja uvoza, a qrc:/qml/ProgressBar.ui.qml putanja do i naziv glavne QML datoteke u Qt Quick UI projektu.

9. Idite na Build i odaberite Run kako biste izgradili i pokrenuli svoj projekt.

   Napomena: Ako dobijete poruke o pogreškama vezane uz module, izvršite korake opisane u odjeljku Dodavanje komponenti Qt Quick Studija u Qt instalacije.

Na primjer, ako kopirate izvorne datoteke primjera ProgressBar iz svoje instalacije Qt Design Studio (nalaze se u direktoriju \share\qtcreator\examples\ProgressBar ) u prazan projekt aplikacije Qt Quick i napravite potrebne izmjene, datoteka main.cpp trebala bi izgledati ovako:

#include <QGuiApplication>
#include <QQmlApplicationEngine>
#include <QQuickView>

int main(int argc, char *argv[])
{
    QCoreApplication::setAttribute(Qt::AA_EnableHighDpiScaling);

    QGuiApplication app(argc, argv);

    QQuickView view;
    view.engine()->addImportPath("qrc:/qml/imports");
    view.setSource(QUrl("qrc:/qml/ProgressBar.ui.qml"));
    if (!view.errors().isEmpty())
        return -1;
    view.show();

    app.exec();
}

Rukovanje velikim datotekama s podacima

Grafički resursi koji se koriste u korisničkom sučelju, poput slika, efekata ili 3D scena, tipičan su uzrok problema s performansama u korisničkim sučeljima. Čak i izrada aplikacije zahtijeva ogromne količine memorije ako pokušate uključiti velike datoteke s resursima, poput 3D modela od 100 MB ili tekstura od 64 MB, u datoteku .qrc kako biste ih kompajlirali u binarnu datoteku.

Prvo pokušajte optimizirati svoje resurse, kako je opisano u poglavljima Optimizacija dizajna i Izrada optimiziranih 3D scena.

Velike resurse treba ili učitavati izravno iz sustava datoteka ili dinamički koristeći Qt sustav resursa. Za više informacija pogledajte Qt sustav resursa.

Dodavanje komponenti Qt Quick Studio u Qt instalacije

Od verzije Qt Design Studio 3.9 modul Qt Quick Studio Components instalira se prema zadanim postavkama kao dio aplikacije stvorene pomoću Qt Design Studio. Također možete ručno instalirati modul.

Na primjer:

1. Kloni repozitorij modula.

   git clone https://code.qt.io/qt-labs/qtquickdesigner-components.git

2. Instalirajte modul Qt Quick Studio Components.

   mkdir build
   cd build
   cmake -GNinja -DCMAKE_INSTALL_PREFIX=<path_to_qt_install_directory> <path_to_qtquickdesigner-components>
   cmake --build .
   cmake --install .

   Napomena: Ovdje <path_to_qt_install_directory> i <path_to_qtquickdesigner-components> treba zamijeniti stvarnom lokacijom na vašem lokalnom pogonu. Na primjer, <path_to_qt_install_directory> može biti nešto poput /Qt/6.3.0/msvc2019_64, a <path_to_qtquickdesigner-components> ovako ../qtquickdesigner-components/