利用qt制作时钟
程序员文章站
2022-05-30 09:36:34
...
我们需要利用代码来进行一个时钟的制作,用窗口来显示。
首先需要通过QPainter类来在painterEvent()函数中来绘制钟表,以下是此类的一些基础函数。
介绍一些绘制图形函数:
drawPoint() 绘制点
drawLine() 绘制线
drawRect() 绘制矩形
drawEllipse() 绘制椭圆(绘制圆也是此函数)
drawConvexPolygon() 绘制凸多边形
drawText() 编制文本
还有QPainter类的某些角色
QPen:绘制几何图形的边缘,可绘制颜色,宽度,线的风格等
QBrush:用于几何图形的调色板与填充
则可借用setPen()来当做画笔来使用。
setBrush()来当做填充器使用来填充颜色。
setPen(color);
然后我们的绘制将会用此颜色的画笔来绘制图形边缘。
setBrush(color);
之后我们的绘制图形时,我们将用此颜色来填充。
其中颜色的定义:
QColor color1(0,0,0);//其中的三个数字分别代表的颜色的R.G.B码
QPainter类绘制时初始坐标为左上角顶点,此处为(0,0)
我们可以通过
painter.translate(x,y);
来重新确立坐标原点
以下是dialog.cpp的完整代码
#include "dialog.h"
#include "ui_dialog.h"
#include<QPainter>
#include<QTime>
#include<QTimer>
#include<QPixmap>
Dialog::Dialog(QWidget *parent)
: QDialog(parent)
, ui(new Ui::Dialog)
{
ui->setupUi(this);
resize(700,500);//程序框大小
//计时器的使用
QTimer *timer = new QTimer(this);
connect(timer,SIGNAL(timeout()),this,SLOT(update()));
timer->start(1);
}
Dialog::~Dialog()
{
delete ui;
}
void Dialog::paintEvent(QPaintEvent *event)
{
//指针的形状四边形绘制定义指针的四点
static const QPoint hourHand[4] = { QPoint(4,1), QPoint(-4,1), QPoint(-1,-35) ,QPoint(1,-35) };
static const QPoint minuteHand[4] = { QPoint(3,1), QPoint(-3,1), QPoint(-1,-60) ,QPoint(1,-60) };
static const QPoint secondHand[4] = { QPoint(2,1), QPoint(-2,1), QPoint(-1,-80) ,QPoint(1,-80) };
//颜色的定义
QColor color(0,0,0);
QColor color1(123,34,23);
QColor color2(255,255,153);
QPainter painter(this);
//调用资源绘制背景图
QPixmap map(":/new/prefix1/beijing/123.png");
QRect q(0,0,1000,675);
QRect q1(0,0,width(),height());
painter.drawPixmap(q1,map,q);
//更换坐标原点
painter.translate(550,200);
//首先我们通过 setRenderHint() 来设置反走样,否则绘制出来的线条会出现锯齿
painter.setRenderHint(QPainter::Antialiasing);
painter.drawEllipse(-90,-90,180,180);//钟的最外层圆绘制
painter.setPen(Qt::NoPen);
painter.setBrush(color);
painter.drawEllipse(-4,-4,8,8);//钟的中心原点,用一个黑色圆把指针尾巴覆盖
QTime time = QTime::currentTime();//校准系统时间
//时针的绘制
painter.setPen(Qt::NoPen);
painter.setBrush(color);
painter.save();//用来保存painter的状态
painter.rotate(30.0 * (time.hour() + time.minute() / 60.0));
painter.drawConvexPolygon(hourHand,4);
painter.restore();//恢复到初始坐标原点的状态
//描绘大刻度上的数字
painter.setPen(color);
for(int i=0;i<12;i++)
{
painter.rotate(30.0);
painter.drawLine(80,0,90,0);
painter.drawText(-20,-82,40,40,Qt::AlignHCenter|Qt::AlignTop,QString::number(i+1));
}
//分针的绘制
painter.setPen(Qt::NoPen);
painter.setBrush(color1);
painter.save();
painter.rotate(6.0 * (time.minute() + time.second() / 60.0));
painter.drawConvexPolygon(minuteHand,4);
painter.restore();
//小刻度
painter.setPen(color1);
for(int i = 0; i<60;i++)
{ if(i % 5)
painter.drawLine(85,0,90,0);
painter.rotate(6.0);
}
//秒针的绘制
painter.setPen(Qt::NoPen);
painter.setBrush(color2);
painter.save();
painter.rotate(6.0 * time.second());
painter.drawConvexPolygon(secondHand,4);
painter.restore();
}
dialog.h的代码
#ifndef DIALOG_H
#define DIALOG_H
#include <QDialog>
QT_BEGIN_NAMESPACE
namespace Ui { class Dialog; }
QT_END_NAMESPACE
class Dialog : public QDialog
{
Q_OBJECT
public:
Dialog(QWidget *parent = nullptr);
~Dialog();
void paintEvent(QPaintEvent*event);
private:
int rotate;
Ui::Dialog *ui;
};
#endif // DIALOG_H
最终的效果图
上一篇: 非洲。到处都是
下一篇: Android 应用界面显示流程