258资源分享网

<view class="page-body">

<view class="page-body-wrapper">

<camera device-position="back" flash="off" binderror="error" style="width: 100%; height: 300px;"></camera>

<view class="btn-area">

<button type="primary" bindtap="takePhoto">拍照</button>

</view>

<view class="btn-area">

<button type="primary" bindtap="startRecord">开始录像</button>

</view>

<view class="btn-area">

<button type="primary" bindtap="stopRecord">结束录像</button>

</view>

<view class="preview-tips">预览</view>

<image wx:if="{{src}}" mode="widthFix" src=http://www.yiyongtong.com/archives/"{{src}}"></image>

<video wx:if="{{videoSrc}}" class="video" src=http://www.yiyongtong.com/archives/"{{videoSrc}}"></video>

</view>

</view>

onLoad() {

this.ctx = wx.createCameraContext()

},

takePhoto() {

this.ctx.takePhoto({

quality: 'high',

success: (res) => {

this.setData({

src: res.tempImagePath

})

}

})

},

startRecord() {

this.ctx.startRecord({

success: (res) => {

console.log('startRecord')

}

})

},

stopRecord() {

this.ctx.stopRecord({

success: (res) => {

this.setData({

src: res.tempThumbPath,

videoSrc: res.tempVideoPath

})

}

})

},

error(e) {

console.log(e.detail)

}

/* pages/one/one.wxss */

.preview-tips {

margin: 20rpx 0;

}

.video {

margin: 50px auto;

width: 100%;

height: 300px;

}