将 QML 与 Qt Widgets 相结合完整

将QML与QtWidgets相结合简述在使用QtWidgets时，经常要实现一些比较炫酷的效果（例如：滑动、翻页），这时选择QML会显得非常简单。那么，问题来了：能不能将QML和QtWidgets结合在一起使用？如果能，都有什么方式？QML和QtWidgets之间又该如何交互？|版权声明：一去、二三里，未经博主允许不得转载。一个简单的QML创建了一个简单的QML文件，用于显示一个绿色的矩形，其中包含一个文本。为了说明QML与QtWidgets的交互，在矩形中添加了两个信号。importQtQuick2.1Rectangle{id:rootcolor:"green"width:200height:200//发送给QtWidgets的信号signalqmlSignal//从QtWidgets接收到的信号signalcSignalText{id:myTexttext:"Clickme"font.pointSize:14anchors.centerIn:parent}MouseArea{anchors.fill:parentonClicked:qmlSignal()}//信号处理程序（处理从QtWidgets接收到的信号）onCSignal:{root.color="blue"myText.text="Calltheqmlsignalhandler"}}12345678910111213141516171819202122232425262728293031如果需要，可以将像往常一样使用qmlscene来运行。加载和显示QML要加载和显示QML，可以使用以下两种方式：QQuickWidgetQQuickView无论使用哪种方式，一旦主源文件的URL被指定，都将自动加载和显示QML视图。注意：在QML运行环境中，还介绍了另一种方式-QQmlEngine+QQmlComponent，但是这种方式不能以view的形式加载。使用QQuickWidgetQQuickWidget是Qt5.3中提供的一个类，继承自QWidget，它是QQuickWindow一个很方便的包装器，用于显示QtQuick用户界面。使用方式：QQuickWidget*view=newQQuickWidget;view->setSource(QUrl::fromLocalFile("myqmlfile.qml"));view->show();123使用QQuickViewQQuickView是Qt5.0中提供的一个类，继承自QQuickWindow（继承自QWindow），用于显示QtQuick用户界面。使用方式：QQuickView*view=newQQuickView;view->setSource(QUrl::fromLocalFile("myqmlfile.qml"));view->show();123可以看到，两者的使用方式几乎没什么区别。但是，QQuickWidget基于QWidget，而QQuickView基于QWindow，所以需要将其转换为QWidget，才能与QtWidgets相结合。这样，就需要再引入一个函数：[static]QWidget*QWidget::createWindowContainer(QWindow*window,QWidget*parent=Q_NULLPTR,Qt::WindowFlagsflags=Qt::WindowFlags())该函数用于创建一个QWidget，可以将window嵌入到基于QWidget的应用程序中。所以，要将QQuickView转为QWidget，可以使用下述方式：QQuickView*view=newQQuickView();QWidget*widget=QWidget::createWindowContainer(view,this);view->setSource(QUrl("qrc:/main.qml"));123将QML与QtWidgets相结合当一切准备就绪，就可以将QML与QtWidgets完美结合在一起了：最终效果：源码如下：#include"widget.h"#include<QQuickView>#include<QVBoxLayout>#include<QQuickWidget>Widget::Widget(QWidget*parent):QWidget(parent){resize(300,300);//方式一//QQuickView*pView=newQQuickView();//QWidget*pWidget=QWidget::createWindowContainer(pView,this);//pView->setResizeMode(QQuickView::SizeRootObjectToView);//pView->setSource(QUrl("qrc:/main.qml"));//方式二QQuickWidget*pWidget=newQQuickWidget();pWidget->setResizeMode(QQuickWidget::SizeRootObjectToView);pWidget->setSource(QUrl("qrc:/main.qml"));m_pButton=newQPushButton(this);m_pButton->setText("QtWidgets...");QVBoxLayout*pLayout=newQVBoxLayout();pLayout->addWidget(pWidget);pLayout->addWidget(m_pButton);pLayout->setSpacing(10);pLayout->setContentsMargins(10,10,10,10);setLayout(pLayout);//QML与QtWidgets通信//QObject*pRoot=(QObject*)pView->rootObject();QObject*pRoot=(QObject*)pWidget->rootObject();if(pRoot!=NULL){connect(pRoot,SIGNAL(qmlSignal()),this,SLOT(receiveFromQml()));connect(m_pButton,SIGNAL(clicked(bool)),pRoot,SIGNAL(cSignal()));}}voidWidget::receiveFromQml(){m