图片解码指将所支持格式的存档图片解码成统一的PixelMap,以便在应用或系统中进行图片显示或图片处理。当前支持的存档图片格式包括JPEG、PNG、GIF、RAW、WebP、BMP、SVG、ICO。
开发步骤
图片解码相关API的详细介绍请参见:图片解码接口说明。
1.全局导入Image模块。
import image from '@ohos.multimedia.image';
2.获取图片。
- 方法一:获取沙箱路径。具体请参考获取应用文件路径。应用沙箱的介绍及如何向应用沙箱推送文件。
// Stage模型参考如下代码
const context : Context = getContext(this);
const filePath : string = context.cacheDir + '/test.jpg';
// FA模型参考如下代码
import featureAbility from '@ohos.ability.featureAbility';
const context = featureAbility.getContext();
const filePath = context.getCacheDir() + "/test.jpg";
- 方法二:通过沙箱路径获取图片的文件描述符。具体请参考file.fs API参考文档。 该方法需要先导入@ohos.file.fs模块。
import fs from '@ohos.file.fs';
然后调用fs.openSync()获取文件描述符。
// Stage模型参考如下代码
const context = getContext(this);
const filePath = context.cacheDir + '/test.jpg';
const file : fs.File = fs.openSync(filePath, fs.OpenMode.READ_WRITE);
const fd : number = file?.fd;
// FA模型参考如下代码
import featureAbility from '@ohos.ability.featureAbility';
const context = featureAbility.getContext();
const filePath = context.getCacheDir() + "/test.jpg";
const file : fs.File = fs.openSync(filePath, fs.OpenMode.READ_WRITE);
const fd : number = file?.fd;
- 方法三:通过资源管理器获取资源文件的ArrayBuffer。
// Stage模型
const context : Context = getContext(this);
// 获取resourceManager资源管理器
const resourceMgr : resourceManager.ResourceManager = context.resourceManager;
// FA模型
// 导入resourceManager资源管理器
import resourceManager from '@ohos.resourceManager';
import {BusinessError} from '@ohos.base';
resourceManager.getResourceManager().then((resourceMgr : resourceManager.ResourceManager) => {
console.log("Succeeded in getting resourceManager")
}).catch((err : BusinessError) => {
console.error("Failed to get resourceManager")
});
不同模型获取资源管理器的方式不同,获取资源管理器后,再调用
resourceMgr.getRawFileContent()获取资源文件的ArrayBuffer。
resourceMgr.getRawFileContent('test.jpg').then((fileData : Uint8Array) => {
console.log("Succeeded in getting RawFileContent")
// 获取图片的ArrayBuffer
const buffer = fileData.buffer.slice(0);
}).catch((err : BusinessError) => {
console.error("Failed to get RawFileContent")
});
- 方法四:通过资源管理器获取资源文件的RawFileDescriptor。
// Stage模型
const context : Context = getContext(this);
// 获取resourceManager资源管理器
const resourceMgr : resourceManager.ResourceManager = context.resourceManager;
// FA模型
// 导入resourceManager资源管理器
import resourceManager from '@ohos.resourceManager';
import {BusinessError} from '@ohos.base';
resourceManager.getResourceManager().then((resourceMgr : resourceManager.ResourceManager) => {
console.log("Succeeded in getting resourceManager")
}).catch((err : BusinessError) => {
console.error("Failed to get resourceManager")
});
不同模型获取资源管理器的方式不同,获取资源管理器后,再调用resourceMgr.getRawFd()获取资源文件的RawFileDescriptor。
resourceMgr.getRawFd('test.jpg').then((rawFileDescriptor : resourceManager.RawFileDescriptor) => {
console.log("Succeeded in getting resourceManager")
}).catch((err : BusinessError) => {
console.error("Failed to get resourceManager")
});
3.创建ImageSource实例。
- 方法一:通过沙箱路径创建ImageSource。沙箱路径可以通过步骤2的方法一获取。
// path为已获得的沙箱路径
const imageSource : image.ImageSource = image.createImageSource(filePath);
- 方法二:通过文件描述符fd创建ImageSource。文件描述符可以通过步骤2的方法二获取。
// fd为已获得的文件描述符
const imageSource : image.ImageSource = image.createImageSource(fd);
- 方法三:通过缓冲区数组创建ImageSource。缓冲区数组可以通过步骤2的方法三获取。
const imageSource : image.ImageSource = image.createImageSource(buffer);
- 方法四:通过资源文件的RawFileDescriptor创建ImageSource。RawFileDescriptor可以通过步骤2的方案四获取。
const imageSource : image.ImageSource = image.createImageSource(rawFileDescriptor);
4.设置解码参数DecodingOptions,解码获取PixelMap图片对象。
import {BusinessError} from '@ohos.base';
let decodingOptions : image.DecodingOptions = {
editable: true,
desiredPixelFormat: 3,
}
// 创建pixelMap并进行简单的旋转和缩放
imageSource.createPixelMap(decodingOptions).then((pixelMap : image.PixelMap) => {
console.log("Succeeded in creating PixelMap")
}).catch((err : BusinessError) => {
console.error("Failed to create PixelMap")
});
解码完成,获取到PixelMap对象后,可以进行后续图片处理。
5.释放pixelMap。
pixelMap.release();
开发示例-对资源文件中的图片进行解码
1.获取resourceManager资源管理。
const context : Context = getContext(this);
// 获取resourceManager资源管理
const resourceMgr : resourceManager.ResourceManager = context.resourceManager;
2.创建ImageSource。
- 通过rawfile文件夹下test.jpg的ArrayBuffer创建。
resourceMgr.getRawFileContent('test.jpg').then((fileData : Uint8Array) => {
console.log("Succeeded in getting RawFileContent")
// 获取图片的ArrayBuffer
const buffer = fileData.buffer.slice(0);
const imageSource : image.ImageSource = image.createImageSource(buffer);
}).catch((err : BusinessError) => {
console.error("Failed to get RawFileContent")
});
- 通过rawfile文件夹下test.jpg的RawFileDescriptor创建。
resourceMgr.getRawFd('test.jpg').then((rawFileDescriptor : resourceManager.RawFileDescriptor) => {
console.log("Succeeded in getting RawFd")
const imageSource : image.ImageSource = image.createImageSource(rawFileDescriptor);
}).catch((err : BusinessError) => {
console.error("Failed to get RawFd")
});
3.创建PixelMap。
imageSource.createPixelMap().then((pixelMap: image.PixelMap) => {
console.log("Succeeded in creating PixelMap")
}).catch((err : BusinessError) => {
console.error("Failed to creating PixelMap")
});
4.释放pixelMap。
pixelMap.release();
如果大家还没有掌握鸿蒙,现在想要在最短的时间里吃透它,我这边特意整理了《鸿蒙语法ArkTS、TypeScript、ArkUI、教学视频》以及《鸿蒙生态应用开发白皮书V2.0PDF》《鸿蒙开发学习手册》(共计890页)鸿蒙开发资料等…希望对大家有所帮助:https://docs.qq.com/doc/DZVVBYlhuRkZQZlB3
鸿蒙语法ArkTS、TypeScript、ArkUI等…视频教程:https://docs.qq.com/doc/DZVVBYlhuRkZQZlB3
OpenHarmony APP开发教程步骤:https://docs.qq.com/doc/DZVVBYlhuRkZQZlB3
鸿蒙生态应用开发白皮书V2.0PDF:https://docs.qq.com/doc/DZVVkRGRUd3pHSnFG
南北双向高工技能基础:https://docs.qq.com/doc/DZVVBYlhuRkZQZlB3
应用开发中高级就业技术:https://docs.qq.com/doc/DZVVBYlhuRkZQZlB3
全网首发-工业级 南向设备开发就业技术:https://docs.qq.com/doc/DZVVBYlhuRkZQZlB3
《鸿蒙开发学习手册》:
如何快速入门:https://docs.qq.com/doc/DZVVBYlhuRkZQZlB3
1.基本概念
2.构建第一个ArkTS应用
3.……
开发基础知识:https://docs.qq.com/doc/DZVVBYlhuRkZQZlB3
1.应用基础知识
2.配置文件
3.应用数据管理
4.应用安全管理
5.应用隐私保护
6.三方应用调用管控机制
7.资源分类与访问
8.学习ArkTS语言
9.……
基于ArkTS 开发:https://docs.qq.com/doc/DZVVBYlhuRkZQZlB3
1.Ability开发
2.UI开发
3.公共事件与通知
4.窗口管理
5.媒体
6.安全
7.网络与链接
8.电话服务
9.数据管理
10.后台任务(Background Task)管理
11.设备管理
12.设备使用信息统计
13.DFX
14.国际化开发
15.折叠屏系列
16.……