微信小程序-动态修改顶部导航栏颜色、背景色

news/2024/7/20 1:58:24 标签: 小程序

代码:

 wx.setNavigationBarTitle({
      title: '个人中心'
    })
    wx.setNavigationBarColor({
      frontColor: '#ffffff', // 必写项【该字体颜色仅支持 #ffffff 和 #000000 】
      backgroundColor: '#25BDCE', // 传递的颜色值【仅支持有效值为十六进制颜色】
      animation: { // 可选项
        duration: 4000,
        timingFunc: 'easeIn'
      }
    })

遇到坑:

设置导航栏背景颜色不起作用,原因:

1、frontColor是必填项

2、设置frontColor设置成#313233,frontColor仅支持#ffffff和#000000这两个颜色;

3、backgroundColor仅支持16进制,不支持其它格式

 

参考资料:

微信小程序API:https://developers.weixin.qq.com/miniprogram/dev/api/ui/navigation-bar/wx.setNavigationBarColor.html

颜色16进制转换:https://www.w3school.com.cn/cssref/css_colors.asp


http://www.niftyadmin.cn/n/908579.html

相关文章

ExceptionLess新玩法 -- 审计日志

审计日志 这算是一个挺酷的功能,把每个请求都记录下来,之前在abp中看到过这个功能,配合可视化的界面,简直是在装逼 看到了exceptionless后,心念一动,我也可以根据它做一个审计日志的功能。这里需要一些MVC过…

GitHub 安装及使用

为什么要引入Git: 1)用简单一点的例子来讲: 一个公司有几个甚至十几个人共同合作开发一款项目的时候,公司对项目代码有明确规范,不可能再像学校做的小项目一样,你觉得哪个同学的代码写的不好,…

dependencyManagement与dependencies区别

最近在阅读maven项目代码时,dependencyManagement与dependencies之间的区别不是很了解,现通过项目实例进行总结:项目epps-demob-pom下有一个模块是epps-demob-war。 一、dependencyManagement应用场景 为了项目的正确运行,必须让所…

微信小程序-wxParse解析单条html及多数据循环

wxParse-微信小程序富文本解析组件:https://github.com/icindy/wxParse 支持Html及markdown转wxml可视化 一、基本使用 1、下载wxParse文件夹,并引入到自己项目中 2、分别在相应的文件中引入以下文件 let WxParse require("../../utils/wxPars…

Atitit 异常机制与异常处理的原理与概论

Atitit 异常机制与异常处理的原理与概论 1. 异常vs 返回码1 1.1. 返回码模式的处理 (瀑布if 跳到失败1 1.2. 终止模式 vs 恢复模式(asp2 1.3. 异常机制的设计原理2 1.4. Atitit.异常机制的设计原理.docx java2 1.5. JVM看Exception本质.java的ex设计throry2 1.6. J…

Hibernate中java对象的三种状态

java对象的三种状态 当前应用通过调用Hibernate API与框架发生交互时,需要从持久化的角度关注应用对象的生命周期持久化生命周期是Hibernate中的一个挂按键的概念,正确地理解生命周期可以更好的了解Hibernate的实现原理 掌握Hibernate的正确用法&#xf…

new formData:使用append追加后console仍为空

new formData:使用append追加后console.log后仍为空 解决:需要用formData.get("键")的方法获取值 知识点 延伸: FormData类型其实是在XMLHttpRequest 2级定义的,它是为序列化表以及创建与表单格式相同的数据 1、appen…

element-修改表格边框颜色

问题:修改element表格边框颜色后,发现边框颜色重叠,粗细不一致 解决: .el-table--border, .el-table--group {border-color: #C6CAD6; }.el-table--border:after, .el-table--group:after, .el-table:before {background-color: …