• Qt Qml嵌入Widget以及Qml与Widget交互


    这里是在Win10下,使用Qt5.7.0(cpp+qml)实现Qml嵌入Widget以及Qml与Widget交互。

    QQuickWidget类,可以解决此问题。

    1、先在pro是加入

    QT += quickwidgets

    2、新建QmlWidget类,并继承QWidget。

    main.cpp如下

    #include <QApplication>
    #include "qmlwidget.h"
    
    
    int main(int argc, char *argv[]) {
        QApplication app(argc, argv);
        QmlWidget qmlWidget;
        return app.exec();
    }

    3、qmlwidget.h如下

    #ifndef QMLWIDGET_H
    #define QMLWIDGET_H
    #include <QQuickWidget>
    #include <QQmlEngine>
    #include <QVBoxLayout>
    
    
    class QmlWidget : public QWidget
    {
        Q_OBJECT
    public:
        explicit QmlWidget(QWidget *parent = 0);
    private:
        QVBoxLayout * layout;
        QQuickWidget * quickWidget;
    signals:
        void sigWidget(void);
    public slots:
        void slotWidget(void);
        void btnClicked(void);
    };
    
    
    #endif // QMLWIDGET_H

    4、qmlwidget.cpp如下

    #include "qmlwidget.h"
    #include <QDebug>
    #include <QPushButton>
    QmlWidget::QmlWidget(QWidget *parent) : QWidget(parent) {
        quickWidget = new QQuickWidget();
        quickWidget->setSource(QUrl("qrc:///main.qml"));
    
    
        layout = new QVBoxLayout(this);
        QPushButton *btn1 = new QPushButton(this);
        btn1->setText("widget btn");
        layout->addWidget(btn1);
    
    
        connect(btn1,SIGNAL(clicked(bool)),this,SLOT(btnClicked()));
        QObject * obj = (QObject*)quickWidget->rootObject();
        connect(obj,SIGNAL(qmlClicked()),this,SLOT(slotWidget()));
        connect(this,SIGNAL(sigWidget()),obj,SIGNAL(widgetClicked()));
    
    
        quickWidget->setLayout(layout);
        quickWidget->show();
    }
    void QmlWidget::slotWidget() {
        qDebug()<<"qml sig to widget slot";
        emit sigWidget();
    }
    void QmlWidget::btnClicked() {
        qDebug()<<"widget btn clicked";
    }
    
    

    5、main.qml如下

    import QtQuick 2.4
    import QtQuick.Layouts 1.2
    import QtQuick.Controls 1.4
    import QtQuick.Dialogs 1.2
    
    
    Rectangle {
        id : root;
         300
        height: 300
        color: "yellow"
        signal qmlClicked()
        signal widgetClicked()
        onWidgetClicked: {
            console.log("widget sig to qml slot")
        }
        Button {
            id : qmlBtn
            anchors.top: parent.top
            text : "qml btn"
            onClicked: {
                console.log("qml btn clicked")
            }
        }
        Button {
            anchors.left: qmlBtn.right
            anchors.leftMargin: 8
            text : "connect btn"
            onClicked: {
                qmlClicked()
            }
        }
    }
    
    

    6、运行效果如下

    7、注意事项。

    quickWidget的rootObject()是main.qml中的根对象,也就是root,它要转换为QObject*类型才能使用connect。

    quickWidget不能直接连接到qml的槽上,但是可以连接到qml的信号上,让信号去触发qml的槽。

  • 相关阅读:
    H5 移动端,keyup,keydown,keypress IOS系统无响应
    JS点击图片放大
    windows设备相关位图与设备无关位图
    windows gdi+ Bitmap 总结
    长假无聊的结果:开机时间提示,进程绞杀
    JavaScript通过递归实现深拷贝
    Javascript高级程序设计第七章 | ch7 | 阅读笔记
    修改原型链之后,旧对象仍旧指向原先的原型链
    箭头函数this指向问题
    javascript 类class设置访问器setter时出现Maximum call stack size exceeded错误
  • 原文地址:https://www.cnblogs.com/lvdongjie/p/13536603.html
Copyright © 2020-2023  润新知