import { request } from '@kit.BasicServicesKit';
import { FileDownloadItem } from '../view/FileDownloadItem';const NO_TASK: number = 0;function downloadConfig(downloadUrl: string): request.agent.Config {const config: request.agent.Config = {action: request.agent.Action.DOWNLOAD,url: downloadUrl,overwrite: true,method: 'GET',saveas: './',mode: request.agent.Mode.BACKGROUND,gauge: true,retry: false};return config;
}@Entry
@Component
struct MultipleFilesDownload {/*** enter the download urls*/private downloadUrlArray: string[] = ["https://m.down.sandai.net/mobile/OfficialSite_MobileThunder1.apk"];@State downloadConfigArray: request.agent.Config[] = [];@State isStartAllDownload: boolean = false;@State downloadCount: number = 0;@State downloadFailCount: number = 0;aboutToAppear(): void {for (let i = 0; i < this.downloadUrlArray.length; i++) {const config: request.agent.Config = downloadConfig(this.downloadUrlArray[i]);this.downloadConfigArray.push(config);}this.downloadCount = this.downloadUrlArray.length;}build() {Column() {Row() {Text($r('app.string.multiple_files_download_transfer_list')).fontWeight(FontWeight.Bold).fontSize($r('app.integer.title_font_size')).width('100%').fontColor($r('app.color.text_color'))}.alignItems(VerticalAlign.Bottom).width('91.1%').height(112)Row() {Row() {Text($r('app.string.multiple_files_download_queue')).fontSize($r('app.integer.multiple_files_download_text_font_size_fourteen')).fontColor($r('sys.color.ohos_id_color_text_secondary'))}.width($r('app.string.multiple_files_download_row_width'))Row() {Text(this.isStartAllDownload && this.downloadCount > NO_TASK ? $r('app.string.pause_all') :$r('app.string.start_all')).fontSize($r('app.integer.multiple_files_download_text_font_size_fourteen')).fontWeight(500).fontColor($r('sys.color.ohos_id_color_text_primary_activated')).textAlign(TextAlign.End).width($r('app.string.multiple_files_download_row_text_width')).onClick(() => {if (this.downloadCount === NO_TASK) {this.getUIContext().showAlertDialog({message: $r('app.string.multiple_files_download_completed'),alignment: DialogAlignment.Center});return;}this.isStartAllDownload = !this.isStartAllDownload;})}.width($r('app.string.multiple_files_download_row_width'))}.margin({left: 16,right: 16,top: $r('app.integer.multiple_files_download_margin_top_twenty_eight'),bottom: $r('app.integer.margin_eight')})List() {ForEach(this.downloadConfigArray, (item: request.agent.Config) => {ListItem() {FileDownloadItem({downloadConfig: item,isStartAllDownload: this.isStartAllDownload,downloadCount: this.downloadCount,downloadFailCount: this.downloadFailCount})}}, (item: request.agent.Config) => JSON.stringify(item))}.width('100%').height('100%')}.focusable(false)}
}@Builder
export function getMultipleFilesDownload(): void {MultipleFilesDownload();
}

import { common } from '@kit.AbilityKit';
import { request } from '@kit.BasicServicesKit';
import { hilog } from '@kit.PerformanceAnalysisKit';import { ProgressButton } from './ProgressButton';const uiContext: UIContext | undefined = AppStorage.get('uiContext');const TAG = 'FileDownloadItem';
const BYTE_CONVERSION: number = 1024;
const context = uiContext!.getHostContext()! as common.UIAbilityContext;function getFileNameFromUrl(url: string): string {const segments = url.split('/');let tmp = segments.pop() || '';if (tmp.indexOf('?') != -1) {return tmp.split('?')[0];}return tmp;
}@Component
export struct FileDownloadItem {@State downloadConfig: request.agent.Config = { action: request.agent.Action.DOWNLOAD, url: '' };@State fileName: string = '';@State textState: string | Resource = "";@Link @Watch('onDownLoadUpdated') isStartAllDownload: boolean;private downloadTask: request.agent.Task | undefined = undefined;@Link downloadCount: number;@Link downloadFailCount: number;@State isShow: boolean = false;@State downloading: boolean = false;@State sFileSize: string | number = "-";@State nFileSize: number = 0;@State sCurrentDownloadSize: string = "-";@State @Watch('updateProgress') nCurrentDownloadSize: number = 0;@State progress: number = 0;@State isPaused: boolean = false;private completedCallback = (progress: request.agent.Progress) => {this.textState = $r("app.string.download_completed");if (this.sFileSize === -1) {this.sFileSize = this.sCurrentDownloadSizethis.nCurrentDownloadSize = 1;}this.downloadCount--;}private failedCallback = (progress: request.agent.Progress) => {this.textState = $r("app.string.download_fail");this.downloadFailCount++;if (this.downloadFailCount === this.downloadCount) {this.isStartAllDownload = false;}if (this.downloadTask) {request.agent.show(this.downloadTask.tid, (err: Error, taskInfo: request.agent.TaskInfo) => {if (err) {hilog.error(0x0000, TAG, 'agent show error:', err);return;}});}}private pauseCallback = (progress: request.agent.Progress) => {this.isPaused = true;this.downloading = false;this.textState = $r("app.string.paused");}private resumeCallback = (progress: request.agent.Progress) => {this.isPaused = false;this.textState = $r("app.string.downloading");this.downloading = true;}private progressCallback = (progress: request.agent.Progress) => {this.textState = $r("app.string.downloading");this.downloading = true;this.isShow = true;if (this.downloadTask) {if (this.sFileSize === '-') {if (progress.sizes[0] === -1) {this.sFileSize = -1;this.nCurrentDownloadSize = 0;this.nFileSize = 1;} else {this.nFileSize = progress.sizes[0];this.sFileSize = (progress.sizes[0] / BYTE_CONVERSION).toFixed() + 'kb';this.nCurrentDownloadSize = progress.processed;}} else if (this.sFileSize === -1) {hilog.info(0x0000, TAG, 'file size unknown');} else {this.nCurrentDownloadSize = progress.processed;}this.sCurrentDownloadSize = (progress.processed / BYTE_CONVERSION).toFixed() + 'kb';}}private responseCallback = (response: request.agent.HttpResponse) => {hilog.info(0x0000, TAG, 'response:' + response.statusCode);};updateProgress() {setTimeout(() => {if (this.textState == $r("app.string.paused")) {this.isPaused = true;return;}let tmp = this.nCurrentDownloadSize / this.nFileSize * 100;if (tmp <= this.progress) {return;}this.progress = tmp;}, 10)}aboutToAppear(): void {this.fileName = getFileNameFromUrl(this.downloadConfig.url);}onDownLoadUpdated(): void {if (this.isStartAllDownload) {if (this.textState === $r("app.string.download_fail")) {this.downloadTask = undefined;this.isShow = false;this.textState = "";}this.startDownload();} else {if (this.downloadFailCount > 0 && this.downloadFailCount === this.downloadCount) {this.downloadFailCount = 0;} else {this.pauseDownload();}}}startDownload(): void {if (this.downloadTask === undefined) {request.agent.create(context, this.downloadConfig).then((task: request.agent.Task) => {task.on('completed', this.completedCallback);task.on('failed', this.failedCallback);task.on('pause', this.pauseCallback);task.on('resume', this.resumeCallback);task.on('progress', this.progressCallback);task.on('response', this.responseCallback);task.start().then(() => {this.downloadTask = task;}).catch((err: Error) => {hilog.error(0x0000, TAG, 'task start error:', err);})}).catch((err: Error) => {hilog.error(0x0000, TAG, 'create error:', err);});} else {this.resumeDownload();}}pauseOrResumeDownload(): void {if (this.downloadTask) {request.agent.show(this.downloadTask.tid, (err: Error, taskInfo: request.agent.TaskInfo) => {if (err) {hilog.error(0x0000, TAG, 'agent show error:', err);return;}if (taskInfo.progress.state === request.agent.State.PAUSED) {this.resumeDownload();} else {this.pauseDownload();}});}}pauseDownload(): void {if (this.downloadTask) {request.agent.show(this.downloadTask.tid, (err: Error, taskInfo: request.agent.TaskInfo) => {if (err) {hilog.error(0x0000, TAG, 'agent show error:', err);return;}if (this.downloadTask && (taskInfo.progress.state === request.agent.State.WAITING || taskInfo.progress.state=== request.agent.State.RUNNING || taskInfo.progress.state === request.agent.State.RETRYING)) {this.downloadTask.pause().then(() => {}).catch((err: Error) => {hilog.error(0x0000, TAG, 'task pause error:', err);});}});}}resumeDownload(): void {if (this.downloadTask) {request.agent.show(this.downloadTask.tid, (err: Error, taskInfo: request.agent.TaskInfo) => {if (err) {hilog.error(0x0000, TAG, 'agent show error:', err);return;}if (this.downloadTask && taskInfo.progress.state === request.agent.State.PAUSED) {this.downloadTask.resume().then(() => {}).catch((err: Error) => {hilog.error(0x0000, TAG, 'task resume error:', err);});}});}}build() {RelativeContainer() {Image($r('app.media.multiple_files_download_file')).height($r("app.integer.multiple_files_download_image_size")).width($r("app.integer.multiple_files_download_image_size")).id('fileImage').alignRules({center: { anchor: '__container__', align: VerticalAlign.Center }})Text(this.fileName).fontSize($r("app.integer.multiple_files_download_text_font_size")).padding({ left: $r("app.integer.multiple_files_download_padding") }).alignRules({left: { anchor: 'fileImage', align: HorizontalAlign.End },top: { anchor: 'fileImage', align: VerticalAlign.Top },}).fontWeight(FontWeight.Medium).margin({ top: $r('app.integer.item_name_top_margin') }).id('fileName')ProgressButton({paused: this.isPaused,progress: this.progress,progressButtonWidth: $r('app.integer.progress_btn_width'),content: this.textState,enable: true,clickCallback: () => {this.pauseOrResumeDownload();}}).visibility(this.isShow ? Visibility.Visible : Visibility.Hidden).alignRules({right: { anchor: '__container__', align: HorizontalAlign.End },center: { anchor: '__container__', align: VerticalAlign.Center }})Text(this.sCurrentDownloadSize + "/" + this.sFileSize).fontSize($r('app.integer.multiple_files_download_text_font_size_fourteen')).width($r('app.string.multiple_files_download_text_width')).fontColor($r('app.color.multiple_files_download_text_font_color')).margin({ top: $r("app.integer.multiple_files_download_margin_top") }).padding({ left: $r("app.integer.multiple_files_download_padding") }).alignRules({top: { anchor: 'fileName', align: VerticalAlign.Bottom },left: { anchor: 'fileImage', align: HorizontalAlign.End }}).id('downloadVal')}.height($r('app.integer.item_height')).margin({ left: 16, right: 16 }).padding({ left: 12, right: 12 })}
}

const EMPTY_STRING: string = '';
const MAX_PROGRESS: number = 100;
const MAX_PERCENTAGE: string = '100%';
const MIN_PERCENTAGE: string = '0%';
const TEXT_OPACITY: number = 0.4;
const BUTTON_NORMAL_WIDTH: number = 44;
const BUTTON_NORMAL_HEIGHT: number = 28;
const BUTTON_BORDER_RADIUS: number = 14;
const TEXT_ENABLE: number = 1.0;
const MIN_WIDTH: Length = 44;
const PADDING_TEXT: Length = 8;const PROGRESS_BUTTON_PROGRESS_KEY = 'progress_button_progress_key';
const PROGRESS_BUTTON_PRIMARY_FONT_KEY = 'progress_button_primary_font_key';
const PROGRESS_BUTTON_CONTAINER_BACKGROUND_COLOR_KEY = 'progress_button_container_background_color_key';
const PROGRESS_BUTTON_EMPHASIZE_SECONDARY_BUTTON_KEY = 'progress_button_emphasize_secondary_button_key';@Component
export struct ProgressButton {@Prop @Watch('updateText') paused: boolean = false;@Prop @Watch('getProgressContext') progress: number;@State textProgress: string = EMPTY_STRING;@Prop content: string | Resource = EMPTY_STRING;@State isLoading: boolean = false;progressButtonWidth?: Length = BUTTON_NORMAL_WIDTH;clickCallback: () => void = () => {};@Prop enable: boolean = true;@State progressColor: ResourceColor = '#330A59F7';@State containerBorderColor: ResourceColor = '#330A59F7';@State containerBackgroundColor: ResourceColor = $r('sys.color.ohos_id_color_foreground_contrary');private getButtonProgress(): number {if (this.progress < 0) {return 0;} else if (this.progress > MAX_PROGRESS) {return MAX_PROGRESS;}return this.progress;}updateText() {if (this.paused) {setTimeout(() => {this.isLoading = !this.paused;}, 10);} else {this.isLoading = !this.paused;}}private getProgressContext() {if (this.progress < 0) {this.isLoading = false;this.textProgress = MIN_PERCENTAGE;} else if (this.progress >= MAX_PROGRESS) {this.isLoading = false;this.textProgress = MAX_PERCENTAGE;} else {this.isLoading = true;this.textProgress = Math.floor(this.progress / MAX_PROGRESS * MAX_PROGRESS).toString() + "%";}}build() {Button() {Stack() {Progress({value: this.getButtonProgress(), total: MAX_PROGRESS,style: ProgressStyle.Capsule}).height(BUTTON_NORMAL_HEIGHT).borderRadius(BUTTON_BORDER_RADIUS).width('100%').hoverEffect(HoverEffect.None).clip(false).enabled(this.enable).key(PROGRESS_BUTTON_PROGRESS_KEY).color(this.progressColor)Text(this.isLoading ? this.textProgress : this.content).fontSize($r('sys.float.ohos_id_text_size_button3')).fontWeight(FontWeight.Medium).key(PROGRESS_BUTTON_PRIMARY_FONT_KEY).maxLines(1).textOverflow({ overflow: TextOverflow.Ellipsis }).padding({ left: PADDING_TEXT, right: PADDING_TEXT }).opacity(this.enable ? TEXT_ENABLE : TEXT_OPACITY)Row().key(PROGRESS_BUTTON_CONTAINER_BACKGROUND_COLOR_KEY).backgroundColor(Color.Transparent).border({ width: 1, color: this.containerBorderColor }).height(BUTTON_NORMAL_HEIGHT).borderRadius(BUTTON_BORDER_RADIUS).width('100%')}}.borderRadius(BUTTON_BORDER_RADIUS).clip(false).hoverEffect(HoverEffect.None).key(PROGRESS_BUTTON_EMPHASIZE_SECONDARY_BUTTON_KEY).backgroundColor(this.containerBackgroundColor).constraintSize({ minWidth: MIN_WIDTH }).width((!this.progressButtonWidth || this.progressButtonWidth < BUTTON_NORMAL_WIDTH) ?BUTTON_NORMAL_WIDTH : this.progressButtonWidth).stateEffect(this.enable).onClick(() => {if (!this.enable) {return;}if (this.progress < MAX_PROGRESS) {this.isLoading = !this.isLoading;}this.clickCallback && this.clickCallback();})}
}

{"module": {"name": "entry","type": "entry","description": "$string:module_desc","mainElement": "EntryAbility","deviceTypes": ["phone"],"requestPermissions": [{"name": "ohos.permission.INTERNET","reason": "$string:reason_internet","usedScene": {"abilities": ["EntryAbility"],"when": "always"}},],"deliveryWithInstall": true,"installationFree": false,"pages": "$profile:main_pages","abilities": [{"name": "EntryAbility","srcEntry": "./ets/entryability/EntryAbility.ets","description": "$string:EntryAbility_desc","icon": "$media:layered_image","label": "$string:EntryAbility_label","startWindowIcon": "$media:startIcon","startWindowBackground": "$color:start_window_background","exported": true,"skills": [{"entities": ["entity.system.home"],"actions": ["action.system.home"]}]}]}
}