前言

Qt Charts 是 Qt 框架中用于創建豐富、交互式圖表的強大模塊，支持柱狀圖、折線圖、餅圖等多種圖表類型。它不僅可以在傳統的 Qt Widgets 應用中使用，也完全兼容 QML，使得開發者能夠在現代 UI 設計中輕松集成數據可視化功能。

本文將詳細介紹如何在 QML 項目中集成并使用 Qt Charts 組件，涵蓋安裝流程、常見問題及其解決方案，并深入解析 QApplication 與 QGuiApplication 的區別，幫助你順利構建基于 QML 的圖表應用。

---

1. 如何安裝 Chart 組件

Qt Charts 并不是 Qt 的核心模塊，因此在使用前需要手動安裝。如果你使用的是在線安裝器（如 Qt Online Installer），可以通過以下步驟添加 Charts 模塊：

安裝步驟：

1. 打開 Qt Maintenance Tool（可在 Qt 安裝目錄或開始菜單中找到）。
2. 選擇 “添加或移除組件”。
3. 展開你當前使用的 Qt 版本（例如：Qt 6.8.2）。
4. 找到 “Qt Charts” 模塊（通常位于 “Additional Libraries” 分類下）。
5. 勾選該模塊（建議同時勾選 Debug 和 Release 版本）。
6. 點擊 “Next”，完成下載和安裝。

? 提示：確保你安裝的 Qt Charts 版本與你的 Qt 主版本一致。

安裝完成后，你就可以在 .pro 文件或 CMakeLists.txt 中鏈接 Charts 模塊了。

qmake 項目配置：

QT += charts

CMake 項目配置：

find_package(Qt6 REQUIRED COMPONENTS Charts)
target_link_libraries(your_target_name PRIVATE Qt6::Charts)

---

2. 創建 QML 工程時的常見問題

當你新建一個標準的 QML Qt Quick Application 項目時，Qt Creator 默認使用 QGuiApplication + QQmlApplicationEngine 來加載 QML 文件。

然而，Qt Charts 的 QML 類型底層依賴于 Qt Widgets 模塊的部分功能（盡管它們在 QML 中表現為可視化元素），這就導致了一個常見問題：

? 使用 QGuiApplication 時，運行程序會報錯或直接崩潰，提示無法加載 ChartView 或相關類型。

典型的錯誤信息可能包括：

16:44:23: Starting D:\Projects\CSDN\qml_demo\qml_test_charts\build\Desktop_Qt_6_8_2_MinGW_64_bit-Debug\appqml_test_charts.exe…
QML debugging is enabled. Only use this in a safe environment.
16:44:29: 進程崩潰了。

這說明雖然模塊已安裝，但當前應用程序類型不支持 Charts 的完整初始化。

---

3. 解決方案：改用 QApplication + QQuickView

根據官方示例 Qml Weather Example，推薦的做法是使用 QApplication 而非 QGuiApplication，并通過 QQuickView 加載 QML 文件。

修改主函數（main.cpp）

將原本基于 QQmlApplicationEngine 的啟動方式替換為 QQuickView：

#include <QtWidgets/QApplication>
#include <QtQuick/QQuickView>
#include <QtCore/QDebug>
#include <QtCore/QDir>
#include <QtQml/QQmlContext>
#include <QtQml/QQmlEngine>int main(int argc, char *argv[])
{// Qt Charts uses Qt Graphics View Framework for drawing, therefore QApplication must be used.QApplication app(argc, argv);QQuickView viewer;viewer.engine()->addImportPath(QApplication::applicationDirPath());QObject::connect(viewer.engine(), &QQmlEngine::quit, &viewer, &QWindow::close);viewer.setTitle(QStringLiteral("QML Charts"));viewer.setSource(QUrl("qrc:/Main.qml"));viewer.setResizeMode(QQuickView::SizeRootObjectToView);viewer.setMinimumSize(QSize(800,600));viewer.show();return app.exec();
}

同時，在 CMakeLists.txt 文件中確保鏈接了正確的模塊：

find_package(Qt6 REQUIRED COMPONENTS Quick Charts)
target_link_libraries(appqml_test_chartsPRIVATE Qt6::Quick Qt6::Charts
)

接下來在Main.qml引入Charts模塊，然后實現一個簡易的折線圖：

import QtQuick
import QtQuick.Layouts
import QtChartsRectangle {Layout.fillWidth: trueLayout.fillHeight: trueChartView {id: chartViewtitle: "Qt Charts Demo"titleFont.bold: truetitleFont.pointSize: 14anchors.fill: parentantialiasing: trueLineSeries {name: "line"XYPoint { x: 0; y: 0 }XYPoint { x: 1; y: 1 }XYPoint { x: 2; y: 4 }XYPoint { x: 3; y: 9 }XYPoint { x: 4; y: 16 }}}
}

接下來新增qrc資源文件，將Main.qml加入其中：

最后點擊運行：

---

4. QApplication 與 QGuiApplication 的差異

特性	QApplication	QGuiApplication
所屬模塊	QtWidgets	QtGui
用途	GUI 應用（含窗口、控件）	圖形界面基礎應用（無控件）
是否支持 Widgets	? 支持	? 不支持
啟動開銷	略高（加載 widget 系統）	更輕量
適用場景	混合使用 QML 與 Widgets、使用依賴 Widgets 的模塊（如 Charts）	純 QML 或輕量級圖形應用
圖形后端	基于 QWidget 渲染體系	基于 QWindow/QSurface（更適合 Qt Quick）

為什么 Qt Charts 需要 QApplication？

盡管 Qt Charts 提供了 QML 接口，但其內部實現仍然依賴于 QtWidgets 模塊的部分基礎設施（尤其是在事件處理、坐標映射和渲染上下文中）。因此，當使用 QGuiApplication 時，缺少這些依賴會導致組件無法正確初始化。

📌 結論：即使你只在 QML 中使用 ChartView，只要使用了 QtCharts 模塊，就必須使用 QApplication 來啟動程序。

---

總結

在 QML 中使用 Qt Charts 是實現數據可視化的高效方式，但需要注意以下幾點：

1. 必須安裝 Qt Charts 模塊，并通過 .pro 或 CMakeLists.txt 正確鏈接。
2. 默認的 QQmlApplicationEngine + QGuiApplication 結構無法加載 Charts，會因缺少 Widgets 支持而失敗。
3. 解決方案是改用 QApplication + QQuickView，并顯式初始化 Charts 模塊。
4. 理解 QApplication 與 QGuiApplication 的差異，有助于選擇合適的應用架構。

示例下載

GitCode qml_test_charts示例

🔗 參考資料：

• Qt Charts 官方文檔
• Qml Weather 示例源碼
• Qt Application 類型說明