工作时，我们常常会有这样的需求：用一个 LED 灯指示机器的工作状态：正常或故障。这样一个需求，对于我们入门就写点灯程序的点灯小能手来说，根本就是小意思。因为这只需要控制IO输出高电平或者低电平就可以达到要求。尽管如此简单，如果用的不好，那也是存在风险的：《引脚输出的隐藏BUG | 深入思考》。本篇笔记记录的当然不是简单的指示正常和故障这两种状态，而是多种状态。比如，快闪、慢闪、1秒闪1次，1秒闪3次等。不过，因精力有限，我先介绍一个简单的实现1.5秒闪烁1~5次的方法，并且通过对该方法的详细介绍，你也可以实现更复杂的指示功能（当然也可用于蜂鸣器等）。该方法有几点优势：1、代码实现简单；2、可用于多线程；3、移植方便；4、裸机、操作系统均可使用，可不需要定时器。当然也有缺点，就是只能指示最新的当前状态（也就是说，如果有多个线程同时调用，将指示最后一个调用时的状态），不过对于状态指示来说，这样足够了。为了实现1.5秒内闪烁5次，并且让代码尽可能的简单，我们可以将 1.5 s划分成 10 个等份，每个等份为 150 ms。假定，高电平为灭，低电平为亮。那么，如果我们要实现1.5 s 闪烁一次的效果，只需要在0 时刻设置为低电平，1时刻设置为高电平即可，其他时刻不需要操作电平，此时电平效果如下：这样，通过在指定时刻设置IO电平，即可达到闪烁的效果。现在的问题是，如何获得稳定的周期时间，这已经是老生常谈的问题，如果不明白，可以参考以下笔记：《延时功能进化论(合集)》。这里我们需要实现两个周期，一个是 1.5 s，一个是 150 ms，所以需要两个变量保存时间戳，同时为了实现单次延时，再增加一个变量，即关于时间的变量共有三个。下面贴代码，看看代码实现：代码注释比较详尽，如果看不懂，说明还没有理解以前写的笔记，建议翻翻以前的笔记。简单说明几点：1、为了移植方便，使用了一个函数指针设置LED电平，因此可以很方便的修改。2、可以方便配置多个LED，如果一个LED不够，那就俩。3、为了减少空间的使用，原本 4 字节的时间戳通过强制转化，使用 2 字节即可实现。4、单次超时时间实现。5、时间戳单位为 1 毫秒，同时 led_set_handle 函数为了保证时间精度，调用周期为 10 ms，该函数需要周期性调用，并且只可以在一个地方调用（一个LED情况下）。6、led_show 函数用于更新闪烁次数，可在闪烁次数变化的时候调用；同时可多线程使用，当然因为没有缓存，始终保存最后一次调用时的显示次数。7、led 作为共享资源，使用变量 curr_number 控制资源访问，保证指示不会出现混乱。8、指示更新周期1.5秒，即上层即使更新了 next_number ，最迟需要 1.5 后才会更新，最早更新时间为立刻。9、使用 C99 的特性，简化初始化过程​。

前言

emm… 懒得写描述了，直接看代码吧，或者先看看最后的效果图也行。
人比较懒，注释也没写，那凑合看好了。有问题请留言交流，看到会及时回复😄

聊聊代码

fr_light.h

#ifndef FRLIGHT_H
#define FRLIGHT_H

#include <qwidget.h>

class FrLight : public QWidget {
  Q_OBJECT

public:
  enum State {
    kDefault,
    kNormal,
    kWorking,
    kWarning,
    kMalfunction
  };

public:
  explicit FrLight(QWidget *parent = nullptr);

  void set_state(const State& state);

  void set_default_color(const QColor& default_color);
  void set_normal_color(const QColor& normal_color);
  void set_working_color(const QColor& working_color);
  void set_warning_color(const QColor& warning_color);
  void set_malfunction_color(const QColor& malfunction_color);

protected:
  void timerEvent(QTimerEvent *);
  void paintEvent(QPaintEvent *);

private:
  int _step;
  int _timer_id;

  State _state;
  \
  QColor _default_color;
  QColor _normal_color;
  QColor _working_color;
  QColor _warning_color;
  QColor _malfunction_color;

};

#endif // FRLIGHT_H

fr_light.cc

#include "fr_light.h"

#include <qpainter.h>
#include <qbrush.h>

FrLight::FrLight(QWidget *parent) :
  QWidget(parent),
  _step(60) ,
  _timer_id(0) ,
  _state(kWorking) ,
  _default_color(127, 127, 127) ,
  _normal_color(32, 255, 32) ,
  _working_color(32, 255, 32) ,
  _warning_color(255, 255, 32) ,
  _malfunction_color(255, 32, 32) {
  update();
}

void FrLight::set_state(const FrLight::State& state) {
  _state = state;
  if (kWorking == _state) {
    _timer_id = startTimer(16);
  } else {
    killTimer(_timer_id);
    _timer_id = 0;
  }
  update();
}

void FrLight::set_default_color(const QColor& default_color) {
  _default_color = default_color;
  update();
}

void FrLight::set_normal_color(const QColor& normal_color) {
  _normal_color = normal_color;
  update();
}

void FrLight::set_working_color(const QColor& working_color) {
  _working_color = working_color;
  update();
}

void FrLight::set_warning_color(const QColor& warning_color) {
  _warning_color = warning_color;
  update();
}

void FrLight::set_malfunction_color(const QColor& malfunction_color) {
  _malfunction_color = malfunction_color;
  update();
}

void FrLight::timerEvent(QTimerEvent*) {
  update();

  --_step;
  if (_step == -60) {
    _step = 60;
  }
}

void FrLight::paintEvent(QPaintEvent*) {
  int side = qMin(width(), height());

   QPainter painter(this);
   painter.setRenderHint(QPainter::Antialiasing, true);
   painter.translate(width() / 2, height() / 2);
   painter.scale(side / 100.0, side / 100.0);


   QColor start_color, mid_color, end_color;

   switch (_state) {
     case kDefault:
       start_color = _default_color;
       mid_color = _default_color;
       end_color = _default_color;
       mid_color.setAlpha(192);
       end_color.setAlpha(0);
       break;
     case kNormal:
       start_color = _normal_color;
       mid_color = _normal_color;
       end_color = _normal_color;
       mid_color.setAlpha(192);
       end_color.setAlpha(0);
       break;
     case kWorking:
       if (0 == _timer_id) {
         _timer_id = startTimer(16);
       }
       start_color = _working_color;
       mid_color = _working_color;
       end_color = _working_color;
       start_color.setAlpha(qAbs(int(_step * 4.25)));
       mid_color.setAlpha(qAbs(int(_step * 3.2)));
       end_color.setAlpha(0);
       break;
     case kWarning:
       start_color = _warning_color;
       mid_color = _warning_color;
       end_color = _warning_color;
       mid_color.setAlpha(192);
       end_color.setAlpha(0);
       break;
     case kMalfunction:
       start_color = _malfunction_color;
       mid_color = _malfunction_color;
       end_color = _malfunction_color;
       mid_color.setAlpha(192);
       end_color.setAlpha(0);
       break;
     default:
       start_color = _default_color;
       mid_color = _default_color;
       end_color = _default_color;
       mid_color.setAlpha(192);
       end_color.setAlpha(0);
       break;
   }

   QRadialGradient radial(0, 0, 50, 0, 0);    //设置圆的原点和焦点在中心,半径50
   radial.setSpread(QGradient::PadSpread);
   radial.setColorAt(0, start_color);
   radial.setColorAt(0.9, mid_color);
   radial.setColorAt(1, end_color);

   painter.setPen(Qt::transparent);
   painter.setBrush(radial);
   painter.drawEllipse(-50, -50, 100, 100);
}

效果图

前言

需要在界面上实时显示设备的状态，希望通过指示灯来显示，例如绿色代表正常，红色代表异常。

实现步骤

首先添加几个QLabel控件，下图添加了四个QLabel控件。对于QLabel，双击可以修改其text，在属性栏可以修改其objectName，修改led1、led2的objectName为label_led1、label_led2。

使用自定义函数setLED来实现LED灯。

// 该函数将label控件变成一个圆形指示灯，需要指定颜色color以及直径size
// color 0:grey 1:red 2:green 3:yellow
// size  单位是像素
setLED(QLabel* label, int color, int size)
{
    // 将label中的文字清空
    label->setText("");
    // 先设置矩形大小
    // 如果ui界面设置的label大小比最小宽度和高度小，矩形将被设置为最小宽度和最小高度；
    // 如果ui界面设置的label大小比最小宽度和高度大，矩形将被设置为最大宽度和最大高度；
    QString min_width = QString("min-width: %1px;").arg(size);              // 最小宽度：size
    QString min_height = QString("min-height: %1px;").arg(size);            // 最小高度：size
    QString max_width = QString("max-width: %1px;").arg(size);              // 最小宽度：size
    QString max_height = QString("max-height: %1px;").arg(size);            // 最小高度：size
    // 再设置边界形状及边框
    QString border_radius = QString("border-radius: %1px;").arg(size/2);    // 边框是圆角，半径为size/2
    QString border = QString("border:1px solid black;");                    // 边框为1px黑色
    // 最后设置背景颜色
    QString background = "background-color:";
    switch (color) {
    case 0:
        // 灰色
        background += "rgb(190,190,190)";
        break;
    case 1:
        // 红色
        background += "rgb(255,0,0)";
        break;
    case 2:
        // 绿色
        background += "rgb(0,255,0)";
        break;
    case 3:
        // 黄色
        background += "rgb(255,255,0)";
        break;
    default:
        break;
    }

    const QString SheetStyle = min_width + min_height + max_width + max_height + border_radius + border + background;
    label->setStyleSheet(SheetStyle);
}

在需要改变LED灯颜色的地方调用setLED即可。为了演示，我新建了MainWindow工程，在MainWindow类的构造函数中直接调用，运行程序时便会改变LED颜色。

MainWindow::MainWindow(QWidget *parent) :
    QMainWindow(parent),
    ui(new Ui::MainWindow)
{
    ui->setupUi(this);

    setLED(ui->label_led1, 1, 16);
    setLED(ui->label_led2, 2, 16);
}

效果如下：