I found a solution. I followed the below Steps:
1.Created a QtCreator Extension Plugin
2.In Pro file: Add
uri = mycompany.qmlcomponents
version =1.0
3.Added my CustomControl QML file.
4.Registered using qmlRegisterType
5.In qml dir:
module mycompany.qmlcomponents
plugin MyExtensionPlugin
classname MyExtensionPlugin
typeinfo mycompany.qmlcomponents
designersupported
5.Wrote the MetaInfo file (myextensionplugin.metainfo):
MetaInfo {
Type {
name: "mycompany.qmlcomponents.MyCustomItem"
icon: "images/customitem-icon.png"
ItemLibraryEntry {
name: "CustomItem"
category: "My Extension - Items"
libraryIcon: "images/customitem-icon.png"
version: "1.0"
requiredImport: "mycompany.qmlcomponents"
Property {
name: "itemItext"
type: "binding"
value: "qsTr(\"Button\")"
}
}
}
}
6.Create a designer folder
7.Add following to designer.pri
QML_FILES +=
$$PWD/CustomItemSpecifics.qml
QML_FILES += $$PWD/myextensionplugin.metainfo
QML_FILES +=
$$PWD/images/customitem-icon.png
8.Build and install
9.Generate qmltypes: [You can also do this during qmake]
qmlplugindump mycompany.qmlcomponents1.0 > plugins.qmltypes
10.The controls will be available in the qml designer.
Check the unsupported properties for custom controls:
http://doc.qt.io/qtcreator/creator-quick-ui-forms.html