虚表 —— 图标缩放动画

光庆 1月前 447

Code AardioLine:103复制
  • 1.
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.
  • 7.
  • 8.
  • 9.
  • 10.
  • 11.
  • 12.
  • 13.
  • 14.
  • 15.
  • 16.
  • 17.
  • 18.
  • 19.
  • 20.
  • 21.
  • 22.
  • 23.
  • 24.
  • 25.
  • 26.
  • 27.
  • 28.
  • 29.
  • 30.
  • 31.
  • 32.
  • 33.
  • 34.
  • 35.
  • 36.
  • 37.
  • 38.
  • 39.
  • 40.
  • 41.
  • 42.
  • 43.
  • 44.
  • 45.
  • 46.
  • 47.
  • 48.
  • 49.
  • 50.
  • 51.
  • 52.
  • 53.
  • 54.
  • 55.
  • 56.
  • 57.
  • 58.
  • 59.
  • 60.
  • 61.
  • 62.
  • 63.
  • 64.
  • 65.
  • 66.
  • 67.
  • 68.
  • 69.
  • 70.
  • 71.
  • 72.
  • 73.
  • 74.
  • 75.
  • 76.
  • 77.
  • 78.
  • 79.
  • 80.
  • 81.
  • 82.
  • 83.
  • 84.
  • 85.
  • 86.
  • 87.
  • 88.
  • 89.
  • 90.
  • 91.
  • 92.
  • 93.
  • 94.
  • 95.
  • 96.
  • 97.
  • 98.
  • 99.
  • 100.
  • 101.
  • 102.
  • 103.
    • import win.ui;
    • import godking.vlistEx;
    • /*DSG{{*/
    • var winform = win.form(text="图标矩阵";right=600;bottom=400;bgcolor=16777215)
    • winform.add(
    • grid={cls="vlistEx";left=10;top=10;right=590;bottom=390;bgcolor=16777215;db=1;dl=1;dr=1;dt=1;z=1}
    • )
    • /*}}*/
    • // 添加图片
    • import inet.http
    • import godking.paint
    • var imgs = godking.paint.splitImage("https://aardio.online/upload/files/20250124/1737707732.png",5,5,0,0,0,0);
    • for(i=1;#imgs;1){
    • winform.grid.addImg("img"+i/*图片名称*/,imgs[i]/*图片文件*/,false/*是否替换*/);
    • }
    • // 定义图标数据
    • var iconData = {
    • { "img1", "img3" },
    • { "img5", "img7" },
    • }
    • // 定义标签文本
    • var title = {
    • { "图标1-1", "图标1-2"},
    • { "图标2-1", "图标2-2"},
    • }
    • // 设置数据表
    • winform.grid.setTable(iconData,null,100,1);
    • // 隐藏滚动条和表头
    • winform.grid.hideScroll(true/*隐藏横向滚动条*/,true/*隐藏纵向滚动条*/,true/*禁用滚轮和键盘滚动*/);
    • winform.grid.setHeaderHeight(0);
    • // 设置行高与样式
    • winform.grid.setRowHeight(100); // 行高100像素
    • winform.grid.lineWidthV = null; // 隐藏垂直分隔线
    • winform.grid.selectedBkColor = null; // 禁用选中背景色
    • winform.grid.padding = 10; // 单元格内边距
    • // 设置列类型为自绘
    • winform.grid.setColumnType(, 6/*_vlistEx_ColType_OwnerDraw*/ );
    • // 定义动画相关属性变量
    • var list,oldrow,oldcol = {};
    • // 定义动画刷新时钟
    • import win.timer
    • var timer = ..win.timer(winform);
    • timer.onTimer = function(){
    • thread.lock("list");
    • var rows = {};
    • for(k,v in list){
    • rows[v[1]] = true;
    • list[k][3]++;
    • if list[k][3]>5 list[k]=null;
    • }
    • for(k,v in rows){
    • winform.grid.redrawRow(k);
    • }
    • if !..table.count(list) owner.disable();
    • thread.unlock("list");
    • }
    • // 定义单元格内容绘制函数
    • winform.grid.ownerDraw = function (row,col,hdc,x,y,w,h,param,...){
    • var p = godking.paint.fromHdc(hdc);
    • var rect = ::RECT(x,y,x+w,y+h-20).inflate(-5,-5);
    • if list[row*1000+col] {
    • var pad = 5-..math.abs(list[row*1000+col][3]);
    • rect.inflate(pad,pad);
    • }
    • p.drawImage(rect /*绘制范围RECT*/,owner.getImg(param)/*图片*/,/*透明度或图片属性*/,true/*保持比例*/);
    • var rect = ::RECT(x,y+h-20,x+w,y+h);
    • p.drawText(rect /*文本范围RECT*/,title[row][col],owner.font,0/*格式*/,1/*水平*/,1/*垂直*/,false/*截短*/);
    • p.close();
    • }
    • // 定义鼠标移动到不同单元格时触发动画时钟
    • winform.grid.onMouseMove = function (x,y,row,col){
    • if oldrow!==row or oldcol!==col {
    • oldrow = row;
    • oldcol = col;
    • if row and col {
    • thread.lock("list");
    • list[row*1000+col] = {row,col,-5};
    • thread.unlock("list");
    • timer.enable(10);
    • }
    • }
    • }
    • // 点击事件处理(支持多行多列)
    • winform.grid.onClick = function(row, col, x, y, buttonIndex) {
    • if row and col {
    • win.msgbox("点击了第" + row + "行第" + col + "列:" + title[row][col]);
    • }
    • }
    • winform.show();
    • win.loopMessage();
    最新回复 (3)
    • java 1月前
      0 引用 2
    • zhhyit 1月前
      0 引用 3

      非常好的DEMO

    • zhhyit 1月前
      0 引用 4

      我在想能不能把这个效果,封装进 toolbar 的类库,写一个函数调用一下,类库里封装一下缩放的倍数(1.2倍),缩放的动画快慢(100毫秒),我想可以简化编写aardio的编写调用,只能依靠无往不胜的光大修改了。

    返回