Qt自绘系列-透明时钟
Qt 系列 时钟 透明 自绘
2023-06-13 09:17:29 时间
❝使用QPainter画透明时钟,还可拖动。❞
一、演示
二、实现
- 画背景图,一个白色圆环,60个圆点和12个数字组成。
QPixmap pixmap = QPixmap(width, height);
pixmap.fill(Qt::transparent);
QPainter painter(&pixmap);
painter.setRenderHint(QPainter::Antialiasing, true);
painter.setRenderHints(QPainter::SmoothPixmapTransform, true);
painter.setPen(QPen(Qt::white, width * 0.035));
/* 改变绘图坐标点。 */
painter.translate(width / 2, height/2);
/* 画白色圆环 */
painter.drawEllipse(-(width - painter.pen().width()) / 2,
-(height -painter.pen().width())/ 2,
height - painter.pen().width(),
height - painter.pen().width());
int circleRadius = width * 0.025;
painter.rotate(-90);
/* 绘制60个圆点 */
for (int i = 0; i < 60; i++) {
QColor color("#90d5d5d5");
if (i % 5 == 0) {
color = Qt::black;
/* 画数字 */
painter.drawPixmap(width*0.55/2, -25, createOneNumberPixmap(i == 0 ? 12 : i/5, 50, -i*6 + 90));
}
painter.rotate(6);
}
- 画中心白色小圆点。
QPixmap pixmap = QPixmap(radius, radius);
pixmap.fill(Qt::transparent);
QPainter painter(&pixmap);
painter.setRenderHint(QPainter::Antialiasing, true);
if (isBorder)
painter.setPen(QPen(QColor("#333333"), 1));
else
painter.setPen(Qt::NoPen);
painter.setBrush(QBrush(color));
painter.drawEllipse(0, 0, radius, radius);
- 画小时指针线和分钟指针线(它们相同实现)。
QPixmap pixmap = QPixmap(width, height);
pixmap.fill(Qt::transparent);
QPainter painter(&pixmap);
painter.setRenderHint(QPainter::Antialiasing, true);
painter.setPen(Qt::NoPen);
painter.setBrush(QBrush(color));
/* 画头部圆 */
painter.drawEllipse(0, 0, height, height);
/* 画矩形 */
painter.drawRect(height/2, 0, width - height, height);
/* 画尾部圆 */
painter.drawEllipse(width - height, 0, height, height);
- 画秒钟指针线,它是一个梯形状。
QPixmap pixmap = QPixmap(width, height);
pixmap.fill(Qt::transparent);
QPainter painter(&pixmap);
painter.setRenderHint(QPainter::Antialiasing, true);
painter.setPen(Qt::NoPen);
painter.setBrush(QBrush(color));
const QPointF points[4] = {
QPointF(0, height),
QPointF(0, 0),
QPointF(width, height * 0.25),
QPointF(width, height * 0.75)
};
/* 画梯形,从左下角顺时针绘制。 */
painter.drawPolygon(points, 4);
- 每隔一秒定时更新时钟。
m_timerId = this->startTimer(1000, Qt::PreciseTimer);
this->updateTime();
void ClockView::updateTime()
{
QTime currentTime = QDateTime::currentDateTime().time();
m_hourAngle = -90 + 30 * currentTime.hour() + 30 * currentTime.minute()/60;
m_minuteAngle = -90 + 6 * currentTime.minute();
m_secondAngle = -90 + 6 * currentTime.second();
update();
}
三、透明窗口与拖动
在桌面状态下运行效果:
- 画透明窗口背景实现。
setWindowFlags(Qt::FramelessWindowHint |
Qt::X11BypassWindowManagerHint);
setAttribute(Qt::WA_TranslucentBackground);
- 通过处理鼠标按下事件处理实现窗口拖动。
QPoint m_startPoint;
void ClockView::mousePressEvent(QMouseEvent *event)
{
if (event->button() == Qt::LeftButton) {
/* 记录鼠标左键按下的初始状态。 */
m_startPoint = frameGeometry().topLeft() - event->globalPos();
}
}
void ClockView::mouseMoveEvent(QMouseEvent *event)
{
/* 移动窗口 */
this->move(event->globalPos() + m_startPoint);
}
四. 获取更多
相关文章
- python qt是什么_初识Python与Qt「建议收藏」
- 编译QCAD_qt 编译
- 一文入门Qt Quick
- Qt QTreeWidget 详解
- C/C++ Qt QThread 线程组件应用
- C/C++ Qt 标准Dialog对话框组件应用
- Qt自绘系列-加载等待控件
- 如何在Linux系统中安装Qt开发环境(linux下qt安装教程)
- 使用Qt框架轻松连接MySQL数据库(qt与mysql连接)
- Linux安装Qt:轻松搞定(linux如何安装qt)
- 基于Linux的Qt程序开发实践(linux与qt程序设计)
- Linux下编译Qt程序的技术指南(linux编译qt程序)
- Linux下安装QT输入法指南(linuxqt输入法)
- 在Linux上体验Qt的魅力(linux下运行qt)
- 快速开发:利用 Linux Qt 库(linuxqt库文件)
- 开发linux下 Qt 图形界面开发实践(linux下qt图形界面)
- 「零基础入门」Linux下安装QT教程,助力程序员成为高手!(linux下安装qt教程)
- Qt for Linux:下载与安装指南(qt下载linux)
- linux系统启动Qt图形界面简易指南(linux启动qt)
- Qt在Linux平台的优越性(qtlinux类)
- 在Linux下探索Qt程序的奥秘(linux下运行qt程序)
- 快速搭建Qt环境中的MySQL数据库(qt配置mysql数据库)
- 利用Qt轻松操作Oracle数据库(qt操作oracle)
- 探寻在Linux环境中优秀字体的秘密——QT字体详解(qtlinux字体)
- 使用Qt快速搭建MySQL数据库连接(qtmysql连接)
- 「Linux Qt SDK开发新时代:简单快速轻松上手」(linux qt sdk)