这是AntdUI做的表格界面:

这是用虚表高仿的:

为了方便操作,对虚表库进行了升级,请用最新版。
以下为实现代码:
import win.ui;
import godking.vlistEx;
/*DSG{{*/
mainForm = win.form(text="vlistEx - table adapter";right=998;bottom=559;border="thin")
mainForm.add(
vlist={cls="vlistEx";left=5;top=5;right=994;bottom=553;db=1;dl=1;dr=1;dt=1;edge=1;transparent=1;z=1}
)
/*}}*/
//填充虚表数据
var statuses = ["Running","Pending","Closed","Error"];
var cities = [
"London Park",
"New York No. 1 Lake Park",
"Sydney Road",
"Tokyo Tower Street",
"Berlin Square",
"Singapore Bay"
];
var t = {fields={" ","ID","Name","Age","Address","Status","Progress","Enabled","Created","Action"}};
for(i=1;137;1){
var st = statuses[(i - 1) % #statuses + 1];
table.push(t,
{
ID = i;
Name = "Edward King " ++ i;
Age = 18 + (i * 7) % 45;
Address = cities[(i - 1) % #cities + 1] ++ " no. " ++ i;
Status = st;
Progress = ((i * 13) % 100);
Enabled = i % 3 != 0;
Created = time.date(2026,(i - 1) % 12 + 1,(i - 1) % 28 + 1);
Action="View";
}
)
}
mainForm.vlist.setTable(t,,{30,50,120,50,100,100,100,100,100,100,100},1);
mainForm.vlist.fillParent(5/*列号支持负数*/,-1/*滚动条计算方式-1或-2*/)
//常规设置
mainForm.vlist.checkBox.show = true;
mainForm.vlist.lineWidthV=0;
mainForm.vlist.onSortColumn = {2,3,4,5,6,7,8,9,10,function(col,desc,row,mergeCol){
owner.sort(col/*排序列*/,desc/*是否逆序*/,3/*数据转换0无1时间2数值3文本*/,true/*是否使用微软排序法*/,desc/*null值排序位置false靠前true靠后*/);
}};
mainForm.vlist.color1=0x888888
mainForm.vlist.bkColor1=0xF0F0F0;
mainForm.vlist.selectedBkColor=0xE0FFFF;
mainForm.vlist.checkBox.setColor(0xFFAAAAAA);
mainForm.vlist.setHeaderHeight(40);
mainForm.vlist.setRowHeight(40);
mainForm.vlist.font = ::LOGFONT(name="Microsoft YaHei";h=12;color=0x000000 );
mainForm.vlist.headerFont = ::LOGFONT(name="Microsoft YaHei";h=12;color=0x000000;bold=true);
//设置第7列为进度条
mainForm.vlist.setColumnType(7/*列号*/,3/*_vlistEx_ColType_Progress*/,0xFFDDDDDD/*背景色ARGB*/,0xFF1677FF/*前景色ARGB*/,/*是否显示非数值内容*/,30/*圆角半径*/,true/*是否隐藏进度值*/,50/*进度条宽度*/,12/*进度条高度*/);
mainForm.vlist.onDrawProgress = function(hdc,row,col,text,font,rect){
var num=tonumber(text):0
if num>80 return null,0xFF52C41A,null,"优秀";
if num>40 return null,0xFF1677FF,null,"一般";
return null,0xFFFAAD14,null,"很差";
}
//设置第10列为按钮
mainForm.vlist.setColumnType(10/*列号*/,5/*_vlistEx_ColType_Button*/,true/*自绘按钮*/,0xFF1677FF/*正常颜色*/,0xFF000088/*悬停颜色*/,0xFFFFFFFF/*正常文本颜色*/,0xFFFFFFFF/*悬停文本颜色*/,/*正常边框颜色*/,/*悬停边框颜色*/,4/*圆角半径*/,50/*宽度*/,25/*高度*/);
//设置第6列为按钮,并通过事件改变按钮外观
mainForm.vlist.setColumnType(6/*列号*/,5/*_vlistEx_ColType_Button*/,true/*自绘按钮*/,0xFF1677FF/*正常颜色ARGB*/,0xFF000088/*悬停颜色ARGB*/,0xFFFFFFFF/*正常文本颜色ARGB*/,0xFFFFFFFF/*悬停文本颜色ARGB*/,/*正常边框颜色ARGB*/,/*悬停边框颜色ARGB*/,6/*圆角半径*/,50/*宽度*/,25/*高度*/);
var colors = {
Running = {0xFFF6FFED,0xFF73C419,0xFFD2EFBB};
Pending = {0xFFFFFBE6,0xFFFAAD14,0xFFFEEFBB};
Closed = {0xFFFAFAFA,0xFF000000,0xFFE6E6E6};
Error = {0xFFFFF2F0,0xFFFF4C4E,0xFFFEDEDB};
}
mainForm.vlist.onDrawButton = function(hdc,row,col,text,font,rect,xuanting) {
if row and col===6 {
var textrect = mainForm.vlist.getSize(hdc,font,text,0/*限制宽度*/,0/*限制高度*/,true/*支持纯文本*/)
return colors[text][[1]],colors[text][[2]],colors[text][3],6,textrect.width+20,null;
}
}
//设置第8列为开关
mainForm.vlist.setColumnType(8/*列号*/,4/*_vlistEx_ColType_Switch*/,true/*点击切换*/,true/*使用内置函数*/,0xFFDDDDDD,0xFF1777FF,40,20)
//设置点击事件
mainForm.vlist.onClick = function(row/*行*/,col/*列*/,x,y,buttonIndex/*按钮区域序号*/){
if row and col==10 {
..win.msgbox("您点击了按钮");
}
}
mainForm.show();
win.loopMessage();