[Qt学习笔记]QLabel实现圆形警示灯显示方法

1、使用Qt的design加载图像ico

使用圆形警示灯ico图像填充QLabel控件,在design界面中选中label控件,在pixmap的属性下选择不同的图片来填充。
1.JPG
这种填充方法有一个缺点,就是图像没有进行缩放,这样label控件的大小就会导致无法完全显示图像,这里一般按照图像的宽高来设定label尺寸属性。
2.JPG
这里水平和垂直策略都选择Maximum,然后把minimumSize和MaximumSize都设置成图像大小。

2、使用setStyleSheet()函数来修改QLabel

setStyleSheet()函数可以用来修改控件的显示qss,可以直接调用该函数将Label控件设定成警示灯的显示形式。

min-width:     40px;     //最小宽度 40px
min-height:    40px;     //最小高度 40px
max-width:     40px;     //最大宽度 40px 
max-height:    40px;     //最大高度 40px
border-radius: 20px;      //边框是圆角,半径20px
border:1px solid black;  //边框1px,边框黑色
background: red;        //背景是红色

这里设定宽度高度和圆角,将Label显示成圆形状态。

    const QString m_red_SheetStyle = "min-width: 40px; min-height: 40px;max-width:40px; max-height: 40px;border-radius: 20px; background:red";

    const QString m_green_SheetStyle = "min-width: 40px; min-height: 40px;max-width:40px; max-height: 40px;border-radius: 20px; ;background:green";

    const QString m_gray_SheetStyle = "min-width: 40px; min-height: 40px;max-width:40px; max-height: 40px;border-radius: 20px;  border:1px solid black;background:grey";

    const QString m_yellow_SheetStyle = "min-width: 40px; min-height: 40px;max-width:40px; max-height: 40px;border-radius: 20px;  border:1px solid black;background:yellow";


    ui->lab_LED_R->setStyleSheet(m_red_SheetStyle);// 红色圆形警示灯
    ui->lab_LED_G->setStyleSheet(m_green_SheetStyle);//绿色圆形警示灯
    ui->lab_LED_B->setStyleSheet(m_yellow_SheetStyle);//黄色圆形警示灯
    ui->lab_LED_GR->setStyleSheet(m_gray_SheetStyle);//灰色圆形警示灯

这里只介绍了简单的setStyleSheet()函数应用,包括一些过渡,透明等效果都可以使用setStyleSheet()函数来进行设置,这里就不展开了。
3.JPG

  • 4
    点赞
  • 33
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值