这是手机端和模拟器上的效果,按钮被遮挡,我想要 的效果是按钮可以在实景上显示,
我想去掉背景,去掉背景之后,按钮就不显示了,这是按钮的代码以及调用部分。
- 预期表现
可以去掉背景,只有摄像头看到的实景部分,在手机上正常显示按钮,希望得到帮助
- 复现路径
- 提供一个最简复现 Demo
Page({
data: {
height: ‘500’,
width: ‘20’,
status: false,
scanStatus: ‘none’,
color: ’ #6495ED’,
msg: “请点击识别”,
src: ‘’
},
<camera device-position=“back” flash=“off” binderror=“error” style=“width: 100%; height: {{height}}px”></camera>
<view class=‘recognition-container’>
<view class=“btn-area”>
<button bindtap=“takePhoto” style=" background:#6495ED;" >{{msg}}</button>
</view>
<canvas style=“width: {{width}}px; height: {{height}}px; opacity: 0” canvas-id=“firstCanvas”></canvas>
</view>
.recognition-container{
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
}
.btn-area{
position: absolute;
right: 60px;
left: 60px;
bottom:7vh;
z-index: 1000;
width: 240px;
height: 20px;
}