导航栏
{
"path": "pages/index/index",
"style": {
"navigationBarTitleText": "百年奥莱",
"navigationBarBackgroundColor":"#FFFFFF",
"app-plus":{
"scrollIndicator": "none"//隐藏该页面滚动条
"titleNView":{
"buttons":[
{
"float": "left",
"fontSrc": "./static/iconfont.ttf",
"text": "搜索"
},
{
"float": "right",
"fontSrc": "./static/iconfont.ttf",
"text": "消息"
}
]
}
}
}
}
自定义导航栏
page.json中的配置项
"navigationStyle":"custom",
页面中给小程序自定义导航栏
<!-- #ifdef MP-WEIXIN -->
<view class="wx-nav">
<view class="iconfont">搜索</view>
<text>百年奥莱</text>
<view class="iconfont">消息</view>
</view>
<!-- #endif -->
<style>
.wx-nav{
height: 200rpx;
width: 70%;
line-height: 200rpx;
display: flex;
justify-content: space-around;
align-items: center;
}
</style>
tabbar
"tabBar": {
"color": "#7A7E83",
"selectedColor": "#49BDFB",
"borderStyle": "black",
"backgroundColor": "#ffffff",
"list": [{
"pagePath": "pages/index/index",
"iconPath": "static/tabbar/home.png",
"selectedIconPath": "static/tabbar/home_s.png",
"text": "首页"
}, {
"pagePath": "pages/category/category",
"iconPath": "static/tabbar/category.png",
"selectedIconPath": "static/tabbar/category_s.png",
"text": "分类"
}, {
"pagePath": "pages/shopcar/shopcar",
"iconPath": "static/tabbar/shopcar.png",
"selectedIconPath": "static/tabbar/shopcar_s.png",
"text": "购物车"
}, {
"pagePath": "pages/my/my",
"iconPath": "static/tabbar/my.png",
"selectedIconPath": "static/tabbar/my_s.png",
"text": "我的"
}]
}
网友评论