微信小程序换皮肤,动态切换菜单栏和导航栏的样式,动态修改TabBar和NavigationBar...

最新推荐文章于 2024-03-04 17:19:46 发布

转载最新推荐文章于 2024-03-04 17:19:46 发布 · 386 阅读

1 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/fancyblogs/p/9203473.html

文章标签：

#json

本文介绍如何在微信小程序中实现界面换肤功能，重点讲解动态修改TabBar和NavigationBar样式的API使用方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

在做微信小程序换皮肤的时候,需要动态修改菜单栏(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'
});

官方接口地址

官方提供的其他接口