收藏
回答

如何使camera组件展示的视野上叠加的圆圈与camera组件的相对位置保持不变?

为了使用户拍摄的物体位于长方形视野的中心位置,我在视野的中心画了一个绿色的圆圈,当前是用cover-view结合position: fixed来固定圆圈的位置(见附图)。

代码如下:

【WXML】

  <!--Camera view-->
  <view class="camera-view">
  <camera device-position="back" flash="off" frame-size="large"
  binderror="cameraError" class="camera-view"></camera>
  </view>
  <!--Cycle view-->
  <cover-view class="cycle-view"></cover-view>

【WXSS】

.camera-view {
  width: 100%;
  height: 562.5rpx;
  margin-top: 5rpx;
}
.cycle-view {
  /* Location */
  position: fixed;
  top: 170rpx;
  z-index: 3;
  /* Size */
  height: 500rpx;
  width: 500rpx;
  border-radius: 50%;
  border: 3rpx solid #0f0;
}

但是,若camera组件的位置发生了变化,而圆圈的位置是固定不变的,则圆圈就会偏离长方形视野的中心位置。

请问,用什么方法可以比较简单地保持圆圈与长方形视野的相对位置保持不变?谢谢!

最后一次编辑于  2019-12-18
回答关注问题邀请回答
收藏

1 个回答

  • 土家肸哥
    土家肸哥
    2019-12-18

    动态计算啊

    2019-12-18
    赞同
    回复 3
    • 零时零刻
      零时零刻
      2019-12-18
      你说的是用wx.createSelectorQuery()获取位置来计算对吧!这个比较麻烦
      2019-12-18
      回复
    • 土家肸哥
      土家肸哥
      2019-12-18回复零时零刻
      不想计算就讲cover-view放到camera里面然后定位,你camera高度都固定了的还不好弄吗????
      2019-12-18
      回复
    • 零时零刻
      零时零刻
      2019-12-18回复土家肸哥
      camera上方还有高度可变的输入框
      2019-12-18
      回复
登录 后发表内容
问题标签