您的足迹:首页 > 我的代码 >aardio--普通按钮组的tab切换效果(不是tab组件)

aardio--普通按钮组的tab切换效果(不是tab组件)

就是按下这个,别的弹起。checked 改变。

btns = {  //四个按钮
    mainForm.a1;
    mainForm.a2;
    mainForm.a3;
    mainForm.a4;
}

setBtnChecked = function( btn ){
    for(i=1;#btns;1){
        btns[i].checked = (btns[i]==btn);   
    }
}

mainForm.a1.oncommand = function(id,event){
    setBtnChecked( mainForm.a1 );
}

mainForm.a2.oncommand = function(id,event){
    setBtnChecked( mainForm.a2 );
}

mainForm.a3.oncommand = function(id,event){
    setBtnChecked( mainForm.a3 );
}

mainForm.a4.oncommand = function(id,event){
    setBtnChecked( mainForm.a4 );
}

得是plus按钮,设置好样式,要不然看不出来效果。

//===================tabs样式,白色底黑字============
tabStyle = {
    background={
        default=0xFF26354E;
        disabled=0xFFCCCCCC;
        hover=0xFF586986;
    };
    color={
        default=0xFFEEEEEE;
        disabled=0xFF6D6D6D;
        hover=0xFFFFFFFF;
    }
     border = {
        default = { bottom = 0;color= 0xFF1E9FFF;  }
        hover = { bottom = 0;color= 0xFF1E9FFF; }
    }
    checked = {
        background={
            default=0xFFFFFFFF;
            disabled=0xFFCCCCCC;
            hover=0xFFFFFFFF;
        };
        color={
            default=0xFF333333;
            disabled=0xFF6D6D6D;
            hover=0xFF333333;
        }
        border = {
            hover = { bottom = 0;color=0xFF1E9FFF; }
            default = { bottom = 0;color=0xFF1E9FFF; }
        }
    }
}
//===================按钮样式====样式 Begin============
BtnStyleBlue = { //左右渐变按钮---蓝色
    foreground={
        default=0xFF5153DA;
        disabled=0xFFCCCCCC;
        hover=0xFF6163EA;
    };
    background={
        default=0xFF55B9D3;
        disabled=0xFFCCCCCC;
        hover=0xFF65C9E3;
    };
    color={
        default=0xFFFFFFFF;
        disabled=0xFFDDDDDD;
        hover=0xFFFFFFFF;
    }
    border = {
        default = { bottom = 0;color= 0xFF1E9FFF; radius=6; }
        hover = { bottom = 0;color= 0xFF586986; radius=6; }
    }
};
BtnStyleRed = { //左右渐变按钮---红色
    foreground={
        default=0xFFF7349C;
        disabled=0xFFCCCCCC;
        hover=0xFFFF44AC;
    };
    background={
        default=0xFFFC81A0;
        disabled=0xFFCCCCCC;
        hover=0xFFFF91B0;
    };
    color={
        default=0xFFFFFFFF;
        disabled=0xFFDDDDDD;
        hover=0xFFFFFFFF;
    }
    border = {
        default = { bottom = 0;color= 0xFF1E9FFF; radius=6; }
        hover = { bottom = 0;color= 0xFF586986; radius=6; }
    }
};
BtnStyleZi = { //左右渐变按钮---紫色
    foreground={
        default=0xFF9E65F0;
        disabled=0xFFCCCCCC;
        hover=0xFFAE75FF;
    };
    background={
        default=0xFFE974C2;
        disabled=0xFFCCCCCC;
        hover=0xFFF984D2;
    };
    color={
        default=0xFFFFFFFF;
        disabled=0xFFDDDDDD;
        hover=0xFFFFFFFF;
    }
    border = {
        default = { bottom = 0;color= 0xFF1E9FFF; radius=6; }
        hover = { bottom = 0;color= 0xFF586986; radius=6; }
    }
};

再来个设置样式的

setSkin = function( plusControl, styleName, radius=6 ){

    plusControl.linearGradient = 180;
    sn = BtnStyleBlue;
    sn.border.default.radius = radius;
    sn.border.hover.radius = radius;

    if( type(styleName) != type.table ){
        plusControl.skin( sn );
    }else {
        plusControl.skin( styleName );
    }

}

/**
winform.PS_Copy.skin( Button2 );   //最普通的简单按钮,Button1深色,Button2浅色
setSkin( winform.PS_JI ,BtnStyleZi );  //渐变按钮,@1是plus控件,@2是样式名字
setSkin( winform.PS_Mai );         //渐变按钮,最简单,默认蓝色按钮

**/

最后set一下skin就行了。

setSkin( mainForm.a1, tabStyle );
setSkin( mainForm.a2, tabStyle );
setSkin( mainForm.a3, tabStyle );
setSkin( mainForm.a4, tabStyle );
本博客所有文章如无特别注明均为原创。作者:恶猫复制或转载请以超链接形式注明转自 恶猫的博客
原文地址《aardio--普通按钮组的tab切换效果(不是tab组件)

相关推荐

分享本文至:

发表评论

路人甲 表情
看不清楚?点图切换 Ctrl+Enter快速提交

网友评论(0)

恶猫的博客 -记录自己日常,代码,美图,电影,音乐,新闻,只是个人博客而已

浙ICP备15011757号-4 网站地图 联系我