getMenuButtonBoundingClientRect()

在小程序平台，如果原生导航栏被隐藏，仍然在右上角会有一个悬浮按钮，微信下也被称为胶囊按钮。本API用于获取小程序下该菜单按钮的布局位置信息，方便开发者布局顶部内容时避开该按钮。抖音不包括反馈。

坐标信息以屏幕左上角为原点。

平台差异说明

App	H5	微信小程序	支付宝小程序	百度小程序	抖音小程序	飞书小程序	QQ小程序
x	√	√	√	√	√	x	√

返回值说明

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

示例

  const theMenuButtonInfo = qin.getMenuButtonBoundingClientRect()

  const theMenuButtonInfo = qin.getMenuButtonBoundingClientRect()

注意

• 支付宝小程序：其逻辑与微信小程序不同，它提供了菜单点击后按钮的自定义功能，可以选择显示那些系统按钮，规范详情

getCustomButtonBoundingClientRect()

0.13.0+

在 抖音 小程序调用原生 getCustomButtonBoundingClientRect 方法，其他小程序平台 capsule 中是 getMenuButtonBoundingClientRect 的结果， H5 全都是 0 。全平台返回的数据格式一致。如果抖音 小程序不支持 getCustomButtonBoundingClientRect 方法自动降级到其他小程序的返回方法。

平台差异说明

App	H5	微信小程序	支付宝小程序	百度小程序	抖音小程序	飞书小程序	QQ小程序
x	√	√	√	√	√	x	√

返回值说明

属性	类型	说明
leftIcon	object	左上角 logo/返回的位置信息
capsule	object	右上角反馈+more+close 的位置信息

leftIcon 返回值说明

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

capsule 返回值说明

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

示例

  const theCustomButtonInfo = qin.getCustomButtonBoundingClientRect()

  const theCustomButtonInfo = qin.getCustomButtonBoundingClientRect()