QT實現(xiàn)動態(tài)時鐘
本文實例為大家分享了QT實現(xiàn)動態(tài)時鐘的具體代碼,供大家參考,具體內容如下
首次學習QT,這次用QT實現(xiàn)了動態(tài)圖的制作,并成功制作了一個簡易的時鐘,效果如圖:
加快100倍效果
所用背景圖,如下(素材來源于百度圖片):
代碼,原理如下:
mainwindow.h
#ifndef MAINWINDOW_H #define MAINWINDOW_H #include <QMainWindow> QT_BEGIN_NAMESPACE namespace Ui { class MainWindow; } QT_END_NAMESPACE class MainWindow : public QMainWindow { Q_OBJECT public: MainWindow(QWidget *parent = nullptr); ~MainWindow(); void paintEvent(QPaintEvent *event); //重載paintEvent函數(shù) void timerEvent(QTimerEvent *event); //重載timerEvent函數(shù) private: Ui::MainWindow *ui; int second=0; //該變量用來記錄秒針旋轉度數(shù) double minute=0,hour=0;//該變量分別用來記錄分針,時針旋轉度數(shù) QPixmap pic; //用來保存導入的背景位圖 }; #endif // MAINWINDOW_H
main.cpp
#include "mainwindow.h" #include <QApplication> int main(int argc, char *argv[]) { QApplication a(argc, argv); MainWindow w; w.show(); return a.exec(); }
mainwindow.cpp
#include "mainwindow.h" #include "ui_mainwindow.h" #include<QPainter> #define PI 3.1415926 #define WIDE 1000 #define HIGHT 1000 MainWindow::MainWindow(QWidget *parent) : QMainWindow(parent) , ui(new Ui::MainWindow) { ui->setupUi(this); resize(WIDE,HIGHT); startTimer(1000); } MainWindow::~MainWindow() { delete ui; } void MainWindow::timerEvent(QTimerEvent *event)//該函數(shù)每秒執(zhí)行一次 { second+=6; //秒針刻度+6° minute+=0.1; //秒針刻度+0.1°(秒針速度/60) hour+=0.0016666667; //秒針刻度+0.0016666667°(秒針速度/3600) repaint(); } void MainWindow::paintEvent(QPaintEvent *event) { QPainter painter(this); QPixmap pix(":/new/prefix1/1.png"); //導入背景位圖 pic=pix; QRect p(0,0,1000,1000); QRect p2(0,0,1000,1000); painter.drawPixmap(p2,pic,p); //以原有尺寸從界面(0,0)點繪制位圖 painter.translate(WIDE/2-10,HIGHT/2); //設置繪圖原點坐標為(WIDE/2-10,HIGHT/2)(此處坐標即為表盤中心,便于接下來的指針即刻度線繪制時的旋轉操作) painter.drawEllipse(QPoint(10,0),327,327); painter.setBrush(QBrush(QColor(0,0,0))); painter.drawEllipse(QPoint(0,0),10,10); for (int i=1;i<=12;i++) { QFont font; //設置字體 font.setPointSize(17); //設置字體大小 font.setFamily("Microsoft YaHei"); //設置字體樣式 font.setLetterSpacing(QFont::AbsoluteSpacing,0); painter.setFont(font); QString s=QString("%1").arg(i); //將int型變量i轉化為Qstring類型以便用drawText函數(shù)畫在窗口 painter.drawText(QPoint(290*cos(PI*(i-1)/6-PI/3),290*sin(PI*(i-1)/6-PI/3)+10),s); //將數(shù)字1-12在窗口畫在以原點為中心,290為半徑的圓上每次繪畫后角度順時針旋轉30° } for (int i=0;i<=60;i++) //表盤刻度的繪制以及顏色漸變的實現(xiàn) { painter.translate(WIDE/2,HIGHT/2); //設置繪圖原點為(WIDE/2,HIGHT/2) if(i*12<255) //從六點左邊一格的刻度開始繪制,且每次繪制時以i為變量改變rgb顏色實現(xiàn)鐘表刻度填充色的漸變 { painter.setBrush(QBrush(QColor(0,0,i*12))); } else if(i*12>255&i*12<510) { painter.setBrush(QBrush(QColor(0,((42-i)*12)%255,0))); } else { painter.setBrush(QBrush(QColor(((63-i)*12)%255,0,0))); } if(i%5==0) //當i為5的倍數(shù)時繪制較長刻度線 繪制方法為通過rotate函數(shù)以之前設置的原點為旋轉軸旋轉一定角度到相應刻度線位置 { painter.rotate(6*i); painter.drawRect(0,327,4,-30); } else { painter.rotate(6*i); painter.drawRect(0,327,2,-20); } painter.resetTransform(); //重置繪圖中心 } painter.setBrush(QBrush(QColor(0,0,0))); //設置黑色填充色 painter.translate(WIDE/2-10,HIGHT/2); //繪制秒針 painter.rotate(second); //以原點為軸旋轉相應角度以指向相應刻度 下同 painter.drawRect(-5,-320,10,320); painter.resetTransform(); painter.translate(WIDE/2-10,HIGHT/2); //繪制分針 painter.rotate(minute); painter.drawRect(-3,-300,6,300); painter.resetTransform(); painter.translate(WIDE/2-10,HIGHT/2); //繪制時針 painter.rotate(hour); painter.drawRect(-7,-180,14,180); painter.resetTransform(); }
注意點:
1.painter.translate(WIDE/2,HIGHT/2);
設置繪圖原點,使用后接下來的繪圖坐標都將以括號中的坐標為原點進行繪圖,直至使用painter.resetTransform()函數(shù)
2.painter.rotate()時針指針即刻度線都是通過rotate()函數(shù)進行旋轉繪制的
3.painter.setBrush(QBrush(QColor(0,0,0)));
QBrush()設置畫刷
QColor(0,0,0)設置rgb顏色三個參數(shù)全0為黑,全255為白,可根據(jù)個人喜好調整
4.second+=6; //秒針刻度+6°
minute+=0.1; //秒針刻度+0.1°(秒針速度/60)
hour+=0.0016666667; //秒針刻度+0.0016666667°(秒針速度/3600)
注意調整好時針,分針,秒針之間的關系
5.repaint()每秒需要調用repaint()函數(shù)以來重新繪制窗口部件以繪制時鐘的下一個狀態(tài)
6.其他詳細信息請參考代碼內注釋
若文章有錯誤或代碼有更優(yōu)方法歡迎批評指正
以上就是本文的全部內容,希望對大家的學習有所幫助,也希望大家多多支持腳本之家。