nativeObj模式底部选项卡(包含底部凸起悬浮大图标) + webview模式子窗口 示例教程
这是官方给的例子,但是用的是系统自带的图片,我改成自己的图片效果出来了
但是left设置的百分比在分辨率不同的手机上显示有偏差,要怎么设置完美居中呢?
"launchwebview": {
"bottom": "0px",
"background": "#fff",
"subNViews": [
{
"id": "tabBar",
"styles": {
"bottom": "0px",
"left": "0",
"height": "50px",
"width": "100%",
"backgroundColor": "#fff"
},
"tags": [
{
"tag": "img",
"id": "home",
"src": "_www/images/home-normal.png",
"position": {
"top": "4px",
"left": "9%",
"width": "24px",
"height": "24px"
}
}, {
"tag": "font",
"id": "homeText",
"text": "首页",
"position": {
"top": "23px",
"left": "0",
"width": "25%",
"height": "24px"
},
"textStyles": {
"align": "center",
"size": "10px"
}
},{
"tag": "img",
"id": "service",
"src": "_www/images/service-normal.png",
"position": {
"top": "4px",
"left": "29%",
"width": "24px",
"height": "24px"
}
}, {
"tag": "font",
"id": "serviceText",
"text": "服务",
"position": {
"top": "23px",
"left": "20%",
"width": "25%",
"height": "24px"
},
"textStyles": {
"align": "center",
"size": "10px"
}
},{
"tag": "img",
"id": "news",
"src": "_www/images/news-normal.png",
"position": {
"top": "4px",
"left": "64%",
"width": "24px",
"height": "24px"
}
}, {
"tag": "font",
"id": "newsText",
"text": "资讯",
"position": {
"top": "24px",
"left": "55%",
"width": "25%",
"height": "24px"
},
"textStyles": {
"align": "center",
"size": "10px"
}
},{
"tag": "img",
"id": "me",
"src": "_www/images/me-normal.png",
"position": {
"top": "4px",
"left": "84%",
"width": "24px",
"height": "24px"
},
"textStyles": {
"align": "center"
}
}, {
"tag": "font",
"id": "meText",
"text": "我的",
"position": {
"top": "24px",
"left": "75%",
"width": "25%",
"height": "24px"
},
"textStyles": {
"align": "center",
"size": "10px"
}
}
]
}
]
}