HarmonyOS 鸿蒙Next实现文件图片管理功能示例代码

HarmonyOS 鸿蒙Next实现文件图片管理功能示例代码

介绍

本示例基于媒体文件管理服务，实现了管理相册、照片和视频的功能。图片管理对图片像素数据进行解析、处理、构造的过程，达到目标图片效果，主要涉及图片解码、图片处理、图片编码等。

实现文件图片管理功能源码链接

效果预览

图片名称

使用说明

如果在运行该示例代码时，出现运行不了的情况，可尝试选择DevEco Studio菜单栏Build里面的Clean Project选项，来清理工程。

实现思路

try拉起文件/图片选择

let photoSelectResult = await photoPicker.select(photoSelectOptions);        // 拉起图片选择框
if (photoSelectResult && photoSelectResult.photoUris && photoSelectResult.photoUris.length > 0) {
  let imgUris = photoSelectResult.photoUris;
  for (let imgUri of imgUris) {
    if (imgUri.indexOf('media/Photo')<0) {
      promptAction.showToast({message: '请选择图片进行上传'})
      return [];
    }
  }
  return imgUris;

保存图像

async savePhotoToGallery(context: common.UIAbilityContext) {
  let helper = photoAccessHelper.getPhotoAccessHelper(context);
  try {
    // onClick触发后5秒内通过createAsset接口创建图片文件，5秒后createAsset权限收回。
    let uri = await helper.createAsset(photoAccessHelper.PhotoType.IMAGE, 'jpg');
    // 使用uri打开文件，可以持续写入内容，写入过程不受时间限制
    let file = await fileIo.open(uri, fileIo.OpenMode.READ_WRITE | fileIo.OpenMode.CREATE);
    const arrayBuffer = await context.resourceManager.getMediaContent($r('app.media.startIcon').id, 0)
    // 往打开的文件写入 arrayBuffer
    fileIo.writeSync(file.fd, arrayBuffer.buffer)
    // 写完后，主动关闭文件
    await fileIo.close(file.fd)
    promptAction.showToast({ message: '已保存至相册！' });
  } catch (error) {
    const err: BusinessError = error as BusinessError;
    console.error(`Failed to save photo. Code is ${err.code}, message is ${err.message}`);
  }
}

更多关于HarmonyOS 鸿蒙Next实现文件图片管理功能示例代码的实战教程也可以访问 https://www.itying.com/category-93-b0.html

1 回复

更多关于HarmonyOS 鸿蒙Next实现文件图片管理功能示例代码的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


在HarmonyOS（鸿蒙Next）中，实现文件图片管理功能可以通过使用FileManager和Image等API来完成。以下是一个简单的示例代码，展示如何获取图片文件并显示。

import fileManager from '@ohos.file.fs';
import image from '@ohos.multimedia.image';

// 获取图片文件路径
let filePath = '/data/storage/el2/base/files/example.jpg';

// 打开图片文件
let file = fileManager.openSync(filePath, fileManager.OpenMode.READ_ONLY);

// 创建ImageSource对象
let imageSource = image.createImageSource(file.fd);

// 创建PixelMap对象
let pixelMap = imageSource.createPixelMap();

// 显示图片
let imageComponent = document.getElementById('imageView');
imageComponent.setPixelMap(pixelMap);

// 关闭文件
fileManager.closeSync(file.fd);

在这个示例中，首先通过fileManager.openSync方法打开指定的图片文件，然后使用image.createImageSource创建图片源对象，接着通过createPixelMap方法生成PixelMap对象，最后将PixelMap对象设置到UI组件中显示图片。

注意：实际开发中需要确保文件路径正确，并且处理可能出现的异常情况。

回到顶部