How to use Qmldir for module management in QML project

About Qmldir This file, in QML Modular management is an essential thing, where the modular is both C + + extension of the module refers to the pure QML expansion of the module

How to use Qmldir for management in pure QML

Refer to document Module Definition qmldir files in QTSDK

Refer to some questions about making Qt Quick 2 Extension plugin-QT

Let's start with a QML project file. Qmlproject

Generally as follows

/* File generated by Qt Creator */import qmlproject 1.1Project {    mainfile: "MAIN.QML"/    * Include. QML,. js, and IM Age files from the current directory and subdirectories *    /qmlfiles {        directory: "."    }    javascriptfiles {        directory: "."    }    imagefiles {        directory: "."    }    /* List of plugin directories passed to QML runtime *    ///importpaths: [". /exampleplugin "]}

The words used are very clear, indicating the path of the qml file for this QML project, the path of the JS file, the picture path, and a importpaths attribute that is automatically commented, is a list object (the array object in JS), and stores the custom QML module path.

It is assumed that the following QML works, the project path is as follows

| Test.qmlproject | modules| | ui| | | qmldir| | | button.qml| | | util.js| Main.qml

Where MAIN.QML is the portal Master file for the QML program, and a modules folder with its directory, there is a UI folder with a custom button.qml, a JS file, and a Qmldir file.

So qmldir the contents of this file are as follows

Module UIButton 1.0./BUTTON.QML Util 1.0./util.js# This is a comment # say syntax # The word that follows the module is the block name, usually the same name as the folder where the Qmldir file is located # The second line, which first describes a custom control ( Element) name, and then specify the version number, and finally specify the corresponding QML file # Third line, first of all, a JS file in the QML is called when the name (similar to the namespace), and then specify the version number, and finally specify the corresponding JS file # More details please search the Module in QTSDK Definition Qmldir Files

Qmldir, specify that the custom element name must start with an uppercase letter, and then specify the version number, which is for version differentiation.

For example, there are two button1.qml and BUTTON2.QML

You can then use the following statements for version differentiation

Button 1.0./button1.qmlbutton 2.0./button2.qml

In the QML project file, you can add such a sentence

importpaths:["./modules"]

The module can be imported by using import in the Qml file of the calling module.

Import UI 1.0;

This makes it easy to invoke the custom element control. You can also manage versioning of controls directly.

In addition, we introduce a UI library implemented by QML.

Qml-material

Demonstrate

How to use Qmldir for module management in QML project