aardio - 【库】listboxEX 列表框自绘库

说明:

// listboxEX 列表框自绘库
// 光庆封装 V2.3
// 本库是我为了练习列表框自绘,参考 一步一步自绘listbox实现html中的伸缩列表导航栏功能 - aardio学习笔记 的思路及代码,重写并增添了部分功能,在此对各帖子作者表示感谢。存在的不足之处,请各位大侠留言指正。

库下载:

光庆·程序·在线 → aardio资源下载http://chengxu.online/index.asp

解压缩到 /lib/godking/ 目录下,引用方式:

import godking.listboxEX

// 征集好看的主题,请将您珍藏的主题参数留言,我集成到库里面。

1、详细的主题设置,可自定义菜单及项目的字体名称、文本大小、文本颜色、图标、背景颜色等各项功能。

2、内置两种主题:listboxEX.theme_dark(暗色主题) 和 listboxEX.theme_light (亮色主题)。

3、可通过 setTheme() 和 getTheme() 设置和获取当前主题。

4、可通过 listboxEX.theme 获取主题数据模板(以暗色主题数据为模板)

5、可通过 listboxEX.menulist 获取菜单项目数据模板。

6、支持自动关闭非当前选中的菜单(设置为alwaysOpend的菜单不能关闭)。

7、支持隐藏菜单右侧的展开状态小三角图标。

8、支持gdi方式自绘(有锯齿)和gdip方式自绘(防锯齿)。默认为gdip。

9、可以设置当点击已展开的菜单时,是否将其关闭(设置为alwaysOpend的菜单不能关闭)。

调用方式:

import win.ui;
/*DSG{{*/
mainForm = win.form(text="aardio工程15";right=585;bottom=476)
mainForm.add(
listbox={cls="listbox";left=0;top=0;right=250;bottom=479;db=1;dl=1;dr=1;dt=1;items={};ownerDraw=1;vscroll=1;z=1}
)
/*}}*/

import godking.listboxEx
var lb = godking.listboxEx(	mainForm.listbox/*列表框组件*/,
					godking.listboxEx.menulist/*菜单列表,内容可参考listboxEx.menulist*/,
					godking.listboxEx.theme_light /*亮色主题,内容可参考listboxEx.theme*/
					)

lb.onClick = function(index,subindex,text){
	if subindex ..win.msgbox("您点击了项目:"+text);
	else ..win.msgbox("您点击了菜单:"+text);
}

mainForm.show();
win.loopMessage();

执行效果:

aardio - 【库】listboxEX 列表框自绘库_第1张图片

更详细的用法:

import win.ui;
/*DSG{{*/
mainForm = win.form(text="aardio工程15";right=585;bottom=476)
mainForm.add(
listbox={cls="listbox";left=0;top=0;right=250;bottom=479;db=1;dl=1;dr=1;dt=1;items={};ownerDraw=1;vscroll=1;z=1}
)
/*}}*/

import godking.listboxEx
var menulist = {
        {
        	"\uF054,\uF078,系统设置",/*菜单图标,菜单选中时图标,菜单文本*/
        	{
     			"\uF014,\uF015,声音设置",/*项目图标,项目选中时图标,项目文本*/
      			"\uF016,\uF017,图像设置",
      			"\uF018,\uF019,打印数据",
      			"\uF020,\uF021,打印数据",
        	},
        	opened = true,/*展开*/
        	alwaysOpened =false/*总是展开*/
	    }, 
        {
        	"\uF054,\uF078,数据处理",
        	{
     			"\uF022,\uF023,报表生成",
      			"\uF024,\uF025,打印数据",
      			"\uF026,\uF027,打印数据",
      			"\uF028,\uF029,打印数据",
        	},
        	opened = false,
        	alwaysOpened = false
	    },
        {
        	"\uF054,\uF078,关于软件",
        	{
     			"\uF022,\uF023,公司简介",
      			"\uF024,\uF025,招聘信息",
      			"\uF026,\uF027,联系方式",
        	},
        	opened = false,
        	alwaysOpened = false
	    }	    
    }

var theme = {
bgcolor = 0xa0a0a0,/*组件背景色*/
hideOpenedIcon = false,/*隐藏菜单右边小三角图标*/
useGdip = true,/*使用gdip防锯齿*/
itemHeight = 40,/*菜单和项目高度*/
autoClose = true,/*自动关闭非当前菜单,对alwaysOpen的菜单无效*/
menuFontName = "黑体",/*菜单字体名称*/
menuFontH = 20,/*菜单字体高度,单位:像素*/
menuFontWeight = 400,/*菜单字体粗细,0~1000,正常为400*/
menuBgColor = 0x302D29,/*菜单背景颜色*/
menuSelBgColor = 0x302D29,/*菜单选中时背景颜色*/
menuTextColor = 0xD1D1D1,/*菜单文本颜色*/
menuSelTextColor = 0xD1D1D1,/*菜单选中时文本颜色*/
menuUnderlineColor = null,/*菜单下划线颜色,为null时没有下划线*/
itemFontName = "黑体",/*项目字体名称*/
itemFontH = 18,/*项目字体高度,单位像素*/
itemFontWeight = 400,/*项目字体粗细,0~1000,正常为400*/
itemBgColor = 0x3F3C38,/*项目背景颜色*/
itemSelBgColor = 0x6E6B67,/*项目选中时背景颜色*/
itemTextColor = 0xD1D1D1,/*项目文本颜色*/
itemSelTextColor = 0xD1D1D1,/*项目选中时文本颜色*/
itemUnderlineColor = null/*项目下划线颜色,为null时没有下划线*/
}

var lb = godking.listboxEx(	mainForm.listbox,menulist,theme)
 /*不指定theme主题则默认使用暗色主题*/

lb.onClick = function(index,subindex,text){
	if subindex ..win.msgbox("您点击了项目:"+text);
	else ..win.msgbox("您点击了菜单:"+text);
}

mainForm.show();
win.loopMessage();

执行效果:

aardio - 【库】listboxEX 列表框自绘库_第2张图片

小窍门:

1、在IDE中,您不用记住菜单项目的数据格式,只需要输入

var menulist = godking.listboxEx.menulist 回车,

会自动生成一段菜单项目列表数据,供参考修改:

aardio - 【库】listboxEX 列表框自绘库_第3张图片

 2、在IDE中,您不用记住主题数据格式,只需要输入var menulist = godking.listboxEx.theme 回车,会自动生成一段主题表数据,供参考修改:

aardio - 【库】listboxEX 列表框自绘库_第4张图片

3、修改部分主题参数:

A、在创建时,在使用默认主题的基础上,通过指定第三个参数来实现:

var lb = godking.listboxEX(	mainForm.listbox,
                    menulist,
                    {itemHeight=60,hideOpenedIcon=true,useGdip=false}
                    //使用默认主题,项目高度60,隐藏右边小三角,不使用防锯齿。
                   )

 B、使用 setTheme 实现:

var lb = godking.listboxEX(	mainForm.listbox,
                    menulist,
                    // 使用默认主题
                   )

lb.setTmeme( {itemHeight=60,hideOpenedIcon=true,useGdip=false} )
                    //修改当前主题参数:项目高度60,隐藏右边小三角,不使用防锯齿。

C、通过提前修改好主题表,然后创建时实现:

var theme = ..table.assign({}, godking.listboxEX.theme_light,{itemHeight=60,hideOpenedIcon=true,useGdip=false})
var lb = godking.listboxEX(	mainForm.listbox,menulist,theme)

D、直接修改内置主题模板: 

..table.assign(godking.listboxEX.theme_light,{itemHeight=60,hideOpenedIcon=true,useGdip=false})
var lb = godking.listboxEX(	mainForm.listbox,menulist,godking.listboxEX.theme_light)

你可能感兴趣的:(aardio,库,aardio,listbox,自绘)