Qt 是目前最先進、最完整的跨平臺C++開發工具。它不僅完全實現了一次編寫，所有平臺無差別運行，更提供了幾乎所有開發過程中需要用到的工具。如今，Qt已被運用于超過70個行業、數千家企業，支持數百萬設備及應用。

Qt技術交流群：166830288      歡迎一起進群討論

模擬時鐘示例展示了如何繪制自定義小部件的內容，這個示例還演示了如何使用QPainter的轉換和縮放特性來更輕松地繪制自定義小部件。

AnalogClock類定義

AnalogClock類提供了一個帶有時針和分針的時鐘小部件，每隔幾秒鐘自動更新一次，我們繼承了QWidget并重新實現了標準的paintEvent()函數來繪制鐘面：

class AnalogClock : public QWidget
{
Q_OBJECT

public:
AnalogClock(QWidget *parent = nullptr);

protected:
void paintEvent(QPaintEvent *event) override;
};

AnalogClock類實現

AnalogClock::AnalogClock(QWidget *parent)
: QWidget(parent)
{
QTimer *timer = new QTimer(this);
connect(timer, &QTimer::timeout, this, QOverload<>::of(&AnalogClock::update));
timer->start(1000);

setWindowTitle(tr("Analog Clock"));
resize(200, 200);
}

在構造小部件時，我們設置一個1秒計時器來跟蹤當前時間，并將其連接到標準update()插槽，以便在計時器發出timeout()信號時更新時鐘面。

最后我們調整小部件的大小，使其顯示在一個合理的大小。

void AnalogClock::paintEvent(QPaintEvent *)
{
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)
};

QColor hourColor(127, 0, 127);
QColor minuteColor(0, 127, 127, 191);

int side = qMin(width(), height());

每當需要更新小部件的內容時，就調用paintEvent()函數。這在小部件首次顯示時發生，在它被覆蓋然后暴露時發生，但在小部件的update()槽被調用時也會執行。由于我們將計時器的timeout()信號連接到這個槽，因此它將至少每五秒被調用一次。

在我們設置painter和繪制時鐘之前，首先定義兩個QPoints和兩個QColors列表，它們將用于時針和分針。分針的顏色alpha值為191，這意味著它75%是不透明的。

我們還確定了小部件最短邊的長度，以便可以將鐘面放入小部件中，在開始繪圖之前確定當前時間也很有用。

QPainter painter(this);
painter.setRenderHint(QPainter::Antialiasing);
painter.translate(width() / 2, height() / 2);
painter.scale(side / 200.0, side / 200.0);

自定義小部件的內容是用QPainter繪制的，Painters可以用來在任何QPaintDevice上繪畫，但它們通常與小部件一起使用，因此我們將小部件實例傳遞給painter的構造函數。

我們用QPainter::Antialiasing調用QPainter::setRenderHint()來打開反鋸齒，這使得繪制對角線更加平滑。

平移將原點移動到小部件的中心，縮放操作確保以下繪圖操作被縮放來適應小部件。我們使用一個比例因子，讓使用-100到100之間的x和y坐標，這確保了它們位于小部件最短邊的長度范圍內。

為了使代碼更簡單，我們將繪制一個固定大小的鐘面，并對其進行定位和縮放，使其位于小部件的中心。

painter負責在繪制事件期間進行的所有轉換，并確保所有內容都被正確繪制，讓繪圖器處理轉換通常比僅僅為了繪制自定義小部件的內容而執行手動計算更容易。

我們先畫時針，使用一個公式，將坐標系逆時針旋轉數度，由當前的小時和分鐘決定，這意味著手將顯示順時針旋轉所需的量。

painter.setPen(Qt::NoPen);
painter.setBrush(hourColor);

我們將pen設置為Qt::NoPen，因為不想要任何輪廓，并且使用適合顯示小時數的顏色固體畫筆，筆刷在填充多邊形和其他幾何形狀時使用。

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);
}

我們在時鐘的邊緣畫上標記，代表每小時。繪制每個標記，然后旋轉坐標系統，以便painter準備好下一個。

painter.setPen(Qt::NoPen);
painter.setBrush(minuteColor);

painter.save();
painter.rotate(6.0 * (time.minute() + time.second() / 60.0));
painter.drawConvexPolygon(minuteHand, 3);
painter.restore();

分針的旋轉方式與時針相似。

painter.setPen(minuteColor);

for (int j = 0; j < 60; ++j) {
if ((j % 5) != 0)
painter.drawLine(92, 0, 96, 0);
painter.rotate(6.0);
}
}

同樣我們在時鐘的邊緣畫上標記，但這次是用來表示分鐘。跳過5的倍數，以避免在小時標記上畫分鐘標記。

Qt Widget組件推薦

• QtitanRibbon - Ribbon UI組件：是一款遵循Microsoft Ribbon UI Paradigm for Qt技術的Ribbon UI組件，QtitanRibbon致力于為Windows、Linux和Mac OS X提供功能完整的Ribbon組件。
• QtitanChart - Qt類圖表組件：是一個C ++庫，代表一組控件，這些控件使您可以快速地為應用程序提供漂亮而豐富的圖表。
• QtitanDataGrid - Qt網格組件：提供了一套完整的標準 QTableView 函數和傳統組件無法實現的獨特功能。使您能夠將不同來源的各類數據加載到一個快速、靈活且功能強大的可編輯網格中，支持排序、分組、報告、創建帶狀列、拖放按鈕和許多其他方便的功能。
• QtitanDocking：允許您像 Visual Studio 一樣為您的偉大應用程序配備可停靠面板和可停靠工具欄。黑色、白色、藍色調色板完全支持 Visual Studio 2019 主題！