QML嵌入Qt Widgets及信号槽的连接

简介

最近在学习QML，想把QML嵌入到Qwidgets中，用来实现一些动画。本文参考知名博主一去、二三里的文章《将 QML 与 Qt Widgets 相结合》

本程序实现：单击qml页面，更新按钮的文本；单击按钮，更新qml页面的颜色；

使用方法

1、创建QML页面

//main.qml

import QtQuick 2.0

Rectangle {
    id: root
    color: "green"
    width: 200
    height: 200

    // 发送给 Qt Widgets 的信号
    signal qmlSignal
    // 从 Qt Widgets 接收到的信号
    signal cSignal

    Text {
        id: myText
        text: "Click me"
        font.pointSize: 16
        anchors.centerIn: parent
    }

    MouseArea {
        anchors.fill: parent
        onClicked: qmlSignal()
    }

    // 信号处理程序（处理从 Qt Widgets 接收到的信号）
    onCSignal: {
        root.color = Qt.rgba(Math.random(), Math.random(), Math.random(), 1);
        myText.text = "Call qml signal handler"
    }
}

2、创建widget，插入QML

#include "Widget.h"
#include <QQuickView>
#include <QVBoxLayout>
#include <QQuickWidget>

Widget::Widget(QWidget *parent)
    : QWidget(parent)
{
    resize(300, 300);

    // 方式一
    // QQuickView *pView = new QQuickView();
    // QWidget *pWidget = QWidget::createWindowContainer(pView, this);
    // pView->setResizeMode(QQuickView::SizeRootObjectToView);
    // pView->setSource(QUrl("qrc:/main.qml"));

    // 方式二
    QQuickWidget *pWidget = new QQuickWidget();
    pWidget->setResizeMode(QQuickWidget::SizeRootObjectToView);
    pWidget->setSource(QUrl("qrc:/main.qml"));

    m_pButton = new QPushButton(this);
    m_pButton->setText("Qt Widgets...");

    QVBoxLayout *pLayout = new QVBoxLayout();
    pLayout->addWidget(pWidget);
    pLayout->addWidget(m_pButton);
    pLayout->setSpacing(10);
    pLayout->setContentsMargins(10, 10, 10, 10);
    setLayout(pLayout);
    pLayout->setMargin(0);

    // QML 与 Qt Widgets 通信
    // 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()));
    }
}

void Widget::receiveFromQml()
{
    static int i = 0;
    i ++;
    m_pButton->setText(QString("Call Slot %1 times").arg(i));
}

有两种方法向Widget中插入qml，分别是使用QQuickView 和 QQuickWidget。如代码所示。
源码下载地址：https://download.csdn.net/download/baidu_33850454/10605892