微信小程序开发中遇到的问题之自定义导航栏
自定义导航栏功能：返回上一页，回到主页，音乐播放控制，标题。
要求：导航栏与微信右上角的默认椭圆转发关闭按钮水平对齐，高度一致。
SRE实战 互联网时代守护先锋，助力企业售后服务体系运筹帷幄！一键直达领取阿里云限量特价优惠。问题点：1.右上角默认的按钮的高度是多少。
2.如何确定自定义导航栏的位置。
3.返回上一页的控制
hack:
1.所有机型的右上角默认的按钮的高度都是14px；
2.跟右边的按钮水平对齐解决方案：
1.获取该设备的状态栏高度，即statusBarHeight。
2.确认设备的标题高度titHeight。titHeight其实是固定的，IOS为40px，安卓48px。
app.js
wx.getSystemInfo({
success: res => {
_this.globalData.statusBarHeight = res.statusBarHeight ;
_this.globalData.titHeight = res.system.indexOf('iOS')>-1?40:48;
}
})
3.计算得到自定义导航的位置,自定义导航高度为设计图高度,navigatorHeight。
my-navigation.view
<view class='my-navigation' style='padding-top:{{statusBarHeight}}px'>
<view class='operation-bar {{model}}' style='top:{{alignTop}}px'>
</view>
my-navigation.js
data:{
statusBarHeight: app.globalData.statusBarHeight,
alignTop: (app.globalData.titHeight - 32)/2, //32为右上角默认的按钮的高度
}
3.返回上一页控制
判断当前页面是否是tabbar页面，如果是隐藏。
判断当前页面栈pages长度，大于1才显示。
如何获取当前页和整个页面栈？
通过getCurrentPages()即可获取当前页面栈，返回的是数组。
当前页面栈长度getCurrentPages().length
当前页即为getCurrentPages()[getCurrentPages().length - 1],
判断路径时getCurrentPages()[getCurrentPages().length - 1].route即可获取当前页面路径，根据路径判断是否是tabbar页面。
返回上一页跳转：
wx.navigateBack({
delta:1
})
音乐播放控制这里不做详细赘述，说下大体思路，通过小程序全局背景音乐控制api：wx.getBackgroundAudioManager()实现，通过wx.getBackgroundAudioManager()创建BackgroundAudioManager实例，然后在该实例对象下加入播放的路径，标题，时间，播放进度等，不同页面都需要加载一次，但是BackgroundAudioManager是全局唯一的，利用他的唯一性，在该实例下挂载相应的属性也会一直存在，不管在哪个页面，都不用再自己做缓存了。
