HarmonyOS 如何获取 base64图片的图片原始宽高

图片验证码场景,服务端返回两张base64 格式图片 背景图与验证图,需要根据背景图、原图大小计算缩放系数,从而计算验证图的大小与定位信息

HarmonyOS
2024-12-20 16:14:27
771浏览
收藏 0
回答 1
回答 1
按赞同
/
按时间
shlp

使用Image Kit的能力,参考文档:https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/js-apis-image-V5#imageinfo

demo:

import util from '@ohos.util';
import { image } from '@kit.ImageKit';
@Entry
@Component
struct Index {
  @State message: string = 'getImage';
  @StorageLink('test') test: object = new Object;
  @State imageBase64: string =
    'iVBORw0KGgoAAAANSUhEUgAAADwAAAAUCAYAAADRA14pAAABN0lEQVR42mP4P8IAAy0Mjf6xAYxHnIcHo6cZaOlZYj38VbESjIech5E9SayHYZ5FxnT1cL7uFwxMbt4lxtPYPElLjzNg8ywhMWp6GOZBeiVzDA/jinFySmZSkzUpHn5oLosXk+1hYj2NXliRUnjh8hy5MYzP0wzEeIzUvEyNGCY3WZMUw5Qm61EPjzQPkwIGjYfp4VlsnianIULIs3gbHvT2LLZWFzVLZ7xNS3p7lBqAGM+CPZy6o+w/DGfvrv5ffagTjtuOT/4/8cxcOF50Zc3/5dc3wvHeh0fh+PDjk/8vv74Bx/c+PPz/8utrOP7559fg8LD/uqT/A4GpHdB7Q/XBmFBAMyBLPv70DCWWTjw7h2L42pvbUCxGdlTPqRkoji7Y24DiqdCN6f8HKnCRMcNA5bmBCmgACwohlRAJ3H4AAAAASUVORK5CYII='
  @State pixelMap: image.PixelMap | undefined = undefined;
  build() {
    Column() {
      Text(this.message)
        .id('HelloWorld')
        .fontSize(50)
        .fontWeight(FontWeight.Bold)
        .onClick(async () => {
          let helper = new util.Base64Helper();
          let buffer: ArrayBuffer = helper.decodeSync(this.imageBase64, util.Type.MIME).buffer as ArrayBuffer;
          let imageSource = image.createImageSource(buffer);
          let opts: image.DecodingOptions = { editable: true };
          this.pixelMap = await imageSource.createPixelMap(opts);
          this.pixelMap.getImageInfo().then((imageInfo : image.ImageInfo) => {
            if (imageInfo == undefined) {
              console.error(`Failed to obtain the image pixel map information.`);
            }
            let wit = imageInfo.size.width;
            let hig = imageInfo.size.height;
            console.log(`Succeeded in obtaining the image pixel map information., ${JSON.stringify(wit)}, ${JSON.stringify(hig)}`);
          })
        })
    }
    .height('100%')
    .width('100%')
  }
}
  • 1.
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.
  • 7.
  • 8.
  • 9.
  • 10.
  • 11.
  • 12.
  • 13.
  • 14.
  • 15.
  • 16.
  • 17.
  • 18.
  • 19.
  • 20.
  • 21.
  • 22.
  • 23.
  • 24.
  • 25.
  • 26.
  • 27.
  • 28.
  • 29.
  • 30.
  • 31.
  • 32.
  • 33.
  • 34.
  • 35.
  • 36.
分享
微博
QQ
微信
回复
2024-12-20 17:53:55


相关问题
HarmonyOS 图片base64
950浏览 • 1回复 待解决
HarmonyOS 图片Base64编码
843浏览 • 1回复 待解决
HarmonyOS 图片压缩和图片base64
1188浏览 • 1回复 待解决
HarmonyOS base64图片如何转成Arraybuffer
551浏览 • 1回复 待解决
HarmonyOS Image如何显示base64图片
1294浏览 • 1回复 待解决
HarmonyOS 如何实现Base64数据转图片
911浏览 • 1回复 待解决
HarmonyOS如何图片Base64
1977浏览 • 1回复 待解决
HarmonyOS 图片进行base64编码报错
1385浏览 • 1回复 待解决
HarmonyOS 拍照后图片base64
695浏览 • 1回复 待解决
如何base64转换成图片
11528浏览 • 2回复 待解决
HarmonyOS 获取图片
886浏览 • 1回复 待解决
怎么把PixelMap图片BASE64
10379浏览 • 1回复 待解决
HarmonyOS 如何base64图片保存到相册
1384浏览 • 1回复 待解决
HarmonyOS 图片操作,合成后导出base64
1001浏览 • 1回复 待解决
HarmonyOS 关于Image组件使用base64图片
1490浏览 • 1回复 待解决
js canvas转base64编码图片不全
12051浏览 • 1回复 待解决
HarmonyOS 如何base64图片保存到相册
2441浏览 • 1回复 待解决
HarmonyOS 如何base64数据转换为图片
1442浏览 • 1回复 待解决
HarmonyOS 如何图片压缩并转成base64
1269浏览 • 1回复 待解决
鸿蒙如何获取Element图片
8602浏览 • 1回复 待解决