• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1/*
2 * Copyright (c) 2025 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
16/**
17 * 播放PixelMap数组动画
18 */
19import {AnimationOptions, AnimatedDrawableDescriptor} from '@kit.ArkUI';
20import { image } from '@kit.ImageKit';
21
22@Entry
23@Component
24struct ImageExample {
25  pixelMaps: PixelMap[] = [];
26  options: AnimationOptions = { iterations: 1 };
27  @State animated: AnimatedDrawableDescriptor | undefined = undefined;
28
29  async aboutToAppear() {
30    this.pixelMaps = await this.getPixelMaps();
31    this.animated = new AnimatedDrawableDescriptor(this.pixelMaps, this.options);
32  }
33
34  build() {
35    Column() {
36      Row() {
37        Image(this.animated)
38          .width('500px').height('500px')
39          .onFinish(() => {
40            console.info('finish');
41          })
42      }.height('50%')
43      Row() {
44        Button('once').width(100).padding(5).onClick(() => {
45          this.options = { iterations: 1 };
46          this.animated = new AnimatedDrawableDescriptor(this.pixelMaps, this.options);
47        }).margin(5)
48        Button('infinite').width(100).padding(5).onClick(() => {
49          this.options = { iterations: -1 };
50          this.animated = new AnimatedDrawableDescriptor(this.pixelMaps, this.options);
51        }).margin(5)
52      }
53    }.width('50%')
54  }
55
56  private async getPixmapListFromMedia(resource: Resource) {
57    let unit8Array = await this.getUIContext().getHostContext()?.resourceManager?.getMediaContent({
58      bundleName: resource.bundleName,
59      moduleName: resource.moduleName,
60      id: resource.id
61    });
62    let imageSource = image.createImageSource(unit8Array?.buffer.slice(0, unit8Array.buffer.byteLength));
63    let createPixelMap: image.PixelMap[] = await imageSource.createPixelMapList({
64      desiredPixelFormat: image.PixelMapFormat.RGBA_8888
65    });
66    await imageSource.release();
67    return createPixelMap;
68  }
69
70  private async getPixmapFromMedia(resource: Resource) {
71    let unit8Array = await this.getUIContext().getHostContext()?.resourceManager?.getMediaContent({
72      bundleName: resource.bundleName,
73      moduleName: resource.moduleName,
74      id: resource.id
75    });
76    let imageSource = image.createImageSource(unit8Array?.buffer.slice(0, unit8Array.buffer.byteLength));
77    let createPixelMap: image.PixelMap = await imageSource.createPixelMap({
78      desiredPixelFormat: image.PixelMapFormat.RGBA_8888
79    });
80    await imageSource.release();
81    return createPixelMap;
82  }
83
84  private async getPixelMaps() {
85    let myPixelMaps:PixelMap[] = await this.getPixmapListFromMedia($r('app.media.mountain')); //添加图片
86    myPixelMaps.push(await this.getPixmapFromMedia($r('app.media.sky')));
87    myPixelMaps.push(await this.getPixmapFromMedia($r('app.media.clouds')));
88    myPixelMaps.push(await this.getPixmapFromMedia($r('app.media.landscape')));
89    return myPixelMaps;
90  }
91}