更新记录

1.1.2（2025-11-06）

新增功能（临时更新）

• 无

问题修复

• 快捷键拍照（蓝牙自拍杆、手机音量键）拍照时，返回后按钮无法操作的问题修复
• 页面在没启用shortcut（快捷键拍照）时，也会进入快捷键的问题修复
• 修复在低版本HubuildX时打包出现找不到类型的问题

功能优化

• 优化了相机资源在进入时卡顿的问题

计划新增功能（大版本更新）

• 完善鸿蒙Harmony版本的并进行更新

1.1.1（2025-11-03）

新增功能（临时更新）

• 新增设置照片输出格式的方法changeSuffix

问题修复

• 修复照片格式无法设置的问题【原因是在uni给出的生命周期内，无法取到props的参数，只能在watch中处理】

功能优化

• 无

计划新增功能（大版本更新）

• 完善鸿蒙Harmony版本的并进行更新

1.1.0（2025-10-31）

新增功能

• 快捷键拍照: 如:按两下音量键拍照、按音量键拍照等等（可自定义）

• 蓝牙自拍杆: 提供可以连接蓝牙自拍杆拍照、对焦等（可自定义）

• 相机是否开启蓝牙自拍杆、手机快捷键拍照，可自定义快捷键，具体参考参数shortcut

• 问题修复

• 无

功能优化

• 无

计划新增功能（大版本更新）

• 完善鸿蒙Harmony版本的并进行更新

平台兼容性

uni-app(4.31)

uni-app x(4.31)

其他

原生自定义相机拍照、视频录制 （ima-camera-view）

原生自定义相机拍照、视频录制 （ima-camera-view）是基于原生相机开发的UTS插件，支持相机拍照、视频录制 、可实现点击聚焦、手势缩放、 自定义布局、自定义蒙版（用于人脸拍照，身份证拍照等）。

⚠️注意️

• android 端已全部完成代码的开发与测试（已完成）
• harmony 端已完成部分代码的开发与实现，待测试无问题后，再进行发布，敬请关注（已完成，测试中...）
• ios 端由于苹果Developer年费续费到期、开发｜发布证书等一系列导致无法进行调试等，所以暂无开发计划（已写有部分代码，需要的话可单独联系「不保证运行，本插件中不存在该代码」） （暂无计划）
• 小程序、H5、快应用暂无开发计划（暂无计划）

支持功能

• 打开、关闭摄像头预览
• 拍照、快照拍照
• 录制视频、快照录制视频
• 设置摄像头缩放级别
• 设置相机白平衡
• 设置相机HDR
• 设置摄像头方向
• 设置闪光灯模式
• 设置音频（录制视频时）
• 设置拍照、录制视频的声音（可自定义）
• 蓝牙自拍杆（可自定义）
• 手机快捷键（可自定义）

自定义调整

• 自定义调整页面地址：uni_modules/ima-camera-view/utssdk/app-android/index.vue
• 蓝牙自拍杆、手机快捷键的自定义，可以参考文件中的shortcutListener方法
• 设置拍照、录制视频的声音，可以参考文件中的photoSound、videoSound方法

需要权限

• 摄像头、音频、文件读取、文件写入、震动

"android.permission.CAMERA",
"android.permission.RECORD_AUDIO",
"android.permission.READ_EXTERNAL_STORAGE"
"android.permission.WRITE_EXTERNAL_STORAGE"
"android.permission.VIBRATE"

• 即：在manifest.json中的distribute.android.permissions加入

// 拍摄照片和视频时需要
<uses-permission android:name="android.permission.CAMERA" /> 
// 拍摄视频时需要Audio.ON（默认）
<uses-permission android:name="android.permission.RECORD_AUDIO" /> 
// 读取拍照、录像文件文件时需要
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />
// 报错拍照、录像文件文件时需要（默认保存到沙盒缓存）
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" /> 
// 震动权限
<uses-permission android:name="android.permission.VIBRATE" />

快门声音素材

• 将需要的快门声音放在uni_modules/ima-camera-view/utssdk/app-android/assets下即可
• 熊猫办公
• 站长素材

使用示例【此示例的代码只实现了相机拍照的逻辑，更多示例请导入项目】

• 新建一个camera.nvue的文件
• ⚠️注意️：只能在.nvue、.uvue的文件后缀下才生效，不支持.vue

<template>
    <view class="ima-camera" :style="{ width: windowWidth, height: windowHeight }">
        <ima-camera-view
            ref="cameraRef"
            class="camera-view"
            :style="{ width: windowWidth + 'px', height: windowHeight + 'px' }"
            flash="on"
            @onPictureTaken="onPictureTaken"
            onFocusStart="onFocusStart"
        />
        <view class="camera-menu">
            <!--返回键-->
            <cover-image @tap="back" class="camera-menu-button back" src="/static/camera/back.png" />
            <!--快门键-->
            <cover-image
                @tap="takePhoto"
                class="camera-menu-button shutter"
                src="/static/camera/shutter.png"
            />
            <!--反转键-->
            <cover-image @tap="flip" class="camera-menu-button flip" src="/static/camera/flip.png" />
        </view>
    </view>
</template>

<script>
let _this = null
export default {
    data() {
        return {
            windowWidth: '', //屏幕可用宽度
            windowHeight: '', //屏幕可用高度
            facing: 'back'
        }
    },
    onLoad() {
        _this = this
        this.initCamera()
    },
    methods: {
        //初始化相机
        initCamera() {
            console.log('初始化相机')
            uni.getSystemInfo({
                success: (res) => {
                    _this.windowWidth = res.windowWidth
                    _this.windowHeight = res.windowHeight
                }
            })
        },
        onFocusStart(e) {
            console.log('聚焦', e)
        },
        takePhoto() {
            console.log('拍照', this.facing)
            this.$refs.cameraRef.takePhoto()
        },
        //返回
        back() {
            console.log('返回上一页', this.facing)
            uni.navigateBack()
        },
        //反转
        flip() {
            console.log('镜头反转', this.facing)
            this.facing = this.facing === 'back' ? 'front' : 'back'
            this.$refs.cameraRef.changeFacing(this.facing)
        },
        onPictureTaken(e) {
            console.log('拍照结果', e.detail)
            _this.snapshotsrc = e.detail?.path || ''
            _this.getTakenRes()
            uni.navigateBack()
        },
        //设置
        getTakenRes() {
            console.log('返回结果给上一页')
            let pages = getCurrentPages()
            let prevPage = pages[pages.length - 2] //上一个页面
            //直接调用上一个页面的setImage()方法，把数据存到上一个页面中去
            prevPage.$vm.setImage({ path: _this.snapshotsrc })
        }
    }
}
</script>

<style lang="scss">
.ima-camera {
    justify-content: center;
    align-items: center;

    .camera-view {
        width: 100%;
        background: #111;
    }

    .camera-menu {
        position: absolute;
        left: 0;
        bottom: 0;
        width: 750rpx;
        height: 180rpx;
        z-index: 98;
        align-items: center;
        justify-content: center;

        &-button {
            width: 80rpx;
            height: 80rpx;
            position: absolute;
            bottom: 50rpx;
            z-index: 99;
            align-items: center;
            justify-content: center;
        }

        .back {
            left: 30rpx;
        }

        .shutter {
            width: 130rpx;
            height: 130rpx;
            left: 310rpx;
            bottom: 25rpx;
        }

        .flip {
            right: 30rpx;
        }
    }
}
</style>

常见的比例的定义（widthRatio，heightRatio）

// 正方形
AspectRatio.of(1, 1)      // 1:1

// 竖屏比例
AspectRatio.of(9, 16)     // 9:16 (手机竖屏)
AspectRatio.of(3, 4)      // 3:4
AspectRatio.of(2, 3)      // 2:3
AspectRatio.of(10, 16)    // 10:16 (5:8)

// 横屏比例
AspectRatio.of(16, 9)     // 16:9 (宽屏)
AspectRatio.of(4, 3)      // 4:3 (传统)
AspectRatio.of(3, 2)      // 3:2 (照片)
AspectRatio.of(16, 10)    // 16:10 (8:5)
AspectRatio.of(21, 9)     // 21:9 (超宽屏)

// 建议比例
const AspectRatios = {
  // 1:1 正方形
  SQUARE: AspectRatio.of(1, 1),
  // 9:16 竖屏（手机默认）
  PORTRAIT: AspectRatio.of(9, 16),
  // 16:9 横屏
  LANDSCAPE: AspectRatio.of(16, 9),
  // 3:4 传统照片比例
  THREE_FOUR: AspectRatio.of(3, 4),
  // 4:3 传统相机比例
  FOUR_THREE: AspectRatio.of(4, 3)
}

不同场景的推荐值（tolerance）

const TOLERANCE = {
  STRICT: 0.01.toFloat(),    // 非常严格，几乎精确匹配
  STANDARD: 0.05.toFloat(),  // 标准，推荐使用
  FLEXIBLE: 0.1.toFloat(),   // 灵活，兼容更多设备
  LOOSE: 0.2.toFloat()       // 宽松，可能匹配到意外比例
}

Api

方法

共同 方法/ /

事件