uni-app微信小程序开发 - pages.json - globalStyle(全局配置)

用于设置应用的状态栏、导航条、标题、窗口背景色等。

  • navigationBarBackgroundColor | 导航栏背景颜色(同状态栏背景色)
  • navigationBarTextStyle | 导航栏标题颜色及状态栏前景颜色,仅支持 black/white
  • navigationBarTitleText | 导航栏标题文字内容
  • navigationStyle | 导航栏样式,仅支持 default/custom。custom即取消默认的原生导航栏,需看使用注意
  • backgroundColor | 下拉显示出来的窗口的背景色
  • backgroundTextStyle | 下拉 loading 的样式,仅支持 dark / light
  • enablePullDownRefresh | 是否开启下拉刷新,详见页面生命周期。
  • onReachBottomDistance | 页面上拉触底事件触发时距页面底部距离,单位只支持px,详见页面生命周期
  • pageOrientation | 横屏配置,屏幕旋转设置,仅支持 auto / portrait / landscape 详见 响应显示区域变化
  • mp-weixin | 设置编译到 mp-weixin 平台的特定样式
  • usingComponents | 引用小程序组件,参考 小程序组件
  • renderingMode | 同层渲染,webrtc(实时音视频) 无法正常时尝试配置 seperated 强制关掉同层

示例:

{
    "pages": [ //pages数组中第一项表示应用启动页,参考:https://uniapp.dcloud.io/collocation/pages
        {
            "path": "pages/index/index"
            // "style": {
            //  "navigationBarTitleText": "uni-app"
            // }
        }
    ],
    "globalStyle": {
        "navigationBarBackgroundColor": "#FF0000", // 导航栏背景颜色(同状态栏背景色)
        "navigationBarTextStyle": "white", // 导航栏标题颜色及状态栏前景颜色,仅支持 black/white
        "navigationBarTitleText": "标题",
        // "navigationStyle":"custom", // 导航栏样式,仅支持 default/custom。custom即取消默认的原生导航栏,需看使用注意
        "backgroundColor": "#0066CC", // 下拉显示出来的窗口的背景色
        "backgroundTextStyle": "dark", // 下拉 loading 的样式,仅支持 dark / light
        "enablePullDownRefresh": true, // 是否开启下拉刷新,详见页面生命周期
        "onReachBottomDistance": 100, // 页面上拉触底事件触发时距页面底部距离,单位只支持px,详见页面生命周期
        "pageOrientation": "auto" // 横屏配置,屏幕旋转设置,仅支持 auto / portrait / landscape
    }
}

你可能感兴趣的:(uni-app微信小程序开发 - pages.json - globalStyle(全局配置))