识别页面可以去掉遮挡摄像机的背景,按钮正常显示
发布于 5 年前 作者 yang96 3619 次浏览 来自 问答

在小程序的识别页面。有请识别是按钮,
但是在这个页面有白色的背景
我想去掉背景,去掉背景之后,按钮就不显示了,这是按钮的代码以及调用部分。

  • 预期表现

可以去掉背景,只有摄像头看到的实景部分,在手机上正常显示按钮,希望得到帮助

  • 复现路径
  • 提供一个最简复现 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;

}

回到顶部