Table SQL mise en cache

L'exemple se compose d'une seule classe, TableEditor, qui est un widget de boîte de dialogue personnalisé permettant à l'utilisateur de modifier les données stockées dans une base de données. Nous allons d'abord passer en revue la définition de la classe et son utilisation, puis nous examinerons son implémentation.

Définition de la classe TableEditor

La classe ` TableEditor ` hérite de ` QWidget `, ce qui fait du widget d’édition de table une fenêtre de dialogue de premier niveau.

class TableEditor : public QWidget
{
    Q_OBJECT

public:
    explicit TableEditor(const QString &tableName, QWidget *parent = nullptr);

private slots:
    void submit();

private:
    QPushButton *submitButton;
    QPushButton *revertButton;
    QPushButton *quitButton;
    QDialogButtonBox *buttonBox;
    QSqlTableModel *model;
};

Le constructeur de ` TableEditor ` prend deux arguments : le premier est une référence à la table de base de données sur laquelle l’objet ` TableEditor ` va opérer. L’autre est un pointeur vers le widget parent et est transmis au constructeur de la classe de base.

Notez la déclaration de la variable ` QSqlTableModel ` : comme nous le verrons dans cet exemple, la classe ` QSqlTableModel ` peut être utilisée pour fournir des données à des classes de vue telles que ` QTableView`. La classe ` QSqlTableModel ` fournit un modèle de données modifiable permettant de lire et d’écrire des enregistrements de base de données à partir d’une seule table. Elle s’appuie sur la classe de niveau inférieur ` QSqlQuery `, qui fournit les moyens d’exécuter et de manipuler des instructions SQL.

Nous allons également montrer comment une vue de table peut être utilisée pour mettre en cache toute modification apportée aux données jusqu’à ce que l’utilisateur demande explicitement leur validation. C’est pourquoi nous devons déclarer un emplacement « submit() » en plus du modèle et des boutons de l’éditeur.

int main(int argc, char *argv[])
{
    QApplication app(argc, argv);
    if (!createConnection())
        return 1;

    TableEditor editor("person");
    editor.show();
    return app.exec();
}

static bool createConnection()
{
    QSqlDatabase db = QSqlDatabase::addDatabase("QSQLITE");
    db.setDatabaseName(":memory:");
    if (!db.open()) {
        QMessageBox::critical(nullptr, QObject::tr("Cannot open database"),
            QObject::tr("Unable to establish a database connection.\n"
                        "This example needs SQLite support. Please read "
                        "the Qt SQL driver documentation for information how "
                        "to build it.\n\n"
                        "Click Cancel to exit."), QMessageBox::Cancel);
        return false;
    }

    QSqlQuery query;
    query.exec("create table person (id int primary key, "
               "firstname varchar(20), lastname varchar(20))");
    query.exec("insert into person values(101, 'Danny', 'Young')");
    query.exec("insert into person values(102, 'Christine', 'Holand')");
    query.exec("insert into person values(103, 'Lars', 'Gordon')");
    query.exec("insert into person values(104, 'Roberto', 'Robitaille')");
    query.exec("insert into person values(105, 'Maria', 'Papadopoulos')");

    query.exec("create table items (id int primary key,"
                                             "imagefile int,"
                                             "itemtype varchar(20),"
                                             "description varchar(100))");
    query.exec("insert into items "
               "values(0, 0, 'Qt',"
               "'Qt is a full development framework with tools designed to "
               "streamline the creation of stunning applications and  "
               "amazing user interfaces for desktop, embedded and mobile "
               "platforms.')");
    query.exec("insert into items "
               "values(1, 1, 'Qt Quick',"
               "'Qt Quick is a collection of techniques designed to help "
               "developers create intuitive, modern-looking, and fluid "
               "user interfaces using a CSS & JavaScript like language.')");
    query.exec("insert into items "
               "values(2, 2, 'Qt Creator',"
               "'Qt Creator is a powerful cross-platform integrated "
               "development environment (IDE), including UI design tools "
               "and on-device debugging.')");
    query.exec("insert into items "
               "values(3, 3, 'Qt Project',"
               "'The Qt Project governs the open source development of Qt, "
               "allowing anyone wanting to contribute to join the effort "
               "through a meritocratic structure of approvers and "
               "maintainers.')");

    query.exec("create table images (itemid int, file varchar(20))");
    query.exec("insert into images values(0, 'images/qt-logo.png')");
    query.exec("insert into images values(1, 'images/qt-quick.png')");
    query.exec("insert into images values(2, 'images/qt-creator.png')");
    query.exec("insert into images values(3, 'images/qt-project.png')");

    return true;
}

Implémentation de la classe TableEditor

L'implémentation de la classe ne comprend que deux fonctions : le constructeur et le slot « submit() ». Dans le constructeur, nous créons et personnalisons le modèle de données ainsi que les différents éléments de la fenêtre :

TableEditor::TableEditor(const QString &tableName, QWidget *parent)
    : QWidget(parent)
{
    model = new QSqlTableModel(this);
    model->setTable(tableName);
    model->setEditStrategy(QSqlTableModel::OnManualSubmit);
    model->select();

    model->setHeaderData(0, Qt::Horizontal, tr("ID"));
    model->setHeaderData(1, Qt::Horizontal, tr("First name"));
    model->setHeaderData(2, Qt::Horizontal, tr("Last name"));

Nous créons d'abord le modèle de données et définissons la table de la base de données SQL sur laquelle le modèle doit opérer. Notez que la fonction ` QSqlTableModel::setTable()` ne sélectionne pas de données dans la table ; elle se contente de récupérer les informations relatives à ses champs. C’est pourquoi nous appelons ensuite la fonction ` QSqlTableModel::select()`, qui alimente le modèle avec les données de la table. La sélection peut être personnalisée en spécifiant des filtres et des conditions de tri (voir la documentation de la classe ` QSqlTableModel ` pour plus de détails).

Nous définissons également la stratégie d’édition du modèle. La stratégie d’édition détermine à quel moment les modifications effectuées par l’utilisateur dans la vue sont effectivement appliquées à la base de données. Comme nous souhaitons mettre en cache les modifications dans la vue de la table (c’est-à-dire dans le modèle) jusqu’à ce que l’utilisateur les valide explicitement, nous choisissons la stratégie QSqlTableModel::OnManualSubmit. Les alternatives sont QSqlTableModel::OnFieldChange et QSqlTableModel::OnRowChange.

Enfin, nous configurons les libellés affichés dans l’en-tête de la vue à l’aide de la fonction ` setHeaderData()` dont le modèle hérite de la classe ` QSqlQueryModel `.

    QTableView *view = new QTableView;
    view->setModel(model);
    view->resizeColumnsToContents();

Nous créons ensuite une vue de type tableau. La classe ` QTableView ` fournit une implémentation par défaut du modèle/de la vue pour une vue de tableau, c'est-à-dire qu'elle implémente une vue de tableau qui affiche les éléments d'un modèle. Elle permet également à l'utilisateur de modifier les éléments, en enregistrant les modifications dans le modèle. Pour créer une vue en lecture seule, il suffit de définir le drapeau approprié à l'aide de la propriété ` editTriggers `, que la vue hérite de la classe ` QAbstractItemView `.

Pour que la vue affiche nos données, nous lui transmettons notre modèle à l’aide de la fonction ` setModel()`.

    submitButton = new QPushButton(tr("Submit"));
    submitButton->setDefault(true);
    revertButton = new QPushButton(tr("&Revert"));
    quitButton = new QPushButton(tr("Quit"));

    buttonBox = new QDialogButtonBox(Qt::Vertical);
    buttonBox->addButton(submitButton, QDialogButtonBox::ActionRole);
    buttonBox->addButton(revertButton, QDialogButtonBox::ActionRole);
    buttonBox->addButton(quitButton, QDialogButtonBox::RejectRole);

Les boutons de TableEditor sont des objets QPushButton classiques. Nous les ajoutons à une boîte à boutons afin de garantir que les boutons s’affichent selon une mise en page adaptée au style actuel du widget. En effet, les boîtes de dialogue et les fenêtres de message présentent généralement les boutons selon une mise en page conforme aux directives d’interface de la plateforme concernée. Invariablement, les différentes plateformes ont des mises en page différentes pour leurs boîtes de dialogue. La fonction ` QDialogButtonBox ` permet à un développeur d’y ajouter des boutons et utilise automatiquement la mise en page adaptée à l’environnement de bureau de l’utilisateur.

La plupart des boutons d’une boîte de dialogue remplissent des rôles bien définis. Lorsque vous ajoutez un bouton à une boîte à boutons à l’aide de la fonction ` addButton() `, le rôle du bouton doit être spécifié à l’aide de l’énumération ` QDialogButtonBox::ButtonRole `. Par ailleurs, ` QDialogButtonBox ` fournit plusieurs boutons standard (par exemple ` OK`, ` Cancel`, ` Save`) que vous pouvez utiliser. Ceux-ci se présentent sous forme d’indicateurs, ce qui vous permet de les combiner à l’aide de l’opérateur OR dans le constructeur.

    connect(submitButton, &QPushButton::clicked, this, &TableEditor::submit);
    connect(revertButton, &QPushButton::clicked,  model, &QSqlTableModel::revertAll);
    connect(quitButton, &QPushButton::clicked, this, &TableEditor::close);

Nous connectons le bouton « Quit » au slot « close() » de l’éditeur de table, et le bouton « Submit » à notre slot privé « submit() ». Ce dernier slot se chargera des transactions de données. Enfin, nous connectons le bouton « Revert » au slot « revertAll() » de notre modèle, ce qui annule toutes les modifications en attente (c’est-à-dire que cela rétablit les données d’origine).

    QHBoxLayout *mainLayout = new QHBoxLayout;
    mainLayout->addWidget(view);
    mainLayout->addWidget(buttonBox);
    setLayout(mainLayout);

    setWindowTitle(tr("Cached Table"));
}

Pour finir, nous ajoutons la zone du bouton et la vue de tableau à une mise en page, nous installons cette mise en page sur le widget d’éditeur de tableau, puis nous définissons le titre de la fenêtre de l’éditeur.

void TableEditor::submit()
{
    model->database().transaction();
    if (model->submitAll()) {
        model->database().commit();
    } else {
        model->database().rollback();
        QMessageBox::warning(this, tr("Cached Table"),
                             tr("The database reported an error: %1")
                             .arg(model->lastError().text()));
    }
}

Le slot ` submit() ` est appelé chaque fois que les utilisateurs cliquent sur le bouton « Submit » pour enregistrer leurs modifications.

Tout d’abord, nous lançons une transaction sur la base de données à l’aide de la fonction ` QSqlDatabase::transaction()`. Une transaction de base de données est une unité d’interaction avec un système de gestion de base de données ou un système similaire, traitée de manière cohérente et fiable, indépendamment des autres transactions. Un pointeur vers la base de données utilisée peut être obtenu à l’aide de la fonction ` QSqlTableModel::database()`.

Ensuite, nous essayons de valider toutes les modifications en attente, c’est-à-dire les éléments modifiés du modèle. Si aucune erreur ne se produit, nous validons la transaction dans la base de données à l’aide de la fonction ` QSqlDatabase::commit()` (notez que sur certaines bases de données, cette fonction ne fonctionnera pas s’il existe un ` QSqlQuery ` actif sur la base de données). Dans le cas contraire, nous effectuons un rollback de la transaction à l’aide de la fonction ` QSqlDatabase::rollback()` et affichons un avertissement à l’utilisateur.

Exemple de projet sur code.qt.io