Qt - 与众不同的电子时钟

 Qt的电子时钟是个老掉牙的demo了,但是利用lcdNumber显示的样子非常老土(下图第一个显示效果),一看就知道是从qt帮助文档里摘出来的example,毫无新意。
Qt - 与众不同的电子时钟

美化一下系统时钟,抛开固有控件躯壳,DIY效果让人眼前一亮,要知道细节决定UI成败。这也是我一直所追求的。

思路非常简单,就是利用label或者button贴图变化显示。

一说到贴图,有人可能就会认为代码冗余,哐哐的加载图片大坨的判断和代码量……其实贴图也讲究方法,比如我实现了一个:

getPngName(QChar x)来获取资源名称,和数字0123456789对应起来,即:资源图片名称为0.png,1.png...以此类推,所以只需要:

  1. QString Clock::getPngName(QChar x)
  2. {
  3. return (x+QString(".png") );
  4. }

就可以了。真的很简单吧……

全部代码就这么几行:

  1. Clock::Clock(QWidget *parent) :
  2. QWidget(parent),
  3. ui(new Ui::Clock)
  4. {
  5. ui->setupUi(this);
  6. timer = new QTimer(this);
  7. connect(timer, SIGNAL(timeout()), this, SLOT(showTime()));
  8. timer->start(1000);
  9. showTime();
  10. }
  11. Clock::~Clock()
  12. {
  13. delete ui;
  14. }
  15. void Clock::showTime()
  16. {
  17. //lcd
  18. QTime time = QTime::currentTime();
  19. QString text = time.toString("hh:mm:ss");
  20. ui->lcdNumber->display(text);
  21. //ourclock
  22. ui->hourh->setIcon(QPixmap(this->getPngName(text[0])));
  23. ui->hourl->setIcon(QPixmap(this->getPngName(text[1])));
  24. ui->minh->setIcon(QPixmap(this->getPngName(text[3])));
  25. ui->minl->setIcon(QPixmap(this->getPngName(text[4])));
  26. ui->sech->setIcon(QPixmap(this->getPngName(text[6])));
  27. ui->secl->setIcon(QPixmap(this->getPngName(text[7])));
  28. }
  29. QString Clock::getPngName(QChar x)
  30. {
  31. return (x+QString(".png") );
  32. }

其实demo很简单,重点是变换显示效果的思想和手段。

Any good ideas?  还是那四个字:欢迎交流~~~

上一篇:java设计模式——适配器模式 Java源代码


下一篇:TraceWrite waittype