更新记录

1.0.0(2026-07-01)

  • 首发:纯血鸿蒙原生相机组件,Vue/nvue 页面通用、界面可自定义
  • 相机预览自适应 + 自动启动
  • 拍照、前后摄切换、分辨率切换(1:1 / 4:3 / 16:9)
  • 预览模式铺满/留边、闪光灯(关/开/自动/常亮)、HD 高清
  • 无声抓帧 + 快速拍照

平台兼容性

uni-app(4.24)

Vue2 Vue3 Chrome Safari app-vue app-nvue Android iOS 鸿蒙
× × × ×
微信小程序 支付宝小程序 抖音小程序 百度小程序 快手小程序 京东小程序 鸿蒙元服务 QQ小程序 飞书小程序 小红书小程序 快应用-华为 快应用-联盟
× × × × × × × × × × × ×

鸿蒙相机 fsyang-camera-ohos · 使用说明

纯血鸿蒙原生相机组件,uni-app(Vue3 / nvue)通用、界面可自定义。 仅鸿蒙平台;真机调试需 HBuilderX 4.24+。安卓 / iOS 见同系列 fsyang-camera

🎨 组件只负责相机预览 + 拍照/分辨率/闪光等能力,按钮、布局、样式全由你在页面自己写;文档与截图里的 UI 只是 demo 示例。


一、安装

插件市场点「使用 HBuilderX 导入」,落到 uni_modules/fsyang-camera-ohos

二、三步接入

<!-- 1. 放预览(容器多大,预览多大) -->
<embed tag="camera" class="cam"
  :options="{ initialResolution:'4:3', initialPreviewMode:'cover', autoStart:true }"
  @xcomponentload="onLoad" @phototaken="onPhoto" />
// 2. 引入
import { cameraManager } from '@/uni_modules/fsyang-camera-ohos'

// 3. 用
onLoad(e){ this.surfaceId = e.detail.surfaceId },        // 拿 surfaceId
cameraManager.startCamera(this.surfaceId)                 // 启动预览
cameraManager.takePhoto(uri => { /* 照片路径 */ })        // 拍照
onPhoto(e){ /* e.detail: photoUri,width,height,fileSize */ }

三、常用方法

cameraManager.xxx(),返回 { code, message }code===200 为成功。

方法 说明
startCamera(surfaceId) / stopCamera() 启动 / 停止预览
takePhoto(cb) 拍照,回调返回照片路径
switchCamera() 前后摄切换
setResolution('1:1' \| '4:3' \| '16:9') 切分辨率
switchPreviewMode('cover' \| 'contain') 铺满 / 留边
setFlashMode(0 \| 1 \| 2 \| 3) 闪光:关 / 开 / 自动 / 常亮
setHD(true/false) 高清模式
startFrameCapture() / captureFrame() / stopFrameCapture() 开启抓帧 / 快速拍照 / 停止

四、事件

事件 时机 e.detail
@xcomponentload 组件加载完成 surfaceId
@cameraready 相机就绪
@phototaken 拍照完成 photoUri / width / height / fileSize
@cameraerror 出错 错误信息

五、权限

插件运行时自动申请相机权限(module.json5 已声明 ohos.permission.CAMERA)。

隐私、权限声明

1. 本插件需要申请的系统权限列表:

相机(预览、拍照必需)

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明:

插件本身不采集不上传任何数据;照片仅存本机应用缓存目录

3. 本插件是否包含广告,如包含需详细说明广告表达方式、展示频率:

暂无用户评论。