这段代码展示了如何使用NVTabBar库初始化一个Tabbar，并设置了样式、图标和文字。Tabbar包含三个选项：首页、课程和我的。当用户点击'我的'时，会检查登录状态，未登录则弹出登录窗口，已登录则切换到相应页面。
function initTabbar() {
NVTabBar.open({
styles: {
bg: '#fff',
h: 48,
dividingLine: {
width: 0.5,
color: '#ddd'
},
badge: {
bgColor: '#ff0',
numColor: '#fff',
size: 6.0,
fontSize: 10,
centerX: 6.0,
centerY: 6.0
}
},
items: [{
w: api.winWidth / 3.0,
bg: {
marginB: -4,
image: 'rgba(0,0,0,0)',
},
iconRect: {
w: 26.0,
h: 26.0,
},
icon: {
normal: 'widget://image/tabbar/home.png',
highlight: 'widget://image/tabbar/home_s.png',
selected: 'widget://image/tabbar/home_s.png'
},
title: {
text: '首页',
size: 10.0,
normal: '#4d3833',
selected: '#f38900',
marginB: 4.0
}
}, {
w: api.winWidth / 3.0,
bg: {
marginB: -4,
image: 'rgba(0,0,0,0)',
},
iconRect: {
w: 26.0,
h: 26.0,
},
icon: {
normal: 'widget://image/tabbar/course.png',
highlight: 'widget://image/tabbar/course_s.png',
selected: 'widget://image/tabbar/course_s.png'
},
title: {
text: '课程',
size: 10.0,
normal: '#4d3833',
selected: '#f38900',
marginB: 4.0
}
}, {
w: api.winWidth / 3.0,
bg: {
marginB: -4,
image: 'rgba(0,0,0,0)',
},
iconRect: {
w: 26.0,
h: 26.0,
},
icon: {
normal: 'widget://image/tabbar/mine.png',
highlight: 'widget://image/tabbar/mine_s.png',
selected: 'widget://image/tabbar/mine_s.png'
},
title: {
text: '我的',
size: 10.0,
normal: '#4d3833',
selected: '#f38900',
marginB: 4.0
}
}],
selectedIndex: 0
}, function(ret, err) {
if (ret) {
if (ret && ret.eventType == 'click') {
if(ret.index == 2){
var token = $func.getToken();
if(token){
tabbarIndex_ = ret.index;
fnOpenFrame(ret.index);
}else{
api.sendEvent({
name: 'openLoginWin'
});
loginCallback = function(){
fnOpenFrame(2);
}
}
}else{
tabbarIndex_ = ret.index;
fnOpenFrame(ret.index);
}
}
}
});
}
代码如上
扫一扫
1万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
