图片压缩,image.packing,怎么指定大小、宽高?

上传头像的时候需要压缩图片,例如40003000的图片想要压缩到500500,且大小在100kb以内

HarmonyOS
2024-05-08 23:04:02
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
NGKSWCIDT

参考demo:

初始化图片资源到沙箱

async aboutToAppear(): Promise<void> {
const resourceManager = getContext(this).resourceManager
const imageArray = await resourceManager.getMediaContent($r('app.media.100'));

console.log("yuv_path is:" + path);
let file = fs.openSync(path, fs.OpenMode.READ_WRITE | fs.OpenMode.CREATE);

fs.write(file.fd, imageArray.buffer).then((writeLen) => {
console.info("write data to file succeed and size is:" + writeLen);
fs.closeSync(file);
}).catch((err: BusinessError) => {
console.info("write data to file failed with error message: " + err.message + ", error code: " + err.code);
});
}

创建pixelMap,并调用压缩方法

/ // path为已获得的沙箱路径
const imageSource: image.ImageSource = image.createImageSource(path);

//创建pixelMap
this.pixelMap = await imageSource.createPixelMap(decodingOptions);

console.log("6666661" + this.pixelMap.getPixelBytesNumber());
//指定压缩宽、高、大小
this.packingDetail(500, 500, 100)

根据压缩后目标图片宽高计算缩放比 并进行缩放,调用packing方法实现第一次压缩

if (this.pixelMap) {
Logger.info("zhaohao before scaling pixelmap." + this.pixelMap.getPixelBytesNumber());

let imageInfo = await this.pixelMap.getImageInfo();

let a = this.pixelMap
//计算压缩比
let scaleX: number = targetWidth / imageInfo.size.width;
let scaleY: number = targetHeight / imageInfo.size.height;
this.pixelMap.scale(scaleX, scaleY, (err: BusinessError) => {
if (err) {
console.error("zhaohao Failed to scale pixelmap.");
return;
} else {
console.log("zhaohao in scaling pixelmap." + a.getPixelBytesNumber());
}
});
}
let imagePackerApi = image.createImagePacker();
let packOpts: image.PackingOption = { format: "image/jpeg", quality: 100 };
imagePackerApi.packing(this.pixelMap, packOpts).then((data: ArrayBuffer) => {
Logger.info("zhaohao in 100 quality data" + data.byteLength)
this.compressPictures(data, targetPixelSize, 99);
});

调用递归算法,当压缩后的data ,小于等于压缩目标图片大小时将data写入本地沙箱并结束递归

compressPictures(data?: ArrayBuffer, size?: number, quality?: number): void {
if (data && size && quality) {
const currentSize = data.byteLength / 1024
if (currentSize <= size || quality === 0) {
console.log("finally quallity is:" + ++quality)
let file = fs.openSync(path9, fs.OpenMode.READ_WRITE | fs.OpenMode.CREATE);
fs.write(file.fd, data).then(async (writeLen) => {
console.info("write data to file succeed2 and size is:" + writeLen);
fs.closeSync(file);
}).catch((err: BusinessError) => {
console.info("write data to file failed1 with error message: " + err.message + ", error code: " + err.code);
});
return;
}
}
if (quality) {
let packOpts: image.PackingOption = { format: "image/jpeg", quality: quality }
let imagePackerApi = image.createImagePacker();
imagePackerApi.packing(this.pixelMap, packOpts)
.then((ret: ArrayBuffer) => {
//递归算法,直到压缩到指定大小的data
if (quality) {
Logger.info("PACKING66666"+quality)
return this.compressPictures(ret, size, quality - 1)
}

}).catch((err: BusinessError) => {
console.log(`lbh`)
return false
})
}
}
分享
微博
QQ
微信
回复
2024-05-09 12:16:08
相关问题
如何将图片PixelMap压缩指定大小
156浏览 • 1回复 待解决
JS UI框架中canvas如何动态指定
4824浏览 • 1回复 待解决
鸿蒙如何获取Element图片
5772浏览 • 1回复 待解决
如何获取图片,你知道吗?
366浏览 • 1回复 待解决
Image怎么替换svg图片
6498浏览 • 1回复 待解决
HarmonyOS中的window怎么设置固定
133浏览 • 1回复 待解决
ArkTs如何获取组件的
2694浏览 • 1回复 待解决
如何获取窗口的信息
405浏览 • 1回复 待解决
鸿蒙能获取图片指定大小的缩略图吗
7632浏览 • 1回复 待解决
java如何获取屏幕。找不到api?
3885浏览 • 1回复 待解决
如何获取组件的,你学会了吗?
721浏览 • 1回复 待解决
java鸿蒙Tab框架 image图片怎么渲染的
5266浏览 • 2回复 待解决
属性动画如何实现动画效果
252浏览 • 1回复 待解决
服务卡片image怎么获取网络图片
5190浏览 • 2回复 待解决
屏幕如何获取 ,求解决方法
119浏览 • 1回复 待解决
如何获取屏幕,你知道吗?
552浏览 • 1回复 待解决