Qt and qml Call each other

From Qt Wiki
Jump to navigation Jump to search

Template:ArticleMetaData 今天去参加了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";
           }
       }
   }

}