E企盈营销工具技术服务商 热线:4006-838-530

小程序的状态栏、导航条、标题、窗口背景色的设置

E企盈直播平台营销卖货系统

关于小程序导航顶部配置都写在.json文件中。相关属性及属性值属性类型默认值描述最低版本navigationBarBackgroundColorHexColor#000000导航栏背景颜色,如”#000000″navigationBarTextStyleStringwhite导航栏标题颜色,仅支持black/whitecolor{red}{导航栏标题颜色,仅支持 black/white}导航栏标题颜色,仅支持black/whitenavigationBarTitleTextString导航栏标题文字内容navigationStyleStringdefault导航栏样式,仅支持 default/custom。custom 模式可自定义导航栏,只保留右上角胶囊状的按钮微信版本6.6.0backgroundColorHexColor#ffffff窗口的背景色backgroundTextStyleStringdark下拉背景字体、loading 图的样式,仅支持 dark/lightenablePullDownRefreshBooleanfalse是否开启下拉刷新,详见页面相关事件处理函数onReachBottomDistanceNumber50注意:color{red}{注意:}注意:1.HexColor(十六进制颜色值),如”#ff00ff”2.关于navigationStyle客户端 7.0.0 以下版本,navigationStyle 只在 app.json 中生效。客户端 6.7.2 版本开始,navigationStyle: custom 对 web-view 组件无效开启 custom 后,低版本客户端需要做好兼容。开发者工具基础库版本切到 1.7.0(不代表最低版本,只供调试用)可方便切到旧视觉3.关于navigationBarTextStyle导航栏标题颜色仅支持black/white代码展示在app.json中写如下代码:”window”: {    “backgroundTextStyle”: “light”,    “backgroundColor”:”#cccccc”,    “navigationBarBackgroundColor”: “#ff9700”,    “navigationBarTitleText”: “小程序”,    “navigationBarTextStyle”: “white”  }注意:color{red}{注意:}注意:当我们设置 backgroundColor 时,实际在电脑的模拟器中根本看不到效果。这是因为 backgroundColor  指的窗体背景颜色,而不是页面的背景颜色,即窗体下拉刷新或上拉加载时露出的背景。在电脑的模拟器中是看不到这个动作的,所以会让人误以为这个配置是无效的。如果要设置页面背景颜色,得在 wxss 中自定义样式,如下:page {    background-color: #cccccc;}效果图

赞(0) 打赏
未经允许不得转载:E企盈小程序开发-热线:4006-838-530 » 小程序的状态栏、导航条、标题、窗口背景色的设置
分享到: 更多 (0)
E企盈小程序直播营销卖货系统
E企盈直播平台营销卖货系统

评论 抢沙发

E企盈小程序开发

联系我们联系我们

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏