目录
1.简介
本文主要介绍了如何在控件中自定义绘制图形,重点内容包含
- 如何绘制秒针;
- 如何绘制数字。
本文还有动态效果图、重点讲解和源码,读者们可以方便查看学习和交流。
回目录
2.效果图
3.重点讲解
1)如何绘制秒针
通过递归地方式依次遍历控件布局中包含的所有子布局、子控件的方式来获取指定控件及其子控件的对象信息(对象名称、对象类型名称)。
“秒针”指针的绘制坐标点
static const QPoint secondHand[3] = {
QPoint(7, 8),
QPoint(-7, 8),
QPoint(0, -80)
};
绘制秒针:
p->rotate(6.0 * time.second());
p->drawConvexPolygon(secondHand, 3);
以下是“秒针”指针的截图信息:
“秒针”指针
2)如何绘制数字
先定义绘制字体大小,循环依次通过 QPainter::drawText 绘制刻度上的字体:
QFont font = p->font();
font.setPixelSize(10);
p->setFont(font);
for (int i = 0; i < 12; ++i) {
p->drawLine(88, 0, 96, 0);
p->rotate(30.0);
int nNum = i + 4;
if( nNum > 12 ){
nNum -= 12;
}
p->drawText(75, 0, QString::number(nNum));
}
4.源码
源码下载地址
https://download.csdn.net/download/Redboy_Crazy/12904634
注:本文参考Qt Demo程序修改。
main.cpp
#include <QtGui>
#include "rasterwindow.h"
//! [5]
class AnalogClockWindow : public RasterWindow
{
public:
AnalogClockWindow();
protected:
void timerEvent(QTimerEvent *) override;
void render(QPainter *p) override;
private:
int m_timerId;
};
//! [5]
//! [6]
AnalogClockWindow::AnalogClockWindow()
{
setTitle("Analog Clock");
resize(200, 200);
m_timerId = startTimer(1000);
}
//! [6]
//! [7]
void AnalogClockWindow::timerEvent(QTimerEvent *event)
{
if (event->timerId() == m_timerId)
renderLater();
}
//! [7]
//! [1] //! [14]
void AnalogClockWindow::render(QPainter *p)
{
//! [14]
//! [8]
static const QPoint hourHand[3] = {
QPoint(7, 8),
QPoint(-7, 8),
QPoint(0, -40)
};
static const QPoint minuteHand[3] = {
QPoint(7, 8),
QPoint(-7, 8),
QPoint(0, -70)
};
static const QPoint secondHand[3] = {
QPoint(7, 8),
QPoint(-7, 8),
QPoint(0, -80)
};
QColor hourColor(127, 0, 127);
QColor minuteColor(0, 127, 127, 191);
// QColor secondColor(0, 255, 255, 0);
QColor secondColor(Qt::red);
//! [8]
//! [9]
p->setRenderHint(QPainter::Antialiasing);
//! [9] //! [10]
p->translate(width() / 2, height() / 2);
int side = qMin(width(), height());
p->scale(side / 200.0, side / 200.0);
//! [1] //! [10]
//! [11]
p->setPen(Qt::NoPen);
p->setBrush(hourColor);
//! [11]
//! [2]
QTime time = QTime::currentTime();
p->save();
qreal nReal = 30.0 * ((time.hour() + time.minute() / 60.0));
p->rotate(nReal);
p->drawConvexPolygon(hourHand, 3); // 绘制
p->restore();
//! [2]
//! [12] // 绘制 时针 刻度
p->setPen(hourColor);
QFont font = p->font();
font.setPixelSize(10);
p->setFont(font);
// p->rotate(-nReal);
qDebug() << "nReal" << nReal;
for (int i = 0; i < 12; ++i) {
p->drawLine(88, 0, 96, 0);
p->rotate(30.0);
int nNum = i + 4;
if( nNum > 12 ){
nNum -= 12;
}
p->drawText(75, 0, QString::number(nNum));
}
// const QRect rectangle = QRect(75, 88, 10, 10);
// p->drawText(rectangle, Qt::AlignCenter, QString::number(12));
//! [12] //! [13]
p->setPen(Qt::NoPen);
p->setBrush(minuteColor);
//! [13]
//! [3]
p->save();
p->rotate(6.0 * (time.minute() + time.second() / 60.0));
p->drawConvexPolygon(minuteHand, 3);
p->restore();
//! [3]
//! [4] // 绘制 分/秒针 刻度
p->setPen(minuteColor);
p->setFont(QFont("Arial", 30));
for (int j = 0; j < 60; ++j) {
if ((j % 5) != 0){
p->drawLine(92, 0, 96, 0);
}else{
// p->drawText(rect(), Qt::AlignCenter, "Qt");
// p->drawText(85, 0, QString::number(j/5));
}
p->rotate(6.0);
}
p->setPen(Qt::NoPen);
p->setBrush(secondColor);
//! [3]
p->save();
p->rotate(6.0 * time.second());
p->drawConvexPolygon(secondHand, 3);
p->restore();
//! [3]
//! [4]
p->setPen(secondColor);
//! [4]
}
int main(int argc, char **argv)
{
QGuiApplication app(argc, argv);
AnalogClockWindow clock;
clock.show();
return app.exec();
}
加油,向未来!GO~
Come on!