微信小程序window的配置项

442 阅读1分钟

app.json全局配置,page.json中对应的页面和组件中单独配置。
注意:page.json中不需要写到widow里。直接写在最外层生效。

主要配置项

用于设置小程序的状态栏、导航条、标题、窗口背景色。官方文档

  1. navigationBarBackgroundColor:导航栏背景颜色。
  2. navigationBarTextStyle:导航栏标题、状态栏颜色,仅支持 black / white。
  3. navigationBarTitleText:导航栏标题文字内容。
  4. navigationStyle:导航栏样式,仅支持default默认样式、custom 自定义导航栏只保留右上角胶囊按钮其他隐藏。
  5. homeButton:在非首页、非页面栈最底层页面或非tabbar内页面中的导航栏展示home键返回主页。默认false。
  6. backgroundColor:窗口的背景色。并非导航背景色,是下拉窗口的背景色。
  7. backgroundTextStyle:下拉 loading 小圆点的样式,仅支持 dark / light。
  8. backgroundColorTop:顶部窗口的背景色,仅 iOS 支持。
  9. backgroundColorBottom:底部窗口的背景色,仅 iOS 支持。
  10. enablePullDownRefresh:是否开启全局的下拉刷新,默认false。
  11. onReachBottomDistance:页面上拉触底事件触发时距页面底部距离,单位为 px。

配置项图例

image.png

navigationStyle: custom自定义导航的效果

image.png

常用配置项

  "window": {
    "navigationBarTitleText": "花城",
    "navigationBarTextStyle": "white",
    "navigationBarBackgroundColor": "#f3514f",
    "enablePullDownRefresh": true,
    "backgroundColor": "#efefef"
  },

image.png