1/* 2 * Copyright (c) 2022 Huawei Device Co., Ltd. 3 * Licensed under the Apache License, Version 2.0 (the "License"); 4 * you may not use this file except in compliance with the License. 5 * You may obtain a copy of the License at 6 * 7 * http://www.apache.org/licenses/LICENSE-2.0 8 * 9 * Unless required by applicable law or agreed to in writing, software 10 * distributed under the License is distributed on an "AS IS" BASIS, 11 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 12 * See the License for the specific language governing permissions and 13 * limitations under the License. 14 */ 15import MediaLib from '@ohos.multimedia.mediaLibrary'; 16import { Log } from '@ohos/base/src/main/ets/utils/Log'; 17import { DateUtil } from '@ohos/base/src/main/ets/utils/DateUtil'; 18import screenManager from '@ohos/base/src/main/ets/manager/ScreenManager'; 19import { Constants } from '../../model/common/Constants'; 20 21@Observed 22export class MediaDetails { 23 mediaType: number 24 height: number 25 width: number 26 size: number 27 path: string 28 duration: number 29 title: string 30 dateTaken: number 31 uri: string 32 displayName: string 33 dateModified: number 34} 35 36@CustomDialog 37export struct DetailsDialog { 38 private TAG: string = 'DetailsDialog' 39 @StorageLink('isHorizontal') isHorizontal: boolean = screenManager.isHorizontal(); 40 @StorageLink('isSidebar') isSidebar: boolean = screenManager.isSidebar(); 41 @StorageLink('leftBlank') leftBlank: [number, number, number, number] = [0, 0, 0, 0]; 42 sizeConvert = 1024; 43 controller: CustomDialogController; 44 dataTime: string; 45 @Consume mediaDetails: MediaDetails; 46 @Consume isDistributedAlbum: boolean; 47 48 aboutToAppear() { 49 let localizedDate = DateUtil.getLocalizedDate(this.mediaDetails.dateTaken); 50 let localizedTime = DateUtil.getLocalizedTime(this.mediaDetails.dateTaken); 51 this.dataTime = `${localizedDate} ${localizedTime}`; 52 } 53 54 getResolution(height: number, width: number): string { 55 return `${width}x${height}`; 56 } 57 58 getTitle() { 59 Log.info(this.TAG, 'getTitle'); 60 if (this.mediaDetails.title) { 61 return this.mediaDetails.title; 62 } 63 let index = this.mediaDetails.displayName.lastIndexOf('.'); 64 return this.mediaDetails.displayName.substr(0, index); 65 } 66 67 getDisplayPath(): string { 68 let showPath = `${this.mediaDetails.path}${this.mediaDetails.displayName}`; 69 return showPath; 70 } 71 72 getSize(size: number): string { 73 if (size / (this.sizeConvert * this.sizeConvert) > 1) { 74 return `${(size / (this.sizeConvert * this.sizeConvert)).toFixed(2)}MB`; 75 } else { 76 return `${(size / this.sizeConvert).toFixed(2)}KB`; 77 } 78 } 79 80 build() { 81 Column() { 82 Row() { 83 Text($r('app.string.details')) 84 .fontSize($r('sys.float.ohos_id_text_size_headline7')) 85 .fontWeight(FontWeight.Medium) 86 .fontColor($r('sys.color.ohos_id_color_text_primary')) 87 }.alignItems(VerticalAlign.Center) 88 .height($r('app.float.dialog_title_height')) 89 90 Row() { 91 Column() { 92 Text($r('app.string.title')) 93 .fontSize($r('sys.float.ohos_id_text_size_body2')) 94 .fontFamily($r('app.string.id_text_font_family_regular')) 95 .fontColor($r('sys.color.ohos_id_color_text_primary')) 96 } 97 98 Column() { 99 Text(this.getTitle()) 100 .fontSize($r('sys.float.ohos_id_text_size_body2')) 101 .fontFamily($r('app.string.id_text_font_family_regular')) 102 .fontColor($r('sys.color.ohos_id_color_text_secondary')) 103 .maxLines(Constants.DETAILS_DIALOG_NAME_MAX_LINE) 104 .padding({ right: $r('app.float.dialog_content_margin') }) 105 } 106 }.alignItems(VerticalAlign.Top) 107 .margin({ bottom: $r('sys.float.ohos_id_text_paragraph_margin_s') }) 108 109 Row() { 110 Column() { 111 Text($r('app.string.time')) 112 .fontSize($r('sys.float.ohos_id_text_size_body2')) 113 .fontFamily($r('app.string.id_text_font_family_regular')) 114 .fontColor($r('sys.color.ohos_id_color_text_primary')) 115 } 116 117 Column() { 118 Text(this.dataTime) 119 .fontSize($r('sys.float.ohos_id_text_size_body2')) 120 .fontFamily($r('app.string.id_text_font_family_regular')) 121 .fontColor($r('sys.color.ohos_id_color_text_secondary')) 122 .textOverflow({ overflow: TextOverflow.Ellipsis }) 123 } 124 }.margin({ 125 bottom: $r('sys.float.ohos_id_text_paragraph_margin_s') }) 126 127 Row() { 128 Column() { 129 Text($r('app.string.size')) 130 .fontSize($r('sys.float.ohos_id_text_size_body2')) 131 .fontFamily($r('app.string.id_text_font_family_regular')) 132 .fontColor($r('sys.color.ohos_id_color_text_primary')) 133 } 134 135 Column() { 136 Text(`${this.getSize(this.mediaDetails.size)}`) 137 .fontSize($r('sys.float.ohos_id_text_size_body2')) 138 .fontFamily($r('app.string.id_text_font_family_regular')) 139 .fontColor($r('sys.color.ohos_id_color_text_secondary')) 140 .textOverflow({ overflow: TextOverflow.Ellipsis }) 141 } 142 }.margin({ 143 bottom: $r('sys.float.ohos_id_text_paragraph_margin_s') }) 144 145 Row() { 146 Column() { 147 Text($r('app.string.resolution')) 148 .fontSize($r('sys.float.ohos_id_text_size_body2')) 149 .fontFamily($r('app.string.id_text_font_family_regular')) 150 .fontColor($r('sys.color.ohos_id_color_text_primary')) 151 } 152 153 Column() { 154 Text(this.getResolution(this.mediaDetails.height, this.mediaDetails.width)) 155 .fontSize($r('sys.float.ohos_id_text_size_body2')) 156 .fontFamily($r('app.string.id_text_font_family_regular')) 157 .fontColor($r('sys.color.ohos_id_color_text_secondary')) 158 .textOverflow({ overflow: TextOverflow.Ellipsis }) 159 } 160 }.margin({ 161 bottom: $r('sys.float.ohos_id_text_paragraph_margin_s') }) 162 163 if (this.mediaDetails.mediaType == MediaLib.MediaType.VIDEO) { 164 Row() { 165 Column() { 166 Text($r('app.string.duration')) 167 .fontSize($r('sys.float.ohos_id_text_size_body2')) 168 .fontFamily($r('app.string.id_text_font_family_regular')) 169 .fontColor($r('sys.color.ohos_id_color_text_primary')) 170 } 171 172 Column() { 173 Text(DateUtil.getFormattedDuration(this.mediaDetails.duration)) 174 .fontSize($r('sys.float.ohos_id_text_size_body2')) 175 .fontFamily($r('app.string.id_text_font_family_regular')) 176 .fontColor($r('sys.color.ohos_id_color_text_secondary')) 177 .textOverflow({ overflow: TextOverflow.Ellipsis }) 178 } 179 }.margin({ 180 bottom: $r('sys.float.ohos_id_text_paragraph_margin_s') }) 181 } 182 if (!this.isDistributedAlbum) { 183 Row() { 184 Column() { 185 Text($r('app.string.path')) 186 .fontSize($r('sys.float.ohos_id_text_size_body2')) 187 .fontFamily($r('app.string.id_text_font_family_regular')) 188 .fontColor($r('sys.color.ohos_id_color_text_primary')) 189 } 190 191 Column() { 192 Text(this.getDisplayPath()) 193 .fontSize($r('sys.float.ohos_id_text_size_body2')) 194 .fontFamily($r('app.string.id_text_font_family_regular')) 195 .fontColor($r('sys.color.ohos_id_color_text_secondary')) 196 .maxLines(Constants.DETAILS_DIALOG_PATH_MAX_LINE) 197 .padding({ right: $r('app.float.dialog_content_margin') }) 198 } 199 }.alignItems(VerticalAlign.Top) 200 .margin({ 201 bottom: $r('sys.float.ohos_id_text_paragraph_margin_s') }) 202 } 203 204 Stack({ alignContent: Alignment.Top }) { 205 Button() { 206 Text($r('app.string.detail_dialog_confirm')) 207 .fontSize($r('sys.float.ohos_id_text_size_button1')) 208 .fontColor($r('app.color.color_control_highlight')) 209 .width('100%') 210 .textAlign(TextAlign.Center) 211 .fontWeight(FontWeight.Medium) 212 } 213 .backgroundColor($r('app.color.transparent')) 214 .height($r('app.float.details_dialog_button_height')) 215 .onClick(() => { 216 this.controller.close() 217 }) 218 }.width('100%') 219 .height($r('app.float.details_dialog_button_area_height')) 220 } 221 .borderRadius($r('app.float.dialog_border_radius')) 222 .width(screenManager.getColumnsWidth(4)) 223 .backgroundColor($r('app.color.white')) 224 .margin({ 225 right: $r('app.float.dialog_window_margin'), 226 left: $r('app.float.dialog_window_margin'), 227 bottom: this.isHorizontal || this.isSidebar ? 0 : Constants.DIALOG_BOTTOM_OFFSET + px2vp(this.leftBlank[3]) 228 }) 229 .padding({ left: $r('app.float.dialog_content_margin'), right: $r('app.float.dialog_content_margin') }) 230 .alignItems(HorizontalAlign.Start) 231 } 232} 233