CMake 02: anatomia di un progetto.

Dopo aver creato il progetto CMakeWidgetProject nel primo articolo (CMake is the future), vediamo ora nel dettaglio come è fatto un progetto CMake in Qt Creator. E poi proviamo ad aggiungere un pulsante alla finestra principale, con tanto di icona e di file di risorse .qrc.

Se volete potete anche consultare il codice andate al progetto gitHub: https://github.com/g-gualeni/CMakeWidgetProjectWeb

P.S.: ringrazio tutti i commenti ricevuti, in particolare riguardo a Conan.io, che per certi versi potrebbe competere con CMake. Qt 7 con Conan.io?

Struttura del progetto

La rappresentazione del progetto è leggermente diversa dal caso qmake. In particolare si noti il file CMakeList.txt al posto del file .pro con il nome del progetto e si noti come la struttura sia più complessa:

Struttura di un progetto CMake in Qt Creator

Infatti per usare CMake, ogni progetto deve avere il file:

CMakeLists.txt

Esattamente questo file, non un file con il nome del progetto. Questo primo punto mi ha sempre lasciato un poco perplesso, ma evidentemente ha dei vantaggi.

Analisi del file CMakeLists.txt

Cerchiamo di analizzare e capire la struttura del file CMakeLists.txt che viene creato automaticamente da Qt Creator. Se lo apriamo con Qt Creator, vediamo che il file inizia con:

cmake_minimum_required(VERSION 3.5)

il cui significato mi sembra abbastanza chiaro: impone la versione minima di CMake da usare. Al momento l’ultima versione rilasciata è la 3.17.

Nome del progetto

Il primo elemento è il nome del progetto con tutti i suoi attribuiti:

project(CMakeWidgetProject LANGUAGES CXX)

Attenzione a LANGUAGES CXX che indica il linguaggio di programmazione usato nel progetto, non le traduzioni dell’applicazione.

Impostazioni necessarie per Qt

Ci sono poi alcune impostazioni necessarie alla compilazione di Qt. In particolare usando la funzione set() viene attivata la variabile:

CMAKE_INCLUDE_CURRENT_DIR 

che serve per trovare i file generati dal moc (Meta Object Compiler)

Poi si devono attivare delle variabili specifiche per Qt che però fanno parte di CMake:

CMAKE_AUTOUIC
CMAKE_AUTOMOC
CMAKE_AUTORCC

Ecco il codice:

set(CMAKE_INCLUDE_CURRENT_DIR ON)
set(CMAKE_AUTOUIC ON)
set(CMAKE_AUTOMOC ON)
set(CMAKE_AUTORCC ON)

Seguono poi due macro per gestire il linguaggio di programmazione usato (C++11 in questo caso)

set(CMAKE_CXX_STANDARD 11)
set(CMAKE_CXX_STANDARD_REQUIRED ON)

Poi, serve la funzione per trovare le librerie di Qt, ovvero find_package(). In questa funzione si devono mettere le librerie aggiuntive (Core, Widgets, Gui) separandole con lo spazio, non con la virgola, oppure se preferite, potete fare come me ed invocare la funzione find_package() per ogni libreria.

find_package(Qt5 COMPONENTS REQUIRED Widgets)

Add Executable

Segue la funzione add_executable() che specifica il nome dell’eseguibile, che potrebbe essere diverso dal nome del progetto, e quali sono i file che compongono il progetto. Prestate attenzione a questo comando, dato che quando aggiungeremo dei file al progetto li dovremo inserire qui, a mano.

add_executable(CMakeWidgetProject
    main.cpp
    mainwindow.cpp
    mainwindow.h
    mainwindow.ui
  )

Per finire, per ogni libreria inclusa con find_package() serve la funzione target_link_libraries() che serve per collegare il progetto con le sue librerie ed è essenziale per poter includere le definizioni delle classi (.h) nel codice.

target_link_libraries(CMakeWidgetProject PRIVATE Qt5::Widgets)

Attenzione: il nome del progetto deve essere uguale a quello impostato in add_executable(), altrimenti CMake genera un errore.

Aggiungere documenti al progetto

I file specificati in add_executable() sono quelli che poi compaiono nel progetto in Qt Creator. Pertanto posso anche aggiungere dei documenti associati al progetto. Supponiamo di avere un file .odt e un file .pdf e di inserirlo in add_executable(). Io spesso allego ai miei progetti dei file di documentazione, in modo da mettere tutto in un solo posto. In particolare scrivo la documentazione con LibreOffice e poi ne salvo una copia in pdf.

  add_executable(CMakeWidgetProject
    main.cpp
    mainwindow.cpp
    mainwindow.h
    mainwindow.ui
    CMakeWidgetProject-Doc.odt
    CMakeWidgetProject-Doc.pdf
  )

Appena salvo il file CMakeLists.txt, si attiva CMake e l’albero del progetto si aggiorna. Il risultato è il seguente:

Documentazione allegata al progetto, vista da Qt Cretator

Non so per quale motivo il file .pdf viene messo in Resources, mentre il file .odt viene messo in radice.

Attenzione: Facendo doppio click in Qt Creator su questi due file, si aprono in formato binario. Se voglio l’editor di sistema, sia per .odt che per .pdf devo usare tasto destro, Apri Con, System Editor. Spero che questa cosa venga rivista nelle prossime versioni di Qt Creator.

Attenzione: Questi file devono esistere, altrimenti la compilazione fallisce. Per fortuna l’editor segnala quale è il file che non è stato trovato. Sotto un esempio:

Errore in CMake

Aggiungiamo un pulsante all’applicazione

Proviamo ora ad esplorare uno dei casi d’uso classici: inserire nell’applicazione un pulsante con il quale aprire una pagina su YouTube, avendo cura di inserire nel pulsante la classica icona di YouTube.

Inserire una icona ed un file di risorse (*.qrc)

Prepariamo il file di risorce con le icone, che chiameremo:

CMakeWidgetProject-res.qrc

usando il classico comando “File”, “New File or Project”, “Qt”, “Qt Resource File”

Poi, creiamo nel progetto una cartella

icons

e usando Icon8 cerchiamo l’icona di YouTube ed inseriamola nella cartella. Ne ho trovata una che si chiama:

icons8-play_button.png
Icona di YouTube inserita nella cartella icons.

Ora apriamo CMakeWidgetProject-res.qrc, aggiungiamo un path e aggiungiamo il file con l’icona, nel solito modo:

Per finire, a mano, aggiungiamo CMakeWidgetProject-res.qrc al progetto.

Dove? Naturalmente nel comando add_executable().

Dopo aver salvato CMakeLists.txt il file delle risorse compare nell’albero del progetto.

Aggiungere il pulsante

A questo punto posso incorporare l’icona in un pulsante sulla GUI, come avrei fatto con QMake.

Aggiungo un QPushButton che chiamo cmdYouTube, imposto a 32×32 la dimensione dell’icona ed inserisco l’immagine prelevandola dal file delle risorse.

Seleziono l’icona dal file delle risorse, nel modo classico.

Imposto il testo del pulsante con Open YouTube e già che ci sono rimpicciolisco la finestra di dialogo ed imposto un layout verticale.

Compilando il tutto con un “Rebuild All” ottengo la mia applicazione con il pulsante e con l’icona.

Pulsante YouTube pronto per essere attivato

E già che ci siamo apriamolo questa pagina di YouTube, usando le classi QUrl e QDesktopServices. Dopo aver creato lo slot clicked(), bastano 2 righe di codice.

#include <QDesktopServices>
#include <QUrl>

void MainWindow::on_cmdYouTube_clicked()
{
    QUrl youtube("https://youtu.be/R6kvF0nlahE");
    QDesktopServices::openUrl(youtube);
}

Ricordatevi che ALT+Invio vi permette di inserire i riferimenti alle classi, senza dover scrivere #include …

Compilate e provate!

Conclusioni

Per oggi basta così! Ricordo a tutti che il codice di questo tutorial è disponibile su GitHub: https://github.com/g-gualeni/CMakeWidgetProjectWeb

La prossima volta, vedremo come aggiungere una libreria di Qt, con un esempio d’uso di QTextToSpeech.

Newsletter QtQB

Se vuoi ricevere i miei post e le mie notizie via mail, iscriviti!

Autore: Gianbattista

Appassionato di tecnologia, sono l'autore di Qt5 Quanto Basta. Per lavoro mi occupo di elaborazione delle immagini per applicazioni industriali, ma nel tempo libero adoro creare applicazioni con Qt (www.qt.io)

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *