Qt自定义QML模块

自定义QML模块

含义为将常用风格的Button，Text,RadioButton,或者自定义的控件作为一个控件进行使用，节省代码。

优点：

• 代码简洁，减少重复代码
• 自定义的控件进行封装重复使用
• 可以与QML自带的库区别开来
• 优化项目结构

一、创建模块

1. 创建文件夹
在项目目录下创建自定义模块的文件夹名称，例如：

mkdir ./controls #在项目根目录下创建文件夹

2. 创建控件文件
上一步创建了controls文件夹，所以此模块为自定义控件的集合。

创建自定义的Button和Text文件

touch Button.qml Text.qml

3. 导入项目
将此controls文件夹添加到项目中

4. 自定义控件

Button.qml文件

import QtQuick 2.5
import QtQuick.Controls 2.1

Button {
    property int clickedTimes: 0;
    //定义一些默认属性的设置，大小，颜色等
}

Text.qml文件

import QtQuick 2.5
import QtQuick.Controls 2.1

Text{
    property string city: "shanghai";
    //定义一些默认属性的设置，大小，颜色等
}

5. 自定义模块的使用

main.qml文件

import QtQuick 2.5
import QtQuick.Controls 2.1
import QtQuick.Layouts 1.1
import "./controls" as MyControls //as会将controls目录下的自定义控件加载进来

ApplicationWindow {
    visible: true;
    width: 1280;
    height: 720;
    title: qsTr("Photo");

    MyControls.Button {
        clickedTimes: dada;
    }

    MyControls.Text {
        city: "beijing";
    }
}