plus模拟收缩导航列实验

纯粹是学习

要实现下面的效果:

考虑到目前plus增加的menu.popup功能, 感觉可以试下上面的功能, 而且不需要写很多的代码 , 做了下实验, 应该可以封装为一个plus的外置库用, 

还有点瑕疵, 后面慢慢修改, 先上代码 , 有更好的思路的可以留言

import fonts.fontAwesome;
import win.ui;
/*DSG{{*/
var winform = win.form(text="aardio form";right=409;bottom=551;bgcolor=15780518)
winform.add(
inItem1={cls="plus";text="复制";left=211;top=435;right=409;bottom=464;hide=1;iconStyle={align="left";font=LOGFONT(name='FontAwesome');padding={left=9}};iconText=" ";notify=1;z=1};
inItem2={cls="plus";text="粘贴";left=211;top=464;right=409;bottom=496;hide=1;iconStyle={align="left";font=LOGFONT(name='FontAwesome');padding={left=9}};iconText=" ";notify=1;z=2};
outItem1={cls="plus";text="功能属性";left=78;top=82;right=276;bottom=111;bgcolor=15592941;border={color=-16777216;width=1};iconStyle={align="right";font=LOGFONT(name='FontAwesome');padding={right=10}};iconText='\uF078';notify=1;z=3};
outItem2={cls="plus";text="基本元素";left=78;top=110;right=276;bottom=139;bgcolor=15592941;border={color=-16777216;width=1};iconStyle={align="right";font=LOGFONT(name='FontAwesome');padding={right=10}};iconText='\uF078';notify=1;z=4}
)
/*}}*/

import console
console.open()
 
import win.ui.tabs;
var outmenu = win.ui.tabs(winform.outItem1,winform.outItem2); 
var outTheme = {
    background={
        default = 0xFFEDEDED;
        hover= 0xFFF3F3F3;
    }; 
    checked = { 
        background={
        	default = 0xFFEDEDED;
        	hover= 0xFFF3F3F3;
    	};
        iconText = '\uF077';  
    } 
};
outmenu.skin(outTheme);
 
outmenu.add({
    text='开发工具'; 
})
outmenu.add({
    text='组件示例'; 
})
 
 
var inmenu = win.ui.tabs(winform.inItem1,winform.inItem2)
var inTheme = { 
    color = {
        default = 0xFF06000F;
    }; 
    foreground={
        default = 0xFFFFFFFF;
        hover= 0xFFF7F7F7;
    };
  
    checked = { 
        color = {
            default = 0xFF6A58C9;
        }; 
        foreground={
            default = 0xFFFAFAFA;
        };
    }
};
inmenu.skin(inTheme);
//清空,只留样式
inmenu.clear(); 
inmenu.initPopup();
 
outmenu.oncommand = function(strip,id,event){
    inmenu.clear();
    //随机条件菜单项
    var num = math.random(0,7);
    if(num!=0){
    	for(i=1;num;1){
    		inmenu.add({
				text= strip.text++"文本"++i;
			})	
    	}
    }
    
    if(strip.checked){
        //有菜单项,则
        if(inmenu.count()) inmenu.popup(true,strip);
    }else {
        if(inmenu.count()) inmenu.popup(false,strip);
    }   
}
 
 
inmenu.onVisualStateChanged = function(showing){
    if(showing){
        var x,y,cx,cy = outmenu.selStrip.getPos();
        var xx,yy,cxx,cyy = inmenu.getPos();
        var ny = y+cy+cyy;
 
        for(i=outmenu.selIndex+1;outmenu.count();1){
            outmenu.strips[i].setPos(x,ny);
            ny += cy-1;
        }
 
    }else { 
        if(outmenu.selIndex){
            var x,y,cx,cy = outmenu.selStrip.getPos();
            var ny = y+cy-1;
            for(i=outmenu.selIndex+1;outmenu.count();1){
                outmenu.strips[i].setPos(x,ny);
                ny += cy-1;
            }
        }
    }
}
 
 
  
winform.show() 
win.loopMessage();