前言
最近在学习研究QML,想要自定义组件、信号、属性等,但如何对.qml文件、变量命名却是个问题。习惯了蛇形命名规范后,再让我回到驼峰命名规范,多少是不愿意的。
为了坚守信仰,我翻遍了各大技术网站,然而得到的答复始终就那几篇被转载无数次的文章,几乎都是让用首字母大写的命名规范。
算了,自己摸索试验吧!
答案
场景
自定义一个组件,文件名为my_btn.qml,想要在其它文件中使用该组件,并且声明此类型组件时使用名称MyBtn。
my_btn.qml中还声明了属性变量btn_color,想要在事件中监听该属性值的变化并进行处理。
在QtCreator中的工程目录结构如下:
 
在文件资源管理器中的目录结构如下:

 
其中my_btn.qml与qmldir文件需要位于同一目录components下,qmldir文件是特殊文件,用于描述一个模块及其中包含的组件类型、模块版本号等。
test.qml文件与components文件夹位于同一目录untitled3下,test.qml文件中会使用到模块components里的自定义组件MyBtn。
方法
话不多说,直接上代码。
- untitled3.pro
// qml工程需要包含`quickwidgets`
QT       += core gui quickwidgets
// 声明qml文件根目录
QML_DIR = $$PWD
// 这里导入环境变量,路径为qml文件根目录
QML_IMPORT_PATH += \
    $$QML_DIR
// 添加`qmldir`文件到工程中,用于模块管理
OTHER_FILES += \
    $$QML_DIR/components/qmldir
// 添加工程中所使用到的`.qml`文件,可以用通配符`*`,但它不能匹配多级目录
DISTFILES += \
    $$QML_DIR/*.qml  \
    $$QML_DIR/components/*.qml
- qmldir
# 声明模块名称为`components`
module components
// 组件名称,版本号,组件源文件路径
MyBtn		1.0		my_btn.qml
- my_btn.qml
import QtQuick 2.0
import QtQuick.Controls 2.0
Rectangle {
    // 声明属性`btn_color`
    property color btn_color: '#f00'
    width: 88
    height: 32
    // 绑定属性
    color: btn_color
}
- test.qml
import QtQuick 2.0
import QtQuick.Controls 2.0
// 导入模块`components 1.0`,注意版本号需要与`qmldir`中声明的相匹配
import components 1.0
Item {
    // 使用`my_btn.qml`所定义的组件`MyBtn`
    MyBtn {
        btn_color: 'red'
    }
}
关于我
我是一位喜欢创新、乐观向上的少年
爱好是看书、踢足球、玩LOL等
喜欢我的文章的朋友,可以添加个人微信:CS-huo
有问题可以相互探讨,共同学习!



















