{
"pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages
{
"path": "pages/index/index",
"style": {
"navigationBarTitleText": "uni-app"
}
}, {
"path": "pages/test/test",
"style": {
"navigationBarTitleText": "test"
}
}
],
"globalStyle": {
"navigationBarTextStyle": "black",
"navigationBarTitleText": "uni-app",
"navigationBarBackgroundColor": "#F8F8F8",
"backgroundColor": "#F8F8F8"
},
"tabBar": {
"iconfontSrc": "static/iconfont/iconfont.ttf",
"list": [
{
"pagePath": "pages/index/index",
"text": "ss",
"iconfont": {
"text": "\ue61e",
"selectedText": "\ue61e",
"fontSize": "22px",
"color": "#8A8A8A",
"selectedColor": "#1296db"
}
},
{
"pagePath": "pages/index/index",
"text": "cc",
"iconfont": {
"text": "\ue637",
"selectedText": "\ue637",
"fontSize": "22px",
"color": "#8A8A8A",
"selectedColor": "#1296db"
}
}
],
"midButton": {
"width": "80px",
"height": "37px",
"iconPath": "static/imgs/tabbar/add.png",
"iconWidth": "24px",
"iconfont": {
"text": "\ue616",
"fontSize": "24px",
"color": "#8A8A8A",
"selectedColor": "#1296db"
}
}
},
"uniIdRouter": {}
}
w***@163.com
- 发布：2022-11-29 11:26
- 更新：2022-12-01 10:57
- 阅读：294
产品分类： uniapp/App
PC开发环境操作系统： Windows
PC开发环境操作系统版本号： win10
HBuilderX类型： 正式
HBuilderX版本号： 3.6.5
手机系统： Android
手机系统版本号： Android 11
手机厂商： 华为
手机机型： 华为荣耀9x
页面类型： vue
vue版本： vue3
打包方式： 云端
项目创建方式： HBuilderX
示例代码：
操作步骤：
简单新建测试项目，新建两个页面，配置 pages.json
简单新建测试项目，新建两个页面，配置 pages.json
预期结果：
tabBar 使用 midButton 时可以实现垂直居中效果
tabBar 使用 midButton 时可以实现垂直居中效果
实际结果：
app 端无法实现：tabBar 使用 midButton 时垂直居中效果
app 端无法实现：tabBar 使用 midButton 时垂直居中效果
bug描述：
tabBar 设置的时候，网页端可以通过 height 实现 midButton 垂直居中效果，但是运行到 App 端时，无法实现居中效果，但凡设置 height 配置项，midButton 总是会超出 tabBar 的高度范围；而且网页端 midButton iconfont 字体图标不会起作用，必须用 iconPath 配置项指定静态图片；
