Sur cette page

StocQt

Un graphique boursier configurable pour 100 actions.

L'application StocQt présente des graphiques de tendance pour une liste personnalisée de 100 actions basées sur le NASDAQ-100. Elle permet à l'utilisateur de choisir des actions à partir d'une liste. L'application permet également de privilégier jusqu'à 5 actions pour les utiliser dans les graphiques de comparaison.

L'application utilise plusieurs types personnalisés tels que Search, StockCheckBox, StockChart, StockView et SettingsView. Ces types présentent les données relatives aux actions sous une forme lisible et permettent à l'utilisateur de personnaliser le graphique de tendance. Par exemple, l'utilisateur peut choisir de visualiser les tendances hebdomadaires, mensuelles, trimestrielles ou semestrielles du cours de l'action.

L'application utilise un singleton StockEngine personnalisé implémenté en C++ pour la gestion des données, telles que les requêtes API et les actions favorites. Elle met en œuvre une classe APIHandler personnalisée pour récupérer les données en ligne.

void ApiHandler::stockHistory(const QString &symbol,
                              std::function<void(QList<HistoryData>)> onComplete)

L'application utilise le type ObjectModel pour accéder aux modèles de données visuelles dont elle dépend.

    id: mainWindow
        ...
    ListView {
        id: root
        ...
        model: ObjectModel {
            Item {
                id: stockContainer
                width: root.width
                height: root.height
                StockView {
                    id: stockView
                    anchors.fill: parent
                    visible: false
                    width: root.width
                    height: root.height
                    stateGroup: stateList
                }

                StockListView {
                    id: listView
                    visible: true
                    anchors.fill: parent
                    width: root.width
                    height: root.height
                    stateGroup: stateList
                }
            }

            FavoriteView {
                id: favoriteView
                width: root.width
                height: root.height
            }

            SettingsView {
                id: infoView
                width: root.width
                height: root.height
            }
        }
    }

Le modèle StockListModel est un modèle de données personnalisé qui répertorie les actions avec des informations de base telles que l'identifiant de l'action, le nom, la valeur et le favori. Cette application utilise ce modèle de données lorsque l'utilisateur souhaite choisir une autre action dans la liste.

StockView et FavoriteView sont des modèles de données complexes qui présentent un graphique de tendance pour l'action sélectionnée ou un groupe de 5 actions maximum. Ils utilisent un autre type personnalisé, StockChart ou FavoriteChart, qui charge les données du StockEngine dans les ListModels et présente la tendance graphique du prix de l'action à l'aide de Surface3D, Bars3D, ou Scatter3D.

Rectangle {
    id: chart
        ...
    function updateHistory(){
        updateStartDate()
        let startPoint = StockEngine.stockModel.indexOf(startDate)
        let totalPoints = StockEngine.stockModel.historyCount()

        let width = startPoint / 50
        for (let i = 0; i < totalPoints; i++) {
            let epochInDays = StockEngine.stockModel.historyDate(i, false) / 86400
            appendSurfacePoint(openModel, width, epochInDays, StockEngine.stockModel.openPrice(i))
            appendSurfacePoint(closeModel,width, epochInDays, StockEngine.stockModel.closePrice(i))
            appendSurfacePoint(highModel,width, epochInDays, StockEngine.stockModel.highPrice(i))
            appendSurfacePoint(lowModel,width, epochInDays, StockEngine.stockModel.lowPrice(i))
        }
        ...
    Surface3D {
        id: historyGraph
        ...
            Surface3DSeries {
                id: highSeries
                visible: true
                baseColor: "green"
                shading: Surface3DSeries.Shading.Flat
                drawMode: Surface3DSeries.DrawSurface
                itemLabelFormat: "Time: @xLabel High:@yLabel$"
                ItemModelSurfaceDataProxy {
                    itemModel: highModel
                    rowRole: "row"
                    columnRole: "column"
                    yPosRole: "value"
                }
            },

La fenêtre SettingsView présente des informations sur l'application.

Pour mieux comprendre l'application, parcourez son code à l'aide de Qt Creator.

Exécution de l'exemple

Pour exécuter l'exemple à partir de Qt Creator, ouvrez le mode Welcome et sélectionnez l'exemple à partir de Examples. Pour plus d'informations, voir Qt Creator: Tutorial : Construire et exécuter.

Exemple de projet @ code.qt.io

Voir aussi Applications QML.

© 2026 The Qt Company Ltd. Documentation contributions included herein are the copyrights of their respective owners. The documentation provided herein is licensed under the terms of the GNU Free Documentation License version 1.3 as published by the Free Software Foundation. Qt and respective logos are trademarks of The Qt Company Ltd. in Finland and/or other countries worldwide. All other trademarks are property of their respective owners.