HarmonyOS 根据接口返回的图片地址,打开图片实现图片的自由放大缩小并下载到相册

使用说明:

1、双指捏合对图片进行缩放。

3、双击图片进行图片的大小切换,在放大状态下,双击可恢复默认状态。

3、图片在放大模式下,滑动图片查看图片的对应位置。

4、下载图片到相册。

HarmonyOS
2025-01-10 09:05:14
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
superinsect

还请参考下此demo,通过将网络图片转换为PixelMap操作图片:https://gitee.com/harmonyos-cases/cases/blob/master/CommonAppDevelopment/feature/imageviewer/README.md

import http from '@ohos.net.http';
import image from '@ohos.multimedia.image';
import { BusinessError } from '@ohos.base';

@Entry
@Component
struct ImageToPixelMap {
  @State image: PixelMap | undefined = undefined;
  httpRequest() {
    http.createHttp().request(
      "xxx",
      (error: BusinessError, data: http.HttpResponse) => {
        if (error) {
          console.error(`http reqeust failed with. Code: ${error.code}, message: ${error.message}`);
        } else {
          console.error('http reqeust success.');
          let imageData: ArrayBuffer = data.result as ArrayBuffer;
          let imageSource: image.ImageSource = image.createImageSource(imageData);
          console.error(`http reqeust size = ${imageData.byteLength}`);
          class tmp {
            height: number = 100
            width: number = 100
          }
          let options: Record<string, number | boolean | tmp> = {
            'alphaType': 0, // 透明度
            'editable': false, // 是否可编辑
            'pixelFormat': 3, // 像素格式
            'scaleMode': 1, // 缩略值
            'size': { height: 100, width: 100 }
          } // 创建图片大小
          imageSource.createPixelMap(options).then((pixelMap: PixelMap) => {
            this.image = pixelMap
          })
        }
      }
    )
  }
  build() {
    Column(){
      Button("获取网络图片")
        .onClick(() => {
          this.httpRequest()
        })
      Image(this.image)
        .height(200).width(200)
    }.width('100%').height('100%')
  }
}
分享
微博
QQ
微信
回复
2025-01-10 10:38:29
相关问题
HarmonyOS 点击图片放大缩小
373浏览 • 1回复 待解决
如何获取拍照后图片地址
2125浏览 • 1回复 待解决
HarmonyOS 怎么下载图片显示
267浏览 • 1回复 待解决