微信小程序自定义tabbar 第一次切换会有拉伸
时间: 2024-01-13 13:02:39 浏览: 29
这可能是因为您的 tabbar 图片尺寸不符合规定。微信小程序要求 tabbar 图片尺寸为 81px * 81px,如果您的图片尺寸不符合要求,系统在第一次加载时会进行拉伸以适应要求的尺寸。
解决方法:
1. 确认 tabbar 图片尺寸是否符合规定,如果不符合,重新制作符合规定的图片。
2. 在 app.json 文件中设置 tabBar 的样式:
```
"tabBar": {
"color": "#999999",
"selectedColor": "#FF0000",
"backgroundColor": "#FFFFFF",
"borderStyle": "white",
"list": [
{
"pagePath": "pages/index/index",
"text": "首页",
"iconPath": "images/tabbar/home.png",
"selectedIconPath": "images/tabbar/home-active.png"
},
{
"pagePath": "pages/mine/mine",
"text": "我的",
"iconPath": "images/tabbar/mine.png",
"selectedIconPath": "images/tabbar/mine-active.png"
}
]
}
```
其中,"borderStyle": "white" 表示底部导航栏无边框,可以尝试添加该属性进行调整。
3. 如果以上方法仍然无法解决问题,可以尝试重新创建小程序并重新设置 tabbar。