在做微信小程序换皮肤的时候,需要动态修改菜单栏(TabBar)和导航栏(NavigationBar)

但是在小程序中它们的样式是写在app.json里面,而且app.json是静态编译,运行时哪怕你修改了里面的值,也是不起做作用的.

不过官方提供了动态修改两个样式的api.

动态修改NavigationBar

wx.setNavigationBarColor({
frontColor:"#ffffff",
backgroundColor:'#000000'
});

动态修改TabBar

wx.setTabBarStyle({
color: '#FF0000',
selectedColor: '#00FF00',
backgroundColor: '#0000FF',
borderStyle: 'white'
}); wx.setTabBarItem({
index: 0,
text: 'text',
iconPath: '/path/to/iconPath',
selectedIconPath: '/path/to/selectedIconPath'
});

官方接口地址

官方提供的其他接口

微信小程序换皮肤,动态切换菜单栏和导航栏的样式,动态修改TabBar和NavigationBar的更多相关文章

  1. 微信小程序 主题皮肤切换(switch开关)

    示例效果: 功能点分析: 1.点击switch开关,切换主题皮肤(包括标题栏.底部tabBar):2.把皮肤设置保存到全局变量,在访问其它页面时也能有效果3.把设置保存到本地,退出应用再进来时,依然加 ...

  2. 微信小程序的页面跳转==编程式导航传参 和 标签的方法传参==以及如何过去传递过来的参数

    小程序导航传参接收传递过来的参数 在onload中 实例

  3. 微信小程序云开发-云函数-云函数实现数据的查询、修改和删除功能

    一.云函数获取商品信息 1.创建云函数getData,云函数功能:获取商品信息 2.在本地小程序页面调用云函数getData  二.云函数修改商品信息 1.创建云函数updateData,云函数功能: ...

  4. 微信小程序使用三元表达式切换图片

    1.data里定义切换图片的地址和切换的标识 data:{ show:true, yes:"http://101.89.144.168:9090//files/jk/yd/images/in ...

  5. 微信小程序——选中状态的切换

    加入购物车的时候,往往会有产品相关属性的选择,比如:尺寸,规格等.像我做的项目中,就有一个门店的选择,如下图: 我们如何做到当前点击的这个高亮呢?今天就讲一下如何实现这个功能. 思路: 1.定义一个高 ...

  6. 微信小程序:选项卡页面切换

    一.功能描述 在同一个页面内实现不同展示页面的切换功能,如下图所示 二.代码实现 1. index.js Page({ /** * 页面的初始数据 */ data: { currentData : 0 ...

  7. 微信小程序实现滑动tab切换和点击tab切换并显示相应的数据(附源代码)

    这里主要用到了swiper组件和三目运算,直接上代码, 样式只有三个class,简单粗暴,懒的小伙伴们可以直接拿来用,喜欢的点个支持 <view> <view class=" ...

  8. 微信小程序实现tab页面切换功能

    wxml <scroll-view scroll-x="true" class="ip_tab_comtainer"> <view class ...

  9. 微信小程序踩坑集合

    1:官方工具:https://mp.weixin.qq.com/debug/w ... tml?t=1476434678461 2:简易教程:https://mp.weixin.qq.com/debu ...

随机推荐

  1. Kivy 中文教程 实例入门 简易画板 (Simple Paint App):1. 自定义窗口部件 (widget)

    1. 框架代码 用 PyCharm 新建一个名为 SimplePaintApp 的项目,然后新建一个名为 simple_paint_app.py 的 Python 源文件, 在代码编辑器中,输入以下框 ...

  2. C. New Year and Rating 差分方程 思维

    题意: 一个CF玩家打CF 给出其比赛列表和上分(掉分)情况 ,但是没给初始分 问最后最高分是多少  (情况不存在,或者可能无穷大) 思路: 设初始分为x 那么之前的回合的分数前缀和为sum    如 ...

  3. 洛谷P3953逛公园

    题目 作为\(NOIp2017D1T3\) 这个题还是很良心的,至少相对于\(NOIp2018\)来说,希望\(NOIp2019\)不会这么坑吧. 这个题可以作为记忆化搜索的进阶题了,做这个题的方法也 ...

  4. Vivado如何使用命令行创建工程

    前言 vivado中采用TCL脚本语言来作为其命令解释语言.除去可以普通的图形界面流程还可以使用tcl脚本创建工程并导入相关源文件.   流程 1.首先还是要打开vivado图形主界面. 2.在某路径 ...

  5. 【BZOJ5495】[十二省联考2019]异或粽子(主席树,贪心)

    [BZOJ5495][十二省联考2019]异或粽子(主席树,贪心) 题面 BZOJ 洛谷 题解 这不是送分题吗... 转异或前缀和,构建可持久化\(Trie\). 然后拿一个堆维护每次的最大值,每次如 ...

  6. 【bfs】麻将游戏

    题目 来自:yinzm的blog 在一种"麻将"游戏中,游戏是在一个有W*H格子的矩形平板上进行的.每个格子可以放置一个麻将牌,也可以不放(如图所示).玩家的目标是将平板上的所有可 ...

  7. dubbo接口demo开发

    接口需求 客户端输入uncleyong(当然,也可以输入其它字符串),服务端返回hello uncleyong 开发环境 jdk + idea + maven + zookeeper jdk安装 id ...

  8. Cucumber使用中问题

    1.cucumber自动化执行提示chrome使用不支持的命令标记 --ignore-certificate-errors 大概问题是chrome版本和chrmedriver版本不对应 2." ...

  9. 计算机基础理论知识梳理篇(一):数据类型长度、内存页、IPC

    字长与数据类型长度 字长指CPU在同一时间能够处理二进制数据的位数,是由其外接数据总线(地址总线决定了CPU的寻址空间,如16位微型机的地址总线为20位,其可寻址空间为220 = 1MB)的条数决定的 ...

  10. JavaScript 基础六 'use strict'严格模式下的规则

    why 严格模式 [1] 消除js语法的一些不合理.不严谨.不安全问题,减少怪异行为并保证代码运行安全 [2] 提高编译器效率,增加运行速度 使用 [1]整个脚本启用严格模式,在顶部执行:" ...