欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

使用QT设计一个简单的时钟

程序员文章站 2024-01-31 12:42:10
...

先上效果图:
使用QT设计一个简单的时钟
预备知识
一.钟表实现原理
设置定时器timer,每隔1000毫秒(即1s)发送timeout()信号到槽函数update(),重绘事件函数paintEvent(QPaintEventevent)
二.钟表的绘制方法
拆分钟表:表盘 数字 刻度线 指针
paintEvent(QPaintEvent
event)
1.设置定时器,时间间隔为1000毫秒,并且将定时器时间与update函数关联为信号和槽,定时器每隔1秒发送一个信号
2.绘制时针分针秒针的形状。

  // 时针、分针、秒针 - 多边形
    static const QPoint hourHand[3] = {
        QPoint(3, 8),
        QPoint(-3, 8),
        QPoint(0, -40)
    };


    static const QPoint minuteHand[3] = {
        QPoint(3, 8),
        QPoint(-3, 8),
        QPoint(0, -65)
    };


    static const QPoint secondHand[3] = {
        QPoint(3, 8),
        QPoint(-3, 8),
        QPoint(0, -80)
    };

3.绘制时针和时刻度线

     // 绘制时针
        painter.setPen(Qt::NoPen);
        painter.setBrush(hourColor);
        painter.save();
        painter.rotate(30.0 * ((time.hour() + time.minute() / 60.0)));
        painter.drawConvexPolygon(hourHand, 3);
        painter.restore();
        painter.setPen(hourColor);
            // 绘制时刻度线
        for (int i = 0; i < 12; ++i)
        {
            painter.drawLine(88, 0, 96, 0);
            painter.rotate(30.0);
        }
        QFont font = painter.font();
        font.setBold(true);
        painter.setFont(font);


下面是一些基础的绘图函数:
drawPoint() 绘制点
drawLine() 绘制线
drawRect() 绘制矩形
drawEllipse() 绘制椭圆(绘制圆也是此函数)
drawConvexPolygon() 绘制凸多边形
drawText() 编制文本

特别的,我们还会经常用到
QPen:绘制几何图形的边缘,可绘制颜色,宽度,线的风格等
QBrush:用于几何图形的调色板与填充
则可借用setPen()来当做画笔来使用。
setBrush()来当做填充器使用来填充颜色。
setPen(color);
然后我们的绘制将会用此颜色的画笔来绘制图形边缘。
setBrush(color);

主要代码展示:

void Widget::drawhourhand(QPainter*painter)
{
    QTime time=QTime::currentTime();
    painter->setBrush(Qt::blue);//画刷,填充
    painter->setPen(Qt::Dense7Pattern);//画笔,制作廓线
    painter->save();
    painter->rotate(30.0*(time.hour()+time.minute()/60));//使得指针旋转到当前时间位置
    painter->drawConvexPolygon(hourhand,4);;//绘制时针(凸多边形)
    painter->restore();//与save连着用 绘制图形后复位坐标系
}
void Widget::drawminutehand(QPainter*painter)
{
    QTime time=QTime::currentTime();
    painter->setBrush(Qt::white);
    painter->setPen(Qt::Dense5Pattern);
    painter->save();
    painter->rotate(6.0*(time.minute()+time.second()/60.0));
    painter->drawConvexPolygon(minutehand,4);
    painter->restore();
}
void Widget::drawsecondhand(QPainter*painter)
{
    QTime time=QTime::currentTime();
    painter->setBrush(Qt::red);
    painter->setPen(Qt::Dense5Pattern);
    painter->save();
    painter->rotate(6*time.second());
    painter->drawPolygon(minutehand,4);
    painter->restore();
}
``


```cpp
#include "widget.h"
#include "ui_widget.h"


Widget::Widget(QWidget *parent) :
    QWidget(parent),
    ui(new Ui::Widget)
{
    ui->setupUi(this);
    font.setPixelSize(10);
    setFont(font);
    setWindowTitle("THE CLOCK");
    resize(1200,820);
}


Widget::~Widget()
{
    delete ui;
}
const QPoint Widget::hourhand[4]={
     QPoint(5,5),QPoint(0,13),QPoint(-5,5),QPoint(0,-40)
};
const QPoint Widget::minutehand[4]={
     QPoint(3,5),QPoint(0,16),QPoint(-3,5),QPoint(0,-70)
};
const QPoint Widget::secondhand[4]={
     QPoint(0,0),QPoint(0,0),QPoint(0,0),QPoint(0,0)
};
void Widget::drawhourhand(QPainter*painter)
{
    QTime time=QTime::currentTime();
    painter->setBrush(Qt::blue);//画刷,填充
    painter->setPen(Qt::Dense7Pattern);//画笔,制作廓线
    painter->save();
    painter->rotate(30.0*(time.hour()+time.minute()/60));//使得指针旋转到当前时间位置
    painter->drawConvexPolygon(hourhand,4);;//绘制时针(凸多边形)
    painter->restore();//与save连着用 绘制图形后复位坐标系
}
void Widget::drawminutehand(QPainter*painter)
{
    QTime time=QTime::currentTime();
    painter->setBrush(Qt::white);
    painter->setPen(Qt::Dense5Pattern);
    painter->save();
    painter->rotate(6.0*(time.minute()+time.second()/60.0));
    painter->drawConvexPolygon(minutehand,4);
    painter->restore();
}
void Widget::drawsecondhand(QPainter*painter)
{
    QTime time=QTime::currentTime();
    painter->setBrush(Qt::red);
    painter->setPen(Qt::Dense5Pattern);
    painter->save();
    painter->rotate(6.0*time.second());
    painter->drawPolygon(minutehand,4);
    painter->restore();
}
void Widget::paintEvent(QPaintEvent*event)
{
    QPainter painter(this);
    QTimer*timer=new QTimer(this);
    timer->start(1000);
    connect(timer,SIGNAL(timeout()),this,SLOT(update()));
    QPixmap map(":/new/prefix1/timg (1).jfif");
    QRect q(0,0,1200,800);//截取这么大的面积
    QRect q2(0,0,width(),height());//放到指定大小的框中
    painter.drawPixmap(q2,map,q);
    painter.setRenderHint(QPainter::Antialiasing,true);//反走样
    int side=qMin(width(),height());
    painter.setWindow(0,0,230,230);//原本截取放大的面积区域多大
    painter.setViewport(96,0,side,side);//映射到新的区域面积多大
    painter.translate(100,100);//重新设定坐标原点
    drawhourhand(&painter);
    drawminutehand(&painter);
    drawsecondhand(&painter);
    drawclockdial(&painter);
    QString timeStr= QTime::currentTime().toString();     //绘制当前的电子时间
    painter.setPen(Qt::white);
    painter.drawText(-20,30,80,30,0,timeStr);
    painter.setBrush(Qt::black);
    painter.drawEllipse(QPoint(0,0),3,3);//中间画个小圆点
   // QTransform Transform;
   // Transform.rotate(90);
   // painter.setTransform(Transform);
    painter.drawText(-53,-30,QStringLiteral("老子利指导,杀人先看表"));
}
void Widget::drawclockdial(QPainter*painter)
{
    hourhandpen.setColor(Qt::white);
    hourhandpen.setWidth(2.0);//设置小时刻度线为粗黑
    minutehandpen.setColor(Qt::white);
    for(int i=1;i<=60;i++)
    {
        painter->save();
        painter->rotate(6*i);
        if(i%5==0)
        {
            painter->setPen(hourhandpen);
            painter->drawLine(0,-98,0,-82);//原点变了
            painter->drawText(-20,-82,40,40,Qt::AlignHCenter|Qt::AlignTop,QString::number(i/5));
        }
        else
        {
            painter->setPen(minutehandpen);
            painter->drawLine(0,-98,0,-88);
        }
        painter->restore();
    }
}
相关标签: qt