Qt and qml Call each other

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";
           }
       }
   }

}