Qt CMake 项目中 QML 和资源文件的引入方式

初入CMake,和之前的qmake差别还是挺大的,笔者在边学习的同时,边整理一下目前使用到的文件引入方法,以供参考...

一、引入QML文件

先在本地文件夹中创建好分类的文件夹和qml文件,然后在Qt Creator中右键Source Files添加现有文件(依旧不理解为什么Qt Creator不直接在本地创建文件夹)

然后查看CMakeLists中的qt_add_qml_module

c 复制代码
//如我这边的CMakeList.txt
qt_add_qml_module(apptest
    URI test								//这边是模块名
    VERSION 1.0							//这边是版本号
    QML_FILES main.qml
    QML_FILES Module/TestMd.qml
)

然后在需要引入的qml文件夹中import模块,并使用即可

c 复制代码
//main.qml
import QtQuick
import test 1.0

Window {
    width: 640
    height: 480
    visible: true
    title: qsTr("Hello World")

    TestMd{
        anchors.centerIn: parent
    }
}

二、引入图片文件

右键apptest,添加新文件Qt Resource File。然后依旧在本地文件夹中创建好文件夹并拖入图片文件,最后在Qt Creator的Resources文件夹中右键添加现有文件即可。

这时注意CMakeLists中的qt_add_qml_module

c 复制代码
//注意这边的路径
qt_add_qml_module(apptest
    URI test
    VERSION 1.0
    QML_FILES main.qml
    QML_FILES Module/TestMd.qml
    RESOURCES Resrc.qrc
    RESOURCES Icon/1.png
)

在qml中使用QML模块URI+资源在模块中的相对路径(即qt_add_qml_module中的路径) 调用即可

c 复制代码
//示例
import QtQuick
import test 1.0

Window {
    width: 640
    height: 480
    visible: true
    title: qsTr("Hello World")

    Image {
        id:testimg
        source: "qrc:/test/Icon/1.png"
        anchors.centerIn: parent
        height: 80
        width: 50
    }
}

三、后续待补...

相关推荐
玄同76513 小时前
从 0 到 1:用 Python 开发 MCP 工具,让 AI 智能体拥有 “超能力”
开发语言·人工智能·python·agent·ai编程·mcp·trae
czy878747513 小时前
深入了解 C++ 中的 `std::bind` 函数
开发语言·c++
消失的旧时光-194313 小时前
从 Kotlin 到 Dart:为什么 sealed 是处理「多种返回结果」的最佳方式?
android·开发语言·flutter·架构·kotlin·sealed
yq19820430115613 小时前
静思书屋:基于Java Web技术栈构建高性能图书信息平台实践
java·开发语言·前端
一个public的class13 小时前
你在浏览器输入一个网址,到底发生了什么?
java·开发语言·javascript
Jinkxs13 小时前
Gradle - 与Groovy/Kotlin DSL对比 构建脚本语言选择指南
android·开发语言·kotlin
&有梦想的咸鱼&13 小时前
Kotlin委托机制的底层实现深度解析(74)
android·开发语言·kotlin
我在人间贩卖青春13 小时前
C++之继承的方式
c++·private·public·protected·继承方式
BD_Marathon14 小时前
设计模式——依赖倒转原则
java·开发语言·设计模式
stevenson_aspdotnet14 小时前
QT5.15.12 编译备忘
qt