在做微信小程序换皮肤的时候,需要动态修改菜单栏(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. safari打开的页面数字识别变为蓝色

    今天网页碰到一个很怪异的问题:app打开的一个网页样式是好的,但通过safari打开后数字的颜色变为蓝色,并且还变得可点击了! 原来safari总会把长串数字识别为电话号码,文字变成蓝色,点击还会弹出 ...

  2. Shell命令-文件及内容处理之split、paste

    文件及内容处理 - split.paste 1. split:分割文件为不同的小片段 split命令的功能说明 split 命令用于将一个文件分割成数个.该指令将大文件分割成较小的文件,在默认情况下将 ...

  3. openstack oslo.messaging库

    openstack oslo.messaging库 2017年04月13日 22:13:25 li_101357 阅读数:1383   版权声明:本文为博主原创文章,未经博主允许不得转载. https ...

  4. Android popupwindow 失去焦点或者点击空白区域时消失的解决方法

    先来看下Android API 的这个Methods: public void setOutsideTouchable (boolean touchable) Controls whether the ...

  5. 【Spring】手写Spring MVC

    Spring MVC原理 Spring的MVC框架主要由DispatcherServlet.处理器映射.处理器(控制器).视图解析器.视图组成. 完整的Spring MVC处理 流程如下: Sprin ...

  6. 中国剩余定理 CRT

    中国剩余定理 CRT 正常版本CRT 要解的是一个很容易的东西 \[ \begin{aligned} x\equiv a_1(mod\ m_1)\\ x\equiv a_2(mod\ m_2)\\ . ...

  7. LoadRunner【第三篇】录制脚本实践:订票网站

    启动服务 安装好loadrunner,我们就可以实践了. loadrunner自带订票网站,可以方便我们练习, 先把下面两个发送到桌面快捷方式 首先,启动服务,点击下面图标(如果服务无法启动,检查端口 ...

  8. scrapy之使用LinkExtractor提取链接

    一.概述: 在页面含有少量链接时,使用selector来提取信息就可以,但如果链接特别多时,就需要用LinkExtractor来提取. 二.LinkExtractor构造器的各个参数: 1.allow ...

  9. web.xml:<dispatcher>

    web.xml 的 <dispatcher> 是 <filter-mapping> 下的子标签,指定 Filter 对应的请求方式,其可选值如下: REQUEST 客户端在地址 ...

  10. Pandas系列(九)-分组聚合详解

    目录 1. 将对象分割成组 1.1 关闭排序 1.2 选择列 1.3 遍历分组 1.4 选择一个组 2. 聚合 2.1 一次应用多个聚合操作 2.2 对DataFrame列应用不同的聚合操作 3. t ...