0

我从下面的 Web 服务获取 JSON 数据：

"List1": [
        {
            "id": "1",
            "title": "Title1",
            "picture":"myURL"
        },
        {
            "id": "2",
            "title": "Title2",
            "picture":"myURL" 
        }
]

现在，我想ListView使用这个 JSON 数据创建一个自定义，带有标题和图像。

我为此尝试了很多例子。部分链接如下：

http://qt-project.org/wiki/JSONListModel http://developer.blackberry.com/native/documentation/cascades/device_platform/data_access/using_data_source.html

但是，我仍然找不到任何解决方案。你能帮我解决这个问题吗？

4

1 回答 1

1

创建一个列表是很简单的任务。这有点困难，因为您想显示来自互联网的图像，因此您必须为此使用自定义类。下载WebImageView.cpp和WebImageView.h并将它们添加到/src目录中（如果您想查看整个项目或按照我的步骤操作）。

在里面添加以下内容applicationui.cpp以包含新类

#include "WebImageView.h"

并在里面ApplicationUI(bb::cascades::Application *app)添加

qmlRegisterType<WebImageView>("org.labsquare", 1, 0, "WebImageView");

所以你的 QML 可以访问这个类。

这是一个完整的 QML 工作示例：

import bb.cascades 1.2
import bb.data 1.0
import org.labsquare 1.0

NavigationPane {
    id: nav
    Page {
        Container {
            ListView {
                dataModel: dataModel 
                listItemComponents: [
                    ListItemComponent {
                        type: "item"
                        content: Container {
                            Label {
                                text: ListItemData.title
                            }
                            WebImageView {
                                url: "http://adev.si/files/"+ListItemData.picture
                            }
                        }
                    }
                ]
                attachedObjects: [
                    GroupDataModel {
                        id: dataModel
                        grouping: ItemGrouping.None
                    },
                    DataSource {
                        id: dataSource
                        source: "http://adev.si/files/someData.json"
                        remote: true
                        onDataLoaded: {
                            dataModel.insertList(data.List1)
                        }
                    }
                ]
            }
        }
    }
    onCreationCompleted: {
        dataSource.load();
    }
}

我希望这会有所帮助。您还需要在 .pro 文件中使用它

LIBS   += -lbbdata
QT += network

如果你愿意，你可以导入这个项目并使用它。

于 2014-06-23T14:21:42.610 回答