微信小程序camera摄像头组件使用详解

本篇经验将继续分享媒体类组件中camera摄像头组件的使用详解。注意，这篇经验将基于第一个手工构建的微信小程序演示，具体构建步骤，可参考如下经验引用。

百度搜索官方文档

在百度搜索中查找camera摄像头组件的官方文档，常用属性有device-position：哪个摄像头，可选值有front和back，默认为back；flash：闪光灯打开关闭的设置，mode：模式，包括相机模式和扫码模式等。

wxml文件中添加camera组件

在wxml文件中通过标签显示一个照相区域，并设置其宽高样式。通过一个按钮实现拍照功能（绑定单击事件），并将拍摄的图片显示在下方的一个标签中。

js中定义事件函数和变量

在js中定义wxml中按钮绑定的单击事件函数，以及标签绑定的一个变量。

保存编译并测试效果

保存编译后，在模拟器中可以查看效果，camera组件会调用笔记本电脑上的唯一摄像头，通过按钮可拍摄照片并显示在下方的图片区域中，符合预期。

真机调试效果

通过真机调试，在真实手机上测试，效果如下图：
图1：会弹出授权窗口，需要用户授权访问摄像头硬件；
图2：默认会使用后置摄像头，点击按钮拍摄后显示在下方的图片区域。

版权声明：本文内容由互联网用户自发贡献，本站不承担相关法律责任.如有侵权/违法内容,本站将立刻删除。