A15：扑克牌的四种花色

一、四种花色字符

• 黑桃 spade
  text='\u2663'
• 方块 diamond
  text='\u2666'
• 红心 heart
  text='\u2665'
• 梅花 club
  text='\u2660'

二、scale 属性

• 用于控制皮肤的缩放比例
• 存在问题：字符可以缩放，但是不能旋转。

三、程序

// 用plus控件 绘制4种 扑克牌 的花色，加一个按钮，可以放大缩小 ，
import fonts.fontAwesome;
import win.ui;
/*DSG{{*/
var winform = win.form(text="扑克牌花色 - plus 控件演示";right=557;bottom=267)
winform.add(
btnScale={cls="plus";text="点击放大内容";left=180;top=200;right=380;bottom=240;bgcolor=0xB0B28F;color=0xFFFFFF;font=LOGFONT(h=-16);notify=1;z=1};
club={cls="plus";text='\u2663';left=411;top=73;right=511;bottom=173;font=LOGFONT(h=-80);z=5};
diamond={cls="plus";text='\u2666';left=289;top=73;right=389;bottom=173;color=0x0000FF;font=LOGFONT(h=-80);z=4};
heart={cls="plus";text='\u2665';left=167;top=73;right=267;bottom=173;color=0x0000FF;font=LOGFONT(h=-80);z=3};
spade={cls="plus";text='\u2660';left=45;top=73;right=145;bottom=173;font=LOGFONT(h=-80);z=2}
)
/*}}*/

// 为所有 plus 控件设置交互样式
for(name,ctrl in winform.eachControl("plus")){
    ctrl.skin({
        color = {
            hover = 0xFFFF0000;
            active = 0xFF00FF00;
        }
    })
}

// 定义花色控件数组
var pokerCtrls = { winform.spade; winform.heart; winform.diamond; winform.club };

// 记录当前缩放状态
var isScaledUp = false;

// 按钮点击事件实现放大缩小效果
winform.btnScale.oncommand = function(id,event){
    isScaledUp = !isScaledUp;
    
    var scaleValue = isScaledUp ? 1.5 : 1.0;
    var btnText = isScaledUp ? "点击还原内容" : "点击放大内容";
    
    winform.btnScale.text = btnText;
    
    // 遍历花色控件应用缩放样式
    for(i=1;#pokerCtrls){
        var ctrl = pokerCtrls[i];
        ctrl.skin({
            scale = {
                default = scaleValue;
            };
            color = {
                hover = 0xFFFF0000;
                active = 0xFF00FF00;
            }
        });
    }
}

// 初始化花色控件的初始样式（居中缩放）
for(i=1;#pokerCtrls){
    pokerCtrls[i].skin({
        scale = { default = 1.0 };
    })
}


winform.show();
win.loopMessage();

四、运行结果