• 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 * 实现步骤：
18 *  1. 集成三方库libheif及其依赖库libde265来实现软解码，集成网络库curl，这样在Native侧就可以直接请求到HEIF图片，并在Native侧解码，减少跨语言调用开销
19 *  2. 网络请求和HEIF图片软解码使用Taskpool来实现多线程并发能力
20 *  3. 在HEIF软解码过程中
21 *    3.1 通过heif_context_read_from_memory_without_copy读取网络请求到的HEIF资源（已存在内存中）
22 *    3.2 调用解码接口heif_decode_image解码HEIF图片
23 *    3.3 调用heif_image_get_plane_readonly获取HEIF图片数据data
24 *    3.4 字节对齐和颜色编码格式转换
25 *    3.5 定义HEIF的宽高、颜色编码格式，调用NDK的OH_PixelMap_CreatePixelMap函数即可创建PixelMap
26 *  4. WaterFlow + LazyForEach加载解码后的HEIF图片数据
27 */
28
29import { heifUrls, ImageInfo, WaterFlowDataSource } from './model/WaterFlowData';
30import { ReusableFlowItem } from './components/ReusableFlowItem';
31import { executeTasks } from './model/Taskpool';
32
33
34@Component
35export struct DecodeHEIFImageView {
36  private dataSource: WaterFlowDataSource = new WaterFlowDataSource();
37
38  aboutToAppear(): void {
39    // TODO：知识点：在Taskpool中执行异步并发任务（网络请求和图片软解码）
40    executeTasks(heifUrls, this.dataSource);
41  }
42
43  build() {
44    Column() {
45      WaterFlow() {
46        // TODO: 知识点: LazyForEach提供列表数据按需加载能力，解决一次性加载长列表数据耗时长、占用过多资源的问题，可以提升页面响应速度
47        LazyForEach(this.dataSource, (item: ImageInfo) => {
48          FlowItem() {
49            ReusableFlowItem({ item })
50          }
51          .width('100%')
52          .margin({
53            top: $r('app.integer.decode_heif_image_flow_item_margin_top'),
54            bottom: $r('app.integer.decode_heif_image_flow_item_margin_bottom')
55          })
56        }, (item: ImageInfo, index: number) => index + JSON.stringify(item))
57      }
58      .cachedCount(1)  // 当前案例数据量少设置为1，如果数据量较多可适当调整
59      .columnsTemplate('1fr 1fr')
60      .columnsGap($r('app.integer.decode_heif_image_water_flow_column_gap'))
61    }
62    .width('100%')
63    .height('100%')
64    .padding($r('app.integer.decode_heif_image_padding'))
65    .backgroundColor($r('app.color.decode_heif_image_background_color'))
66  }
67}
68