更新记录

1.0.0（2026-03-15）

• 支持 Android / iOS 原生相机预览
• 支持拍照输出图片路径
• 支持前后摄切换
• 支持闪光灯模式切换
• 支持圆角预览区域
• 支持圆角方形、圆形、身份证框、文档框、银行卡框、四角定位框预设

平台兼容性

uni-app(4.75)

uni-app x(4.75)

austin-camera-view

austin-camera-view 是一个 App 原生相机拍照组件。

点击使用插件

当前目录下的 index.nvue 是完整模板页，点击试用后包含：

• 原生相机预览
• 前后摄切换
• 闪光灯切换
• 调用 takePhoto()
• 最近一次图片预览
• 最近一次返回结果展示

项目里也提供了测试页面：

• pages/camera-view/index

功能

• 支持 Android / iOS 原生相机预览
• 支持拍照输出图片路径
• 支持前后摄切换
• 支持闪光灯模式切换
• 支持圆角预览区域
• 支持圆角方形、圆形、身份证框、文档框、银行卡框、四角定位框预设

组件用法

<austin-camera-view
  ref="cameraRef"
  cameraPosition="back"
  flashMode="off"
  :previewCornerRadiusRate="0.12"
  @ready="onCameraReady"
  @captured="onCapture"
  @error="onCameraError"
/>

Props

• cameraPosition
  • back / front
  • 默认 back
• flashMode
  • off / on / auto
  • 默认 off
• previewCornerRadiusRate
  • 预览圆角比例
  • 0 = 方形
  • 0.5 = 圆形

模板页预设形状

模板页 index.nvue 里已经内置了这几种常用形状：

• 圆角方形
• 圆形
• 身份证框
• 文档框
• 银行卡框
• 四角定位框

如果你自己接组件，本质上也是通过这两个维度控制形状：

• 组件宽高
• previewCornerRadiusRate

也就是说当前最稳的是：

• 方形 / 圆角方形
• 圆形
• 横向长方形
• 竖向文档框
• 银行卡框
• 四角定位框

方法

• startPreview()
• stopPreview()
• takePhoto()
• switchCamera(position)
• updateFlashMode(mode)
• getCurrentPhotoPath()

返回结果

• 事件：captured

• imagePath

• width

• height

• sizeBytes

• cameraPosition

• flashMode

最小示例

const camera = this.$refs.cameraRef

camera.takePhoto()

onCapture(evt) {
  console.log('camera-capture', evt)
}

注意

• 需要相机权限
• iOS 需要在 manifest.json 配置 NSCameraUsageDescription
• Android 使用原生 Camera 预览与拍照
• iOS 使用 AVFoundation 预览与拍照
• 当前首版定位是原生相机拍照，不包含 OCR、自动裁边、证件识别