• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    迪恩网络公众号

微信小程序自定义内容和胶囊对齐

原作者: [db:作者] 来自: [db:来源] 收藏 邀请

 

原理是:导航栏+胶囊的高度

另一篇简单的https://www.cnblogs.com/lude1994/p/14406630.html 

 

1.在app.js中

  

globalData: {
        statusBarHeight:wx.getSystemInfoSync()['statusBarHeight'], // 获取导航栏的高度
}

2.在需要使用的页面中js中赋值

data: {
        jiaonangHeight: 32,  // data中定义
     
statusBarHeight:getApp().globalData.statusBarHeight // 导航栏的高度

}
onReady: function () {
    var that = this;
    wx.getMenuButtonBoundingClientRect(  //获取胶囊的干度及其他参数
      {
          success: e => {
            that.data.jiaonangHeight = e.height
          }
        }
    )
}

 

3.在页面中使用,为保持真正的对齐,我添加了导航栏的高度

<view>
    <view style='padding: {{jiaonangHeight'></view> <view> 内容 </view> </view>

 


鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
热门推荐
    热门话题
    阅读排行榜

    扫描微信二维码

    查看手机版网站

    随时了解更新最新资讯

    139-2527-9053

    在线客服(服务时间 9:00~18:00)

    在线QQ客服
    地址:深圳市南山区西丽大学城创智工业园
    电邮:jeky_zhao#qq.com
    移动电话:139-2527-9053

    Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap