微信小程序换皮肤,动态切换菜单栏和导航栏的样式,动态修改TabBar和NavigationBar
在做微信小程序换皮肤的时候,需要动态修改菜单栏(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的更多相关文章
- 微信小程序 主题皮肤切换(switch开关)
示例效果: 功能点分析: 1.点击switch开关,切换主题皮肤(包括标题栏.底部tabBar):2.把皮肤设置保存到全局变量,在访问其它页面时也能有效果3.把设置保存到本地,退出应用再进来时,依然加 ...
- 微信小程序的页面跳转==编程式导航传参 和 标签的方法传参==以及如何过去传递过来的参数
小程序导航传参接收传递过来的参数 在onload中 实例
- 微信小程序云开发-云函数-云函数实现数据的查询、修改和删除功能
一.云函数获取商品信息 1.创建云函数getData,云函数功能:获取商品信息 2.在本地小程序页面调用云函数getData 二.云函数修改商品信息 1.创建云函数updateData,云函数功能: ...
- 微信小程序使用三元表达式切换图片
1.data里定义切换图片的地址和切换的标识 data:{ show:true, yes:"http://101.89.144.168:9090//files/jk/yd/images/in ...
- 微信小程序——选中状态的切换
加入购物车的时候,往往会有产品相关属性的选择,比如:尺寸,规格等.像我做的项目中,就有一个门店的选择,如下图: 我们如何做到当前点击的这个高亮呢?今天就讲一下如何实现这个功能. 思路: 1.定义一个高 ...
- 微信小程序:选项卡页面切换
一.功能描述 在同一个页面内实现不同展示页面的切换功能,如下图所示 二.代码实现 1. index.js Page({ /** * 页面的初始数据 */ data: { currentData : 0 ...
- 微信小程序实现滑动tab切换和点击tab切换并显示相应的数据(附源代码)
这里主要用到了swiper组件和三目运算,直接上代码, 样式只有三个class,简单粗暴,懒的小伙伴们可以直接拿来用,喜欢的点个支持 <view> <view class=" ...
- 微信小程序实现tab页面切换功能
wxml <scroll-view scroll-x="true" class="ip_tab_comtainer"> <view class ...
- 微信小程序踩坑集合
1:官方工具:https://mp.weixin.qq.com/debug/w ... tml?t=1476434678461 2:简易教程:https://mp.weixin.qq.com/debu ...
随机推荐
- safari打开的页面数字识别变为蓝色
今天网页碰到一个很怪异的问题:app打开的一个网页样式是好的,但通过safari打开后数字的颜色变为蓝色,并且还变得可点击了! 原来safari总会把长串数字识别为电话号码,文字变成蓝色,点击还会弹出 ...
- python基础4 列表和元组
一. 列表列表:python基础数据类型之一:其他语言中也有列表的概念,js 数组,可索引,可切片,可加步长li = ['hello', 100, True, [1, 2, 3], {'name':' ...
- 平衡树splay学习笔记#1
这一篇博客只讲splay的前一部分的操作(rotate和splay),后面的一段博客咕咕一段时间 后一半的博客地址:[传送门] 前言骚话 为了学lct我也是拼了,看了十几篇博客,学了将近有一周,才A掉 ...
- C++:位操作基础篇之位操作全面总结
位操作篇共分为基础篇和提高篇,基础篇主要对位操作进行全面总结,帮助大家梳理知识.提高篇则针对各大IT公司如微软.腾讯.百度.360等公司的笔试面试题作详细的解答,使大家能熟练应对在笔试面试中位操作题目 ...
- 让WinSCP和Putty一直保持连接
转: 让WinSCP和Putty一直保持连接 2015年08月14日 01:08:19 zcczbq 阅读数:13173 标签: puttywinscp 更多 个人分类: Operation 版权 ...
- Null component Catalina
"严重: Null component Catalina:type=JspMonitor,name=jsp,WebModule="错误的解决办法 在MyEclipse10环境下启动 ...
- halcon预处理函数
颜色空间变换 trans_from_rgb(ImageRed, ImageGreen, ImageBlue :ImageResult1, ImageResult2, ImageResult3 : Co ...
- 用SERVLET进行用户名和密码验证
一.界面展示 二.登录成功显示 三.代码 html <!DOCTYPE html> <html> <head> <meta charset="UTF ...
- Battery Historian 使用常用命令
一.重置电池数据收集数据 打开电池数据获取:adb shell dumpsys batterystats --enable full-wake-history 重置电池数据: adb shell du ...
- HMM隐马尔科夫算法(Hidden Markov Algorithm)初探
1. HMM背景 0x1:概率模型 - 用概率分布的方式抽象事物的规律 机器学习最重要的任务,是根据一些已观察到的证据(例如训练样本)来对感兴趣的未知变量(例如类别标记)进行估计和推测. 概率模型(p ...