Qt and qml Call each other

最新推荐文章于 2022-02-04 16:17:57 发布

laohuang1122

最新推荐文章于 2022-02-04 16:17:57 发布

阅读量780

点赞数

分类专栏： Qt 嵌入式linux

嵌入式linux 同时被 2 个专栏收录

56 篇文章

订阅专栏

12 篇文章

订阅专栏

本文分享了参加Nokia Codeprint活动的心得体会，详细介绍了使用QML实现UI设计的过程及与JS、C++进行交互的方法。通过实例展示了如何将背景颜色等属性暴露给QML组件，并在QML中调用C++实现的功能。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

今天去参加了nokia的code print，还是学到些东西的，nokia用qml脚本实现前端的ui酷炫效果，后边用js或者实现逻辑，看起来很强大，产品设计者直接用ui designer设计ui，programmer直接在ui上开发逻辑，省去了symbian前端ui大量的繁琐工作，也发现些缺点，就是qml不能断点跟踪，只能打log。在此qml调用js的就不介绍了，调用c++的部分还是蛮不错的，再复杂的程序，用c++实现，也是蛮不错。此例子是可以运行的，demo上的qml文件有些问题。

To expose data to a QML component instance, applications set context properties which are then accessible by name from QML Property Bindings and JavaScript. The following example shows how to expose a background color to a QML file through QDeclarativeView:

// main.h

#include <QApplication>
 #include <QDeclarativeView>
 #include <QDeclarativeContext>
// main.cpp
 class Stopwatch : public QObject
 {
     Q_OBJECT
 public:
     Stopwatch();
 
     Q_INVOKABLE bool isRunning() const;
 
 public slots:
     void start();
     void stop();
 
 private:
     bool m_running;
 };

// main.cpp

 int main(int argc, char *argv[])
 {
    QApplication app(argc, argv);
 
    QDeclarativeView view;
    view.rootContext()->setContextProperty("stopwatch",
                                           new Stopwatch);
 
    view.setSource(QUrl::fromLocalFile("main.qml"));//qt调用qml
    //view.setSource(QUrl("qrc:/main.qml"));
    view.show();
 
    return app.exec();
 }

// main.qml

import Qt 4.7
 
Rectangle {
    width: 300
    height: 300
    radius: 20
 
    Text {
        id: helloText
        text: "ImageView"
	x: 80
        y: 5
        anchors.horizontalCenter: page.horizontalCenter
        font.pointSize: 24; font.bold: true
    }
 
    MouseArea {
        id: mouseArea; anchors.fill: parent
        onClicked: {
            if (stopwatch.isRunning())//qml调用c++方法
            {
                stopwatch.stop()  ;
                helloText.color = "black";
            }
            else
            {
                 stopwatch.start();//qml调用c++方法
                 helloText.color = "red";
            }
        }
    }
}

http://www.developer.nokia.com/Community/Wiki/Qt_and_qml_Call_each_other