黑莓OS10开发(4) 在QML中添加对象(上)

在QML文件中添加附属对象，需要遵循以下几个步骤

本例将示范如何在QML中添加一个DataModel对象

1.增加添加对象的.h(.hpp)文件

ListData.h#ifndef LISTDATA_H_#define LISTDATA_H_#include <bb/cascades/DataModel>#include <bb/data/DataAccessReply.hpp>using namespace bb::data;using namespace bb::cascades;class ListData : public DataModel{Q_OBJECTpublic:ListData();virtual ~ListData();Q_INVOKABLEint childCount(const QVariantList &indexPath);Q_INVOKABLEbool hasChildren(const QVariantList &indexPath);Q_INVOKABLEQVariant data(const QVariantList &indexPath);Q_INVOKABLEvoid loadData();private:int i;QVariantList modelList;};#endif /* LISTDATA_H_ */

注意，当派生自DataModel时，需要默认实现三个方法：

childCount,hasChildren,data

当需要声明为attachedObjects时，需要添加Q_OBJECT关键字，当未添加则会在运行时出现以下错误

TypeError: Result of expression 'XXX' [undefined] is not a function

2.添加.cpp文件。

cpp实现和一般化没有什么区别。这里是一个例子

#include "ListData.h"ListData::ListData() {i=0;}ListData::~ListData() {}int ListData::childCount(const QVariantList &indexPath){return 0;}bool ListData::hasChildren(const QVariantList &indexPath){return false;}QVariant ListData::data(const QVariantList &indexPath){return modelList.at(0);}void ListData::loadData(){fprintf(stderr,"loaddata");}

3.在qml使用前注册该Object

在你调用该qml文件前的cpp文件中，附加上以下代码

#include "ListData.h"...onSystemLanguageChanged();    qmlRegisterType<ListData>("custom",1,0,"ListData");

注意此处的custom为qml中使用的namespace,ListData为你需要映射的对象，1和0分别是版本号(maybe，没研究过)

4.接下来需要在config.pri文件中添加编译路径

例如

 SOURCES +=  $$quote($$BASEDIR/src/applicationui.cpp) \                 $$quote($$BASEDIR/src/main.cpp)需要改变为 SOURCES +=  $$quote($$BASEDIR/src/ListData.cpp) \                 $$quote($$BASEDIR/src/applicationui.cpp) \                 $$quote($$BASEDIR/src/main.cpp)

这里没什么特别大的问题，记得都加上就可以了。

OK。准备工作完成。现在是在QML中引用了

import bb.cascades 1.2import custom 1.0NavigationPane {    id: navigationPane        // The initial page    Page {        content: Container {            Button {                text: "Display first Page"                                onClicked: {                    navigationPane.push(firstPage);                }            }                        Button {                text: "Display second Page"                                onClicked: {                    navigationPane.push(secondPage);                }            }            Button{                text:"onload"                onClicked: {                    listdata.loadData();//引用对象的loadData()方法                }            }                        ListView {                id: messagelist                dataModel: listdata                            }        } // end of Container    } // end of Page        attachedObjects: [        ListData {            id:listdata        },        Page {            id: firstPage            content: Container {                Label {                    text: "First attachedObjects Page"                }            }        },        Page {            id: secondPage            content: Container {                Label {                    text: "Second attachedObjects Page"                }            }        } // end of Page    ] // end of attachedObjects list} // end of NavigationPane

至此attachedObjects步骤完毕。下一篇将讲述如何将数据填充到ListView中