aardio常用小工具

发布时间 2023-06-14 15:31:40作者: 周文豪

一、液晶计时器(Liquid Crystal Display)

1、先在界面添加plus,名称为plusClock

2、代码如下:

import win.ui.lcdClock;
var lcdClock = win.ui.lcdClock(mainForm.plusClock);
lcdClock.startClock();

3、效果:

二、设置字体图标

1、先在界面添加plus,名称为btnColor1

2、设置字体图标

选中plus,在工具---->界面---->字体图标,选中一个图标后,右侧会显示转义字符

点击右侧红色的图标,就能在plus位置出显示图标,如下所示:

此时plus属性中的文本自动添加相应的值

三、通过调色器修改液晶计时器的颜色

1、在范例---->高级图像控件(plus)---->运行时调试中复制如下代码

//液晶计时器
import fonts.fontAwesome;
import win.ui;
import win.ui.lcdClock;
var lcdClock = win.ui.lcdClock(winform.plusClock);
if(!lcdClock.setImageAttributes) error("请先更新 win.ui.lcdClock 扩展库",2)
lcdClock.startClock();
import fsys.config;
var config = fsys.config(io.appData("aardio/std/lcdClock"))
if(config.setting.color){
    lcdClock.setColor(config.setting.color);
}

winform.btnColor.skin({
    background={
        active=0xFF0078B0;
        hover=0xFF00AEFF;
    }; 
})

import win.ui.ctrl.pick;
winform.btnColor.oncommand = function(id,event){
    var picker = win.ui.ctrl.pick(winform);
    
    if(config.setting.color){
        picker.setColor(config.setting.color);
    }
    picker.onColorChange = function(argb){
        lcdClock.setColor(argb);
        config.setting.color = argb;
    }
    
    picker.onInitDialog = function(){
        win.center(picker.hwnd,winform.hwnd);
        picker.top = winform.top + winform.btnColor.bottom;
    }
    
    picker.doModal()
}

注意:(1)、由于将代码放到main.aardio中,故需要将winform修改为mainForm。(2)、将btnColor换成我们的btnColor1。

效果如下:

发现点击时存在背景色,

2、修改背景色为无色

在工具---->界面---->plus配色工具,

得到色号为:0xB348C3

修改代码

mainForm.btnColor1.skin({
    background={
        active=0xFF0078B0;
        hover=0xFF00AEFF;
    }; 
})

mainForm.btnColor1.skin({
    background={
        active=0xB348C3;
        hover=0xB348C3;
    }; 
})

最终代码:

import fonts.fontAwesome;
import win.ui.lcdClock;
import win.ui.lcdClock;

var lcdClock = win.ui.lcdClock(mainForm.plusClock);
if(!lcdClock.setImageAttributes) error("请先更新 win.ui.lcdClock 扩展库",2)
lcdClock.startClock();
import fsys.config;
var config = fsys.config(io.appData("aardio/std/lcdClock"))
if(config.setting.color){
    lcdClock.setColor(config.setting.color);
}

mainForm.btnColor1.skin({
    background={
        active=0xB348C3;
        hover=0xB348C3;
    }; 
})

import win.ui.ctrl.pick;
mainForm.btnColor1.oncommand = function(id,event){
    var picker = win.ui.ctrl.pick(mainForm);
    
    if(config.setting.color){
        picker.setColor(config.setting.color);
    }
    picker.onColorChange = function(argb){
        lcdClock.setColor(argb);
        config.setting.color = argb;
    }
    
    picker.onInitDialog = function(){
        win.center(picker.hwnd,mainForm.hwnd);
        picker.top = mainForm.top + mainForm.btnColor1.bottom;
    }
    
    picker.doModal()
}

 

效果如下:

四、提示控件

范例---->windows窗口---->提示控件,复制如下代码:

import win.ui.tooltip; 
var balloonTipCtrl = win.ui.tooltip.tracking(winform,false);
winform.plusTracking.onMouseEnter = function(wParam,lParam){ 
    var x,y,cx,cy = winform.plusTracking.getPos(true);
    
    //手动显示提示
    balloonTipCtrl.setText("手动跟踪模式的提示控件").trackPopup(true,x+20,y+cy );
}

winform.plusTracking.onMouseLeave = function(wParam,lParam){ 
    balloonTipCtrl.trackPopup(false); //手动关闭提示
}

winform.plusTracking.skin({
    background = {
        default=0xFF8FB2B0;
        hover=0xFF928BB3
    }
})

注意:

(1)、修改winform为mainForm;(2)、修改plusTracking为我们的btnColor1;(3)、由于上面我们已经设置过了mainForm.btnColor1.skin,这里可以删除。

最终代码如下:

import win.ui.tooltip; 
var balloonTipCtrl = win.ui.tooltip.tracking(mainForm,false);
mainForm.btnColor1.onMouseEnter = function(wParam,lParam){ 
    var x,y,cx,cy = mainForm.btnColor1.getPos(true);
    
    //手动显示提示
    balloonTipCtrl.setText("设置液晶计时器颜色").trackPopup(true,x+20,y+cy );
}

mainForm.btnColor1.onMouseLeave = function(wParam,lParam){ 
    balloonTipCtrl.trackPopup(false); //手动关闭提示
}

效果如下:

我们可以修改提示框的位置:将20改为80

mainForm.btnColor1.onMouseEnter = function(wParam,lParam){ 
    var x,y,cx,cy = mainForm.btnColor1.getPos(true);
    
    //手动显示提示
    balloonTipCtrl.setText("设置液晶计时器颜色").trackPopup(true,x+80,y+cy );
}

效果如下: