鸿蒙Next如何实现打开相册选图片功能?

news/2024/12/28 23:31:11/

问题描述:鸿蒙Next如何实现打开相册选图片功能

应用场景:用户个人中心自定义头像的时候,需要选择相册上传照片。

解决方案:

使用picker这个API实现从系统上获取相册图片这个点的,

1、首先要实例一个选择参数PhotoSelectOptions 里面需要设置媒体文件类型还有一个数量

2、然后—>实例一个选择器PhotoViewPicker,

3、通过自带的——>select方法传入先前设置的选择参数即可完成选择并获取到选择图片的文件路径

4、解析文件路径转为PixelMap格式或者base64格式

5、再对接后端接口上传数据

// 导入选择器模块和文件管理模块
import {  zipImageUtil} from '../utils/ZipImageUtil'
import { photoAccessHelper } from '@kit.MediaLibraryKit';
import { image } from '@kit.ImageKit';
import { fileIo as fs } from '@kit.CoreFileKit';
import {  buffer as Buffer} from '@kit.ArkTS';// 拉起相册,选择图片方法
class getPhotofromAlbum{getAlbum: string = '显示相册中的图片';pixel: image.PixelMap | undefined = undefined;albumPath: string = '';photoSize: number = 0;async initData():Promise<string>{try{//创建图片-音频类型文件选择选项实例let PhotoSelectOptions = new photoAccessHelper.PhotoSelectOptions(); PhotoSelectOptions.MIMEType = photoAccessHelper.PhotoViewMIMETypes.IMAGE_TYPE;PhotoSelectOptions.maxSelectNumber = 1; // 最多选择数量//创建图库选择器实例,调用PhotoViewPicker.select接口拉起图库界面进行文件选择。文件选择成功后,返回PhotoSelectResult结果集。let photoPicker = new photoAccessHelper.PhotoViewPicker(); let photoSelectResult: photoAccessHelper.PhotoSelectResult = await photoPicker.select(PhotoSelectOptions);this.albumPath = photoSelectResult.photoUris[0];  //获得到选择图片的文件路径// 使用file解析文件,并读取图片为bufferconst file = fs.openSync(this.albumPath, fs.OpenMode.READ_ONLY);this.photoSize = fs.statSync(file.fd).size;console.info('Photo Size: ' + this.photoSize);let buffer = new ArrayBuffer(this.photoSize);fs.readSync(file.fd, buffer);fs.closeSync(file);// 解码成PixelMapconst imageSource = image.createImageSource(buffer);console.log('imageSource: ' + JSON.stringify(imageSource));let pixelMap = await imageSource.createPixelMap({});//设置打包参数const imagePackerApi = image.createImagePacker();const packOpts: image.PackingOption = { format: "image/jpeg", quality: 100 };let imageBuffer: ArrayBuffer = new ArrayBuffer(1);// 图片压缩或重新打包imageBuffer = await imagePackerApi.packing(imageSource, packOpts);imageBuffer = await zipImageUtil.packingImage(imageBuffer, pixelMap, 100, 500*1024); //压缩到500kbconsole.log('压缩后的字节长度:'+imageBuffer.byteLength/1024)//转成base64地址let base64Str:string = Buffer.from(imageBuffer).toString('base64')return base64Str}catch(e){throw new Error(`相册 获取照片失败 : ${JSON.stringify(e)}`);}}}

调用方法

   new getPictureFromAlbum().initData().then(res => {let base64=res})

http://www.ppmy.cn/news/1558917.html

相关文章

《网络对抗》—— Web安全基础实践

1.实验后回答问题 &#xff08;1&#xff09;SQL注入攻击原理&#xff0c;如何防御. 原理&#xff1a; SQL注入攻击指的是通过构建特殊的输入作为参数传入Web应用程序&#xff0c;而这些输入大都是SQL语法里的一些组合&#xff0c;通过执行SQL语句进而执行攻击者所要的操作&a…

AutoFOX:一种冠状动脉X线造影与OCT的自动化跨模态3D融合框架|文献速递-视觉大模型医疗图像应用

Title 题目 AutoFOX: An automated cross-modal 3D fusion framework of coronary X-ray angiography and OCT AutoFOX&#xff1a;一种冠状动脉X线造影与OCT的自动化跨模态3D融合框架 01 文献速递介绍 冠状动脉疾病&#xff08;CAD&#xff09;仍是全球范围内的主要死亡原…

【FPGA】ISE13.4操作手册,新建工程示例

关注作者了解更多 我的其他CSDN专栏 求职面试 大学英语 过程控制系统 工程测试技术 虚拟仪器技术 可编程控制器 工业现场总线 数字图像处理 智能控制 传感器技术 嵌入式系统 复变函数与积分变换 单片机原理 线性代数 大学物理 热工与工程流体力学 数字信号处…

《操作系统真象还原》第十章(一) —— 同步机制之互斥锁实现与输出系统

本章节所有代码托管在miniOS_32 章节任务介绍 问题复现 在上一节中&#xff0c;我们实现了线程轮转调度&#xff0c;并分别实现了三个线程并发的在终端进行输出打印 主线程 thread_work_a thread_work_b #include "print.h" #include "init.h" #inc…

深度解析:电商平台API接口的安全挑战与应对策略

随着电子商务的蓬勃发展&#xff0c;电商平台与外部服务、内部系统之间的数据交换和通信变得日益频繁。API&#xff08;应用程序编程接口&#xff09;接口作为这一过程中的关键枢纽&#xff0c;其安全性显得尤为重要。API接口不仅承载着商品管理、订单处理、支付结算、用户管理…

dolphinscheduler服务RPC心跳机制之实现原理与源码解析

RPC心跳机制设计 1.概述2.设计2.1.心跳机制流程设计2.1.1.常规RPC心跳机制设计2.1.2.Dolphinscheduler的RPC心跳机制设计2.2.心跳机制数据模型设计2.3.心跳机制动态配置3.实现3.1.心跳机制数据模型3.1.1.HeartBeat接口3.1.2.基础实现类BaseHeartBeat3.1.3.Master服务中的心跳消…

Python 端口访问邮件提醒工具

Python 端口访问邮件提醒工具 1.简介&#xff1a; 该脚本主要实现的功能是获取指定端口连接的远程 IP 地址&#xff0c;并将其发送给指定的邮箱,可用于一些远程工具的登录通知&#xff0c;或者其他你需要检测的程序。 特点&#xff1a; 可在配置文件内自定义需要检测的端口…

基于Sentinel的服务保护方案的三种方式(请求限流、线程隔离、服务熔断)超详细讲解

目录 1、三种方式介绍 1.1请求限流 1.2 线程隔离方案 1.3 服务熔断 2、基于sentinel实现 2.1 启动sentinel 2.2 基于springboot整合sentinel 2.2.1请求限流 2.2.2请求隔离 2.2.2.1 OpenFeign整合Sentinel 2.2.3 服务熔断 2.2.3.1 编写降级代码 2.2.3.2 服务熔断 1、…