如何使用Ubuntu SDK DownloadManager来同时下载多个文件

在上一篇文章“如何使用Ubuntu SDK中的Download Manager来下载文件”中，我们已经介绍了如何使用SingleDownload来下载一个文件。在这篇文章中我们将介绍如何使用DownloadManager来同时下载多个文件。

我们可以按照同样的方法创建一个简单的“QML App with Simple UI (qmlproject)”项目。关于DownloadManager的具体的API描述，可以具体看上一篇文章。这里就不再累述。我们可以申明一个DownloadManager的实例：

DownloadManager {
id: manager

onDownloadsChanged: {
console.log("something is changed!");
var length = downloads.length;

console.log("length: " + length);

for (var i = 0; i < length; i ++ ) {
downloads[i].finished.connect(onFinished);
}

function onFinished(path) {
console.log("path: " + path);
mymodel.append( {"filename" : path })
}
}
}

记得要加上如下的库：

import Ubuntu.DownloadManager 0.1

在这里，为了得到所下载文件的信息，我们捕获信号“onDownloadsChanged”，并对它进行动态信号／槽绑定：

for (var i = 0; i < length; i ++ ) {
downloads[i].finished.connect(onFinished);
}

这样我们就可以得到下载的文件了。其它的就没有什么特别的。这里要理解downloads中的每个为SingleDownload。这样就不难理解了。

我们修改我们的Main.qml如下：

import QtQuick 2.0
import Ubuntu.Components 1.1
import Ubuntu.DownloadManager 0.1

/*!
\brief MainView with a Label and Button elements.
*/

MainView {
// objectName for functional testing purposes (autopilot-qt5)
objectName: "mainView"

// Note! applicationName needs to match the "name" field of the click manifest
applicationName: "downloadmanager.liu-xiao-guo"

/*
This property enables the application to change orientation
when the device is rotated. The default is false.
*/
//automaticOrientation: true

// Removes the old toolbar and enables new features of the new header.
useDeprecatedToolbar: false

width: units.gu(60)
height: units.gu(85)

Page {
title: i18n.tr("Download Manager")

ListModel {
id: mymodel
}

DownloadManager {
id: manager

onDownloadsChanged: {
console.log("something is changed!");
var length = downloads.length;

console.log("length: " + length);

for (var i = 0; i < length; i ++ ) {
downloads[i].finished.connect(onFinished);
}

function onFinished(path) {
console.log("path: " + path);
mymodel.append( {"filename" : path })
}
}
}

TextField {
id: text
placeholderText: "File URL to download..."
height: units.gu(5)
anchors {
left: parent.left
right: button.left
rightMargin: units.gu(2)
}

text: "http://img0.bdstatic.com/img/image/6446027056db8afa73b23eaf953dadde1410240902.jpg"
}

Button {
id: button
text: "Download"
height: 50
anchors.top: text.top
anchors.bottom: text.bottom
anchors.right: parent.right
anchors.verticalCenter: text.verticalCenter
onClicked: {
manager.download(text.text);
}
}

ListView {
id: list
clip: true
anchors {
left: parent.left
right: parent.right
top: text.bottom
}
height: units.gu(20)
model: manager.downloads
delegate: ProgressBar {
width: parent.width

minimumValue: 0
maximumValue: 100
value: modelData.progress
}
}

GridView {
id: pics
clip: true
anchors.bottom: parent.bottom
anchors.left: parent.left
anchors.right: parent.right
anchors.top: list.bottom

model: mymodel
cellWidth: pics.width/4; cellHeight: cellWidth + units.gu(2)
delegate: Image {
width: parent.width / 4
height: width + units.gu(2)

source: filename
fillMode: Image.PreserveAspectFit
}
}
}
}

运行应用，显示为：



我们可以修改下载的链接地址，也可以直接按下下载按钮。每次都会产生一个新的下载。我们把照片显示出来。

所有源码在：https://github.com/liu-xiao-guo/downloadmanager