我们通常在小程序json配置通栏后，就需要我们手动写标题，而往往这个标题栏，在不同设备上的表现都不一样。也就是困惑大家也困惑我的问题，胶囊和标题栏高度对齐的问题。

解决方案

通过调用小程序的wx.getSystemInfo()方法，得到用户的设备信息。根据用户的设备信息区分安卓和ios端，其中devtools是PC开发工具端。按照以下的公式方法设置即可

注意下面得到的都是不同设备实时的标题栏高度，可以给标题栏定位然后设置top值为以下的 androidH或者iosH。
也可以用margin-top设置； 下面的setData部分是我绑定到标题栏高度的变量。这里可以自行设置。总之得到一个值就是了
  wx.getSystemInfo().then(res => {
            if (res.platform == "devtools") {
                let androidH= res.statusBarHeight + (48 - 32) / 2
                this.setData({
                 navbarheight:androidH
             })
            } else if (res.platform == "ios") {
                let iosH = res.statusBarHeight + (44 - 32) / 2;
                this.setData({
                    navbarheight:iosH
                })
            } else if (res.platform == "android") {
               let androidH= res.statusBarHeight + (48 - 32) / 2
               this.setData({
                navbarheight:androidH
            })
            }
        })