微信小游戏获得胶囊按钮位置

首先是官方文档信息:

Object wx.getMenuButtonBoundingClientRect()

基础库 2.1.0 开始支持,低版本需做兼容处理

获取菜单按钮(右上角胶囊按钮)的布局位置信息。座标信息以屏幕左上角为原点。

返回值

Object

菜单按钮的布局位置信息

属性 类型 说明
width number 宽度,单位:px
height number 高度,单位:px
top number 上边界座标,单位:px
right number 右边界座标,单位:px
bottom number 下边界座标,单位:px
left number 左边界座标,单位:px

要注意的tip

1、座标信息是以屏幕左上角为原点,也就是说返回值中的信息:

top:按钮上边界到屏幕上边的距离。

right:按钮右边界到屏幕左边的距离。

bottom:按钮下边界到屏幕上边的距离。

left:按钮左边界到屏幕左边的距离。

2、我们也可以简单的得出下面结论:

width = right - left;

height = bottom - top;

3、下面就是要把获得的座标转换成游戏中的座标。

思路是将我们上面得到的座标按照屏幕和游戏的适配比进行转换就好,并不需要用到转换座标系。

4、代码

let data = wx.getMenuButtonBoundingClientRect();

data.left即可得到座标。

有想到的再补充,欢迎指出错误和探讨。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章