微信小程序学习笔记-右上角胶囊按钮适配

正常标题栏未设置自定义的时候，胶囊按钮（小程序顶部右边的两个）下面才是我们自己的页面部分：

但是设置了标题栏自定义以后，整个页面都被我们的页面填充：

这时候如果有在顶部配置图标或者标题，那么就要考虑一个问题：安卓跟ios不同机型下胶囊按钮的大小跟位置是不一样的，这时候就需要获取胶囊按钮的信息进行动态配置：

onLoad(){
   let 胶囊信息= wx.getMenuButtonBoundingClientRect()
   this.setData({ 胶囊信息声明: 胶囊信息})
 }

获取到的胶囊信息单位为px： top === margin-top: 24px;
如此用胶囊的top跟height就可以动态设置跟胶囊同行的标题或者图标了