Qt 如何创建项目以将UI qml接口导入其他应用程序

我有一个使用服务器/客户端功能的项目。我的项目布局是：

• 项目w/子项目
• -服务器
• ---一些文件（不重要）
• -客户端显示
• ---Display.qml-->主视图
• ---ViewPerform.ui.qml-->用于创建视图的ui显示
• ---Viewer.qml-->运行按钮单击和javascript

我能够毫无问题地运行服务器和客户端。现在，我想让

Viewer

和

ViewerForm

可用于不同的应用程序。例如：

独立客户端应用程序（仅客户端显示）

导入到另一个应用程序中，该应用程序可能具有多种UI页面，其中一种是客户端显示

如何设置它，使我只有一个

Viewer

项目，并且可以将它导入到不同的应用程序中。这应该是一个Qt插件吗？模块？我查看了，并创建了一个

ViewerPlugin

项目，作为它自己的项目，其中包含

viewerPerform.ui.qml

、

Viewer.qml

、几个组件

*.ui.qml

和

*.qml

文件以及javascript文件，如下所示。当我构建

ViewerPlugin

时，它会创建一个

ViewerPlugin

文件夹，其中包含以下文件：

ViewerPlugin.dll

、

ViewerPlugin.exp

、

ViewerPlugin.lib

和

qmldir

。然后，我将这个文件夹复制到我的客户机应用程序中，并像导入查看器1.0一样导入Display.QML中的QML插件。但是我得到了它找不到的构建错误：CListView.qml和其他qml文件

viewerplugin.pro

QT += quick qml serialport core webengine webchannel

CONFIG += c++11 qt
CONFIG += qtquickcompiler

RESOURCES += qml.qrc

!include($${top_srcdir}/common/common.pri) {
    error("Couldn't find common.pri file")
}

!include($${top_srcdir}/qmake-target-platform.pri) {
    error("Couldn't find qmake-target-platform.pri file")
}

!include($${top_srcdir}/qmake-destination-path.pri) {
    error("Couldn't find qmake-destination-path.pri file")
}

SOURCES += \
    main.cpp

DESTDIR = $${top_srcdir}/binaries/$$DESTINATION_PATH
OBJECTS_DIR = $${top_srcdir}/build/$$DESTINATION_PATH/.obj
MOC_DIR = $${top_srcdir}/build/$$DESTINATION_PATH/.moc
RCC_DIR = $${top_srcdir}/build/$$DESTINATION_PATH/.qrc
UI_DIR = $${top_srcdir}/build/$$DESTINATION_PATH/.ui

# The following define makes your compiler emit warnings if you use
# any Qt feature that has been marked deprecated (the exact warnings
# depend on your compiler). Refer to the documentation for the
# deprecated API to know how to port your code away from it.
DEFINES += QT_DEPRECATED_WARNINGS

DISTFILES += \
    Display.qml

# ViewerPlugin needs to be copied to binaries executable directory
CONFIG += file_copies
COPIES += ViewerPlugin
ViewerPlugin.files = $$files($${Viewer}/*)
ViewerPlugin.path = $${DESTDIR}/Viewer

# Additional import path used to resolve QML modules in Qt Creator's code model
QML_IMPORT_PATH = ${top_srcdir}

# Additional import path used to resolve QML modules just for Qt Quick Designer
QML_DESIGNER_IMPORT_PATH =

TEMPLATE=lib
TARGET=ViewerPlugin
QT+=qml快速
CONFIG+=qt插件c++11
DESTDIR=../imports/Viewer
目标=$$qtLibraryTarget（$$TARGET）
uri=查看器
#输入
来源+=\
viewerplugin_plugin.cpp\
viewer.cpp
标题+=\
viewerplugin_plugin.h\
查看器.h
DISTFILES+=qmldir\
Viewer.qml\
viewPerform.ui.qml\
组件/CListView.qml\
组件/CListViewForm.ui.qml\
组件/起重机滑块形式.ui.qml\
组件/CSliderForm.ui.qml\
组件/IconButtonForm.ui.qml\
组件/按住Button.qml\
组件/TextButton.qml
资源+=qml.qrc
!等于（_PRO_FILE_PWD，$$OUT_PWD）{
复制\u qmldir.target=$$OUT\u PWD/qmldir
复制\u qmldir.dependens=$$\u PRO\u文件\u PWD\uqmldir
复制\u qmldir.commands=$（复制\u文件）“$$replace（复制\u qmldir.depends，/，$$QMAKE\u DIR\u SEP）”“$$replace（复制\u qmldir.target，/，$$QMAKE\u DIR\u SEP）”
QMAKE_EXTRA_TARGETS+=复制qmldir
PRE_TARGETDEPS+=$$copy_qmldir.target
}
qmldir.files=qmldir
#将qmldir文件复制到与插件二进制文件相同的文件夹中
cpqmldir.files=qmldir
cpqmldir.path=$$DESTDIR
拷贝数+=cpqmldir

qml.qrc

viewPerform.ui.qml
组件/IconButtonForm.ui.qml
组件/起重机滑块形式.ui.qml
组件/CSliderForm.ui.qml
组件/CListView.qml
组件/TextButton.qml
HTML5/index.html
HTML5/loader.css
参考资料/Fontsome-webfont.ttf

qmldir

module Viewer
CListView 1.0 CListView.qml
CListViewForm 1.0 CListViewForm.ui.qml
CRangeSliderForm 1.0 CRangeSliderForm.ui.qml
CSliderForm 1.0 CSliderForm.ui.qml
IconButtonForm 1.0 IconButtonForm.ui.qml
PressAndHoldButton 1.0 PressAndHoldButton.qml
TextButton 1.0 TextButton.qml
plugin ViewerPlugin

组件和HTML5文件夹的存在如

.pro

文件所述。

viewerplugin\u plugin.h/cpp

和

viewer.h/cpp

是从Qt5向导创建的基本文件，用于扩展

qqqmlextensionplugin

以下是尝试导入ViewerPlugin的文件：

Client.pro

QT += quick qml serialport core webengine webchannel

CONFIG += c++11 qt
CONFIG += qtquickcompiler

RESOURCES += qml.qrc

!include($${top_srcdir}/common/common.pri) {
    error("Couldn't find common.pri file")
}

!include($${top_srcdir}/qmake-target-platform.pri) {
    error("Couldn't find qmake-target-platform.pri file")
}

!include($${top_srcdir}/qmake-destination-path.pri) {
    error("Couldn't find qmake-destination-path.pri file")
}

SOURCES += \
    main.cpp

DESTDIR = $${top_srcdir}/binaries/$$DESTINATION_PATH
OBJECTS_DIR = $${top_srcdir}/build/$$DESTINATION_PATH/.obj
MOC_DIR = $${top_srcdir}/build/$$DESTINATION_PATH/.moc
RCC_DIR = $${top_srcdir}/build/$$DESTINATION_PATH/.qrc
UI_DIR = $${top_srcdir}/build/$$DESTINATION_PATH/.ui

# The following define makes your compiler emit warnings if you use
# any Qt feature that has been marked deprecated (the exact warnings
# depend on your compiler). Refer to the documentation for the
# deprecated API to know how to port your code away from it.
DEFINES += QT_DEPRECATED_WARNINGS

DISTFILES += \
    Display.qml

# ViewerPlugin needs to be copied to binaries executable directory
CONFIG += file_copies
COPIES += ViewerPlugin
ViewerPlugin.files = $$files($${Viewer}/*)
ViewerPlugin.path = $${DESTDIR}/Viewer

# Additional import path used to resolve QML modules in Qt Creator's code model
QML_IMPORT_PATH = ${top_srcdir}

# Additional import path used to resolve QML modules just for Qt Quick Designer
QML_DESIGNER_IMPORT_PATH =

qml.qrc

Display.qml

main.cpp

#包括
#包括
#包括
#包括
#包括
int main（int argc，char*argv[]）
{
qputenv（“QT_IM_模块”，QByteArray（“qtvirtualkeyboard”）；
QGuiApplication:：setAttribute（Qt:：AA_enableHighdDiscaling）；
QGUI应用程序应用程序（argc、argv）；
QtWebEngine:：initialize（）；
qqmlaplicationengine；
const QUrl url（QStringLiteral（“qrc:/Display.qml”）；
QObject:：connect（&engine），&QQmlApplicationEngine:：objectCreated，
&应用程序，[url]（QObject*obj，const-quorl和objUrl）{
如果（！obj&&url==objUrl）
QCoreApplication:：退出（-1）；
}，Qt:：QueuedConnection）；
引擎加载（url）；
返回app.exec（）；
}

Display.qml

导入查看器1.0 应用程序窗口{ id:窗口 可见性：“最大化” 可见：正确 观景表演{ id:查看器 }

---

看起来我所需要做的只是更新qmldir文件以添加：Viewer 1.0 qrc:/Viewer.qml，它就工作了。

您是否尝试将

.qml

文件从

组件
文件夹移到根目录中？我认为qml对文件夹结构要求非常严格。如果移出有效，您可以尝试添加另一个
qmldir
文件在
components
文件夹中导入
Viewer.components
（注意大写）看起来我所需要做的就是更新qmldir文件以添加：
Viewer 1.0 qrc:/Viewer.qml
，它就可以工作了。