效果:
代码:
#ifndef ROTATINGCLOCKWIDGET_H
#define ROTATINGCLOCKWIDGET_H
#include <QWidget>
#include <QTimer>
class RotatingClockWidget : public QWidget
{
Q_OBJECT
public:
RotatingClockWidget(QWidget *parent = nullptr);
~RotatingClockWidget();
protected:
void paintEvent(QPaintEvent *event)override;
private:
void onSecondTimer();
void onAnimationTimer();
QTimer secondTimer;
QTimer animationTimer;
int second_OnePlace{0};
int second_TenPlace{0};
int minute_OnePlace{0};
int minute_TenPlace{0};
int hour_OnePlace{0};
int hour_TenPlace{0};
int second_OnePlace_rotatingValue{0};
int second_TenPlace_rotatingValue{-1};
int minute_OnePlace_rotatingValue{-1};
int minute_TenPlace_rotatingValue{-1};
int hour_OnePlace_rotatingValue{-1};
int hour_TenPlace_rotatingValue{-1};
};
#endif // ROTATINGCLOCKWIDGET_H
#include "rotatingclockwidget.h"
#include <QPainter>
#include <QPaintEvent>
#include <QTime>
#include <QDebug>
RotatingClockWidget::RotatingClockWidget(QWidget *parent)
: QWidget(parent)
{
setPalette(QColor(17,17,34));
connect(&secondTimer,&QTimer::timeout,this,&RotatingClockWidget::onSecondTimer);
secondTimer.start(1000);
connect(&animationTimer,&QTimer::timeout,this,&RotatingClockWidget::onAnimationTimer);
animationTimer.setInterval(40);
}
RotatingClockWidget::~RotatingClockWidget()
{
}
void RotatingClockWidget::paintEvent(QPaintEvent *event)
{
QPainter painter(this);
painter.setRenderHint(QPainter::Antialiasing,true);
const auto rect = event->rect();
auto width = rect.width();
auto height = rect.height();
auto sideLength = std::min(width,height) - 20;
auto halfSideLength = sideLength/2;
auto separaDistance = halfSideLength / 6.8;
auto centerPoint = rect.center();
QRect drawZoneRect = QRect(-halfSideLength,-halfSideLength,sideLength,sideLength);
drawZoneRect.translate(rect.center());
painter.setPen(QPen(Qt::white,4,Qt::SolidLine,Qt::RoundCap));
painter.drawLine(QPoint(centerPoint.x(),centerPoint.y() - separaDistance * 0.2),
QPoint(centerPoint.x() + separaDistance * 0.2,centerPoint.y()));
painter.drawLine(QPoint(centerPoint.x() + separaDistance * 0.2,centerPoint.y()),
QPoint(centerPoint.x(),centerPoint.y() + separaDistance * 0.2));
QColor color(218,165,32);
painter.setPen(QPen(color,5));
painter.drawEllipse(centerPoint,static_cast<int>(separaDistance * 0.8),static_cast<int>(separaDistance * 0.8));
painter.drawEllipse(centerPoint,static_cast<int>(separaDistance * 2.8),static_cast<int>(separaDistance * 2.8));
painter.drawEllipse(centerPoint,static_cast<int>(separaDistance * 4.8),static_cast<int>(separaDistance * 4.8));
painter.drawEllipse(centerPoint,static_cast<int>(separaDistance * 6.8),static_cast<int>(separaDistance * 6.8));
color.setAlpha(100);
painter.setPen(QPen(color,3));
painter.drawEllipse(centerPoint,static_cast<int>(separaDistance * 1.8),static_cast<int>(separaDistance * 1.8));
painter.drawEllipse(centerPoint,static_cast<int>(separaDistance * 3.8),static_cast<int>(separaDistance * 3.8));
painter.drawEllipse(centerPoint,static_cast<int>(separaDistance * 5.8),static_cast<int>(separaDistance * 5.8));
color.setAlpha(255);
painter.setPen(QPen(color));
auto font = this->font();
font.setPixelSize(separaDistance * 0.66);
font.setBold(true);
painter.setFont(font);
painter.translate(centerPoint);
for (int i = 0;i <= 2;++i)
{
painter.save();
QRect textRect(separaDistance * 0.8,
-separaDistance * 0.8,
separaDistance,
separaDistance * 1.6);
if(Q_UNLIKELY(hour_TenPlace_rotatingValue > 0))
{
auto temp = hour_TenPlace - 1;
if(temp > 2)
temp = 0;
if(temp < 0)
temp = 2;
painter.rotate(120 * (i - temp) - hour_TenPlace_rotatingValue);
}
else
{
painter.rotate(120 * (i - hour_TenPlace));
}
if(hour_TenPlace == i)
{
painter.setPen(Qt::white);
}
painter.drawText(textRect,Qt::AlignCenter,QString::number(i));
painter.restore();
}
for (int i = 0;i <= 9;++i)
{
painter.save();
QRect textRect(separaDistance * 1.8,
-separaDistance * 0.8,
separaDistance,
separaDistance * 1.6);
if(Q_UNLIKELY(hour_OnePlace_rotatingValue > 0))
{
auto temp = hour_OnePlace - 1;
if(temp > 9)
temp = 0;
if(temp < 0)
temp = 9;
painter.rotate(36 * (i - temp) - hour_OnePlace_rotatingValue);
}
else
{
painter.rotate(36 * (i - hour_OnePlace));
}
if(hour_OnePlace == i)
{
painter.setPen(Qt::white);
}
painter.drawText(textRect,Qt::AlignCenter,QString::number(i));
painter.restore();
}
for (int i = 0;i <= 5;++i)
{
painter.save();
QRect textRect(separaDistance * 2.8,
-separaDistance * 0.8,
separaDistance,
separaDistance * 1.6);
if(Q_UNLIKELY(minute_TenPlace_rotatingValue > 0))
{
auto temp = minute_TenPlace - 1;
if(temp > 5)
temp = 0;
if(temp < 0)
temp = 5;
painter.rotate(60 * (i - temp) - minute_TenPlace_rotatingValue);
}
else
{
painter.rotate(60 * (i - minute_TenPlace));
}
if(minute_TenPlace == i)
{
painter.setPen(Qt::white);
}
painter.drawText(textRect,Qt::AlignCenter,QString::number(i));
painter.restore();
}
for (int i = 0;i <= 9;++i)
{
painter.save();
QRect textRect(separaDistance * 3.8,
-separaDistance * 0.8,
separaDistance,
separaDistance * 1.6);
if(Q_UNLIKELY(minute_OnePlace_rotatingValue > 0))
{
auto temp = minute_OnePlace - 1;
if(temp > 9)
temp = 0;
if(temp < 0)
temp = 9;
painter.rotate(36 * (i - temp) - minute_OnePlace_rotatingValue);
}
else
{
painter.rotate(36 * (i - minute_OnePlace));
}
if(minute_OnePlace == i)
{
painter.setPen(Qt::white);
}
painter.drawText(textRect,Qt::AlignCenter,QString::number(i));
painter.restore();
}
for (int i = 0;i <= 5;++i)
{
painter.save();
QRect textRect(separaDistance * 4.8,
-separaDistance * 0.8,
separaDistance,
separaDistance * 1.6);
if(second_TenPlace_rotatingValue > 0)
{
auto temp = second_TenPlace - 1;
if(temp > 5)
temp = 0;
if(temp < 0)
temp = 5;
painter.rotate(60 * (i - temp) - second_TenPlace_rotatingValue);
}
else
{
painter.rotate(60 * (i - second_TenPlace));
}
if(second_TenPlace == i)
{
painter.setPen(Qt::white);
}
painter.drawText(textRect,Qt::AlignCenter,QString::number(i));
painter.restore();
}
auto temp = second_OnePlace - 1;
if(temp > 9)
temp = 0;
if(temp < 0)
temp = 9;
for (int i = 0;i <= 9;++i)
{
painter.save();
QRect textRect(separaDistance * 5.8,
-separaDistance * 0.8,
separaDistance,
separaDistance * 1.6);
if(second_OnePlace_rotatingValue > 0)
{
painter.rotate(36 * (i - temp) - second_OnePlace_rotatingValue);
}
else
{
painter.rotate(36 * (i - second_OnePlace));
}
if(second_OnePlace == i)
{
painter.setPen(Qt::white);
}
painter.drawText(textRect,Qt::AlignCenter,QString::number(i));
painter.restore();
}
}
void RotatingClockWidget::onSecondTimer()
{
auto nowTime = QTime::currentTime();
int second = nowTime.second();
int minute = nowTime.minute();
int hour = nowTime.hour();
second_OnePlace = second % 10;//个位
if(second_TenPlace != second / 10 % 10)//十位
{
second_TenPlace = second / 10 % 10;
second_TenPlace_rotatingValue = 0;
}
if(minute_OnePlace != minute % 10)
{
minute_OnePlace = minute % 10;
minute_OnePlace_rotatingValue = 0;
}
if(minute_TenPlace != minute / 10 % 10)
{
minute_TenPlace = minute / 10 % 10;
minute_TenPlace_rotatingValue = 0;
}
if(hour_OnePlace != hour % 10)
{
hour_OnePlace = hour % 10;
hour_OnePlace_rotatingValue = 0;
}
if(hour_TenPlace != hour / 10 % 10)
{
hour_TenPlace = hour / 10 % 10;
hour_TenPlace_rotatingValue = 0;
}
animationTimer.start();
}
void processValue(int & value,int max)
{
if(value >= 0)
{
if(value >= max)
{
value = -1;
}
else
{
value += (max / 12);
}
}
}
void RotatingClockWidget::onAnimationTimer()
{
second_OnePlace_rotatingValue += 3;
if(second_OnePlace_rotatingValue >= 36)
{
second_OnePlace_rotatingValue = 0;
animationTimer.stop();
}
processValue(second_TenPlace_rotatingValue,60);
processValue(minute_OnePlace_rotatingValue,36);
processValue(minute_TenPlace_rotatingValue,60);
processValue(hour_OnePlace_rotatingValue,36);
processValue(hour_TenPlace_rotatingValue,120);
update();
}
UI参考:CSS3创意个性数字时钟动画特效