当前位置:网站首页>Implementation of navigation bar at the bottom of applet
Implementation of navigation bar at the bottom of applet
2022-07-07 08:29:00 【I eat slowly】
1、 The navigation bar at the bottom of the applet is the thing at the bottom
2、 This needs to be app.json Set at “tabBar”
Examples are as follows :
{
"pages": [
"pages/index/index",
"pages/pages1/pages1",
"pages/pages2/pages2"
],
"window": {
"backgroundTextStyle": "light",
"navigationBarBackgroundColor": "#ffffff",
"navigationBarTitleText": " Applet name ",
"navigationBarTextStyle": "black",
"backgroundColor": "#EA0000"
},
"sitemapLocation": "sitemap.json",
"tabBar": {
"color": "#666666",
"selectedColor": "#f10b2e",
"list": [
{
"pagePath": "pages/pages1/pages1",
"text": " page 1",
"iconPath": "*****",// Icon when not selected
"selectedIconPath": "*****"// The selected icon
},
{
"pagePath": "pages/pages2/pages2",
"text": " page 2",
"iconPath": "*****",// Icon when not selected
"selectedIconPath": "*****"// The selected icon
}
]
}
}
3、 example :
"tabBar": {
"color": "#000000",
"selectedColor": "#FF6900",
"borderStyle": "black",
"list": [
// {
// "iconPath": "/static/tabbar/index.png",
// "selectedIconPath": "/static/tabbar/index.png",
// "pagePath": "pages/index/index",
// "text": " home page "
// },
{
"iconPath": "/static/tabbar/workbench.png",
"selectedIconPath": "/static/tabbar/work.png",
"pagePath": "pages/workbench/work",
"text": " The workbench "
},
// {
// "iconPath": "/static/tabbar/msg.png",
// "selectedIconPath": "/static/tabbar/msg.png",
// "pagePath": "pages/message/mes",
// "text": " news "
// },
{
"iconPath": "/static/tabbar/my.png",
"selectedIconPath": "/static/tabbar/my.png",
"pagePath": "pages/my/my",
"text": " my "
}
]
},
4、 It should be noted that :
Other pages should jump to tabBar page , Need to use wx.switchTab, Examples are as follows :
wx.switchTab({
url: '../pages1/pages1'
})
边栏推荐
- [quick start of Digital IC Verification] 13. SystemVerilog interface and program learning
- Xcit learning notes
- eBPF Cilium实战(2) - 底层网络可观测性
- MES系统,是企业生产的必要选择
- Using nocalhost to develop microservice application on rainbow
- Transformation function map and flatmap in kotlin
- 如何理解分布式架构和微服务架构呢
- Full text query classification
- How to understand distributed architecture and micro service architecture
- Application of slip ring of shipborne radar antenna
猜你喜欢
Obsidan之数学公式的输入
Give full play to the wide practicality of maker education space
【雅思口语】安娜口语学习记录 Part2
Xcit learning notes
Rainbond 5.7.1 支持对接多家公有云和集群异常报警
opencv学习笔记一——读取图像的几种方法
opencv学习笔记二——图像基本操作
Learn how to compile basic components of rainbow from the source code
opencv学习笔记三——图像平滑/去噪处理
Implement your own dataset using bisenet
随机推荐
在Rainbond中实现数据库结构自动化升级
Le système mes est un choix nécessaire pour la production de l'entreprise
Lua 编程学习笔记
A single game with goods increased by 100000, and the rural anchor sold men's clothes on top of the list?
Open3d ISS key points
Low success rate of unit test report
Coquette data completes the cloud native transformation through rainbow to realize offline continuous delivery to customers
eBPF Cilium实战(1) - 基于团队的网络隔离
Golang compilation constraint / conditional compilation (/ / +build < tags>)
Pytoch (VI) -- model tuning tricks
2-3查找樹
Interview questions (CAS)
使用BiSeNet实现自己的数据集
【无标题】
Using helm to install rainbow in various kubernetes
Opencv learning notes 1 -- several methods of reading images
Snyk 依赖性安全漏洞扫描工具
[quick start of Digital IC Verification] 14. Basic syntax of SystemVerilog learning 1 (array, queue, structure, enumeration, string... Including practical exercises)
IP-guard助力能源企业完善终端防泄密措施,保护机密资料安全
[IELTS speaking] Anna's oral learning records Part3