从另一个qml文件中读取数据并显示在ListView中

从下面的文档,你可以看到一些代码片段演示了如何创建一个简单的ListView.

http://doc-snapshot.qt-project.org/qdoc/qml-qtquick-listview.html#model-prop

我把这些组装起来,放在一个演示程序中。在我的项目中,目录结构如下:

listview1$ tree
.
├── imports
│   └── model
│       ├── ContactModel.qml
│       └── qmldir
├── run.sh
└── test.qml

这个演示程序包含了一个test.qml文件和另一个plugin. 这个plugin只包含了一个ContactModel.qml文件,没有C++动态库。

qmldir描述了从这个plugin暴露出来的module.

module model
ContactModel 1.0 ContactModel.qml


这个ContactModel.qml文件是一个用于给ListView提供数据的model.

import QtQuick 2.0
ListModel {
    ListElement {
        name: "Bill Smith"
        number: "555 3264"
    }
    ListElement {
        name: "John Brown"
        number: "555 8426"
    }
    ListElement {
        name: "Sam Wise"
        number: "555 0473"
    }
}

在test.qml文件中,将ContactModel应用到model属性上。delegate是用于遍历model中所有ListElements的方法,并且将每个ListElement作为一个Text 块显示在窗口。

import QtQuick 2.0
import model 1.0
ListView {
    width: 180; height: 200
    model: ContactModel {}
    delegate: Text {
        text: name + ": " + number
    }
}

要编译这个程序,运行下面的命令:

qmake
make

要运行的话:

~/Qt5.2.0/5.2.0/gcc_64/bin/qmlscene -I ./imports ./test.qml




你可能感兴趣的:(qt,qml)