• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1/*
2 * Copyright (c) 2023 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 */
15
16import picker from '@ohos.file.picker';
17import { logger } from '@ohos/uploaddownload';
18
19const TAG: string = 'AddPictures';
20
21@Extend(Image) function imageStyle() {
22  .width('100%')
23  .aspectRatio(1)
24  .objectFit(ImageFit.Fill)
25  .backgroundColor($r('app.color.light_gray'))
26  .borderRadius(12)
27}
28
29@Component
30export struct AddPictures {
31  @Consume imageList: Array<string>;
32
33  build() {
34    Column() {
35      Text($r('app.string.tip'))
36        .fontColor($r('app.color.text_normal'))
37        .fontWeight(400)
38        .fontFamily('HarmonyHeiTi')
39        .fontSize(14)
40        .opacity(0.4)
41        .margin({ top: 16, bottom: 48 })
42        .width('100%')
43      GridRow({ columns: { sm: 3, md: 6, lg: 8 }, gutter: 12 }) {
44        ForEach(this.imageList, (item: string) => {
45          GridCol({ span: 1 }) {
46            Image(item)
47              .imageStyle()
48          }
49        })
50        GridCol({ span: 1 }) {
51          Row() {
52            Image($r('app.media.ic_public_add'))
53              .size({ width: 24, height: 24 })
54              .objectFit(ImageFit.Contain)
55          }
56          .width('100%')
57          .height('100%')
58          .justifyContent(FlexAlign.Center)
59        }
60        .width('100%')
61        .aspectRatio(1)
62        .backgroundColor($r('app.color.white'))
63        .borderRadius(12)
64        .onClick(() => {
65          this.showDialog();
66        })
67      }
68    }
69    .width('100%')
70  }
71
72  addImages = (images: Array<string>) => {
73    images.forEach((item: string) => {
74      if (!this.imageList.includes(item)) {
75        this.imageList.push(item);
76      }
77    })
78    logger.info(TAG, `addImages imageList=${JSON.stringify(this.imageList)}`);
79  }
80
81  showDialog() {
82    AlertDialog.show({
83      message: $r('app.string.pick_album'),
84      alignment: DialogAlignment.Bottom,
85      offset: { dx: 0, dy: -12 },
86      primaryButton: {
87        value: $r('app.string.cancel'),
88        fontColor: $r('app.color.btn_text_blue'),
89        action: () => {
90        }
91      },
92      secondaryButton: {
93        value: $r('app.string.ok'),
94        fontColor: $r('app.color.btn_text_blue'),
95        action: () => {
96          try {
97            let photoSelectOptions = new picker.PhotoSelectOptions();
98            photoSelectOptions.MIMEType = picker.PhotoViewMIMETypes.IMAGE_TYPE;
99            photoSelectOptions.maxSelectNumber = 5;
100            let photoPicker = new picker.PhotoViewPicker();
101            photoPicker.select(photoSelectOptions).then((photoSelectResult: picker.PhotoSelectResult) => {
102              this.addImages(photoSelectResult.photoUris);
103            }).catch((err: Error) => {
104              logger.info(TAG, `'PhotoViewPicker.select failed with err: ${JSON.stringify(err)}`);
105            });
106          } catch (err) {
107            logger.info(TAG, `'PhotoViewPicker failed with err: ${JSON.stringify(err)}`);
108          }
109        }
110      }
111    })
112  }
113}