【uni-app x】告别系统相机限制!三端通用自定义相机组件:任意布局、静默拍照、录像、水印叠加、连拍回图一次搞定

【uni-app x】告别系统相机限制!三端通用自定义相机组件:任意布局、静默拍照、录像、水印叠加、连拍回图一次搞定

正文

为什么还要自己写相机?

开发 App 时你是不是也遇到过这些坑:

  • 系统相机界面固定,想加个自定义遮罩/水印/操作栏?做不到。
  • 业务需要静默拍照(不显示拍照瞬间、无快门声),系统相机根本不提供。
  • 巡检、打卡、取证类应用要在照片上叠加时间地点水印,只能拍完再拿 Canvas 硬拼,画质受损还麻烦。
  • 连拍、批量回图?更是无从下手。

uni-app x 插件市场里要么是"已淘汰"的旧原生插件,要么只支持单端。mj-custom-camera 就是冲着这个缺口来的。

它是什么?

一套基于 uni-app x + UTS 标准模式组件 开发的三端(Android / iOS / HarmonyOS)自定义相机插件,一次编写,三端运行,不依赖任何三方 SDK,纯原生能力封装。

功能清单

  • 📷 任意布局预览:相机画面嵌入自定义 UI,遮罩、网格线、操作按钮随意摆放
  • 🤫 静默拍照:支持无快门无提示抓拍,取证/打卡场景必备
  • 🎬 录像:带时长控制与实时预览
  • 💧 水印叠加:时间、地点、自定义文字一键合成进照片,原生级清晰度
  • ⚡ 连拍批量回图:一次触发连续抓拍,批量回调
  • 🔄 前后摄像头切换 + 闪光灯:基础能力全都有
  • 🧩 静态 API:可完全脱离组件,代码里直接调用

技术亮点(为什么它快且稳)

  • Android 基于 Camera2 API、iOS 基于 AVFoundation、鸿蒙基于 CameraKit,全是各平台官方原生能力,不走 WebView 中转
  • 水印直接在原生层合成,无二次压缩,画质无损
  • 拍照结果双写系统相册(Android 10+ MediaStore),图库立即可见
  • UTS 单包集成,无 AAR/SDK 冲突,随 uni_modules 一键引入

接入有多简单?

xml 复制代码
<!-- pages/index/index.uvue -->
<mj-custom-camera
	mode="photo"
	:watermark="{ enabled: true, text: '2026-09-27 阿克苏' }"
	@take="onTake"
	@error="onError">
</mj-custom-camera>
ts 复制代码
function onTake(path: string) {
	uni.showToast({ title: "拍照成功", icon: "none" })
	// path 即图片本地路径,可直接展示/上传
}

引入 uni_modules 后即可使用,标准基座即可体验,无需自定义基座。

兼容性

  • 仅支持 uni-app x(App 端)
  • Android 5.0+ / iOS 12+ / HarmonyOS
  • 权限自动申请,拍照结果自动入库

插件链接:https://ext.dcloud.net.cn/plugin?name=mj-custom-camera

如果你也被系统相机的各种限制折磨过,这个插件能帮你省下一整个原生开发的工期。觉得有用的话,点赞收藏,评论区聊聊你的场景。


相关推荐
Martin -Tang1 小时前
uniapp app嵌套webview 弹窗方式
android·ios·uni-app
IT_陈寒1 小时前
用Vue时这个响应式陷阱坑了我一整天
前端·人工智能·后端
风骏时光牛马1 小时前
企业客户信息管理数据库
前端
paopaokaka_luck1 小时前
个人综合管理小程序(echarts数据看板、健康数据记录与趋势查看、目标拆解和进度管理、日程待办与番茄钟、习惯打卡、收支统计、个人生活记录、跨模块智能提醒)
前端·javascript·spring·小程序·数据分析·echarts·生活
霸道流氓气质2 小时前
Graph Studio Web IDE 深度实战:可视化编排、断点调试与生产级运维全指南
运维·前端·ide
福兮说10 小时前
前端下载大文件,点了按钮半天没反应:fetch + blob 的三个问题和三种替代写法
前端·javascript·性能优化·文件下载
GreenTea10 小时前
我把 Agent 的 while 循环拆掉了:一种你可能没想到的 Agent 架构
前端·后端·架构
科技观察哨10 小时前
六足平台选型与纳米定位系统集成:HEB-640六自由度位移台在半导体光刻对准中的参数边界与国产替代评估
前端·人工智能