Qt的電子時(shí)鐘是個(gè)老掉牙的demo了，但是利用lcdNumber顯示的樣子非常老土（下圖第一個(gè)顯示效果），一看就知道是從qt幫助文檔里摘出來(lái)的example，毫無(wú)新意。

美化一下系統(tǒng)時(shí)鐘，拋開(kāi)固有控件軀殼，DIY效果讓人眼前一亮，要知道細(xì)節(jié)決定UI成敗。這也是我一直所追求的。

思路非常簡(jiǎn)單，就是利用label或者button貼圖變化顯示。

一說(shuō)到貼圖，有人可能就會(huì)認(rèn)為代碼冗余，哐哐的加載圖片大坨的判斷和代碼量……其實(shí)貼圖也講究方法，比如我實(shí)現(xiàn)了一個(gè)：

getPngName(QChar x)來(lái)獲取資源名稱(chēng)，和數(shù)字0123456789對(duì)應(yīng)起來(lái)，即：資源圖片名稱(chēng)為0.png，1.png...以此類(lèi)推，所以只需要：


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

就可以了。真的很簡(jiǎn)單吧……

全部代碼就這么幾行：

Clock::Clock(QWidget *parent) : QWidget(parent), ui(new Ui::Clock) { ui->setupUi(this); timer = new QTimer(this); connect(timer, SIGNAL(timeout()), this, SLOT(showTime())); timer->start(1000); showTime(); } Clock::~Clock() { delete ui; } void Clock::showTime() { //lcd QTime time = QTime::currentTime(); QString text = time.toString("hh:mm:ss"); ui->lcdNumber->display(text); //ourclock ui->hourh->setIcon(QPixmap(this->getPngName(text[0]))); ui->hourl->setIcon(QPixmap(this->getPngName(text[1]))); ui->minh->setIcon(QPixmap(this->getPngName(text[3]))); ui->minl->setIcon(QPixmap(this->getPngName(text[4]))); ui->sech->setIcon(QPixmap(this->getPngName(text[6]))); ui->secl->setIcon(QPixmap(this->getPngName(text[7]))); } QString Clock::getPngName(QChar x) { return (x+QString(".png") ); }

其實(shí)demo很簡(jiǎn)單，重點(diǎn)是變換顯示效果的思想和手段。

Any good ideas? 還是那四個(gè)字：歡迎交流~~~

Qt - 與眾不同的電子時(shí)鐘