【正文】 painterrestore()。}最后，電壓模塊的界面繪制到了最后一步，繪制刻度顯示和中心位置的數(shù)值顯示部分。由于篇幅問題，只給出部分代碼。用來繪制儀表中部數(shù)據(jù)顯示部分的部分代碼。paintersetOpacity()。 QPointF topLeftPot(()rectWidth,()rectWidth)。 QPointF bottomRightPot(()+rectWidth,()+rectWidth)。 QRectF textRect(topLeftPot,bottomRightPot)。 paintersetPen(Qt::NoPen)。 paintersetBrush(Qt::cyan)。 painterdrawRoundRect(textRect,rectWidth*2,rectWidth*2)。 paintersetOpacity()。 paintersetPen(Qt::black)。 qreal fontSize=rectWidth*。 QFont font。 (fontSize)。 paintersetFont(font)。38 painterdrawText(textRect,Qt::AlignVCenter|Qt::AlignHCenter,tr(%1V).arg(m_value))。 painterrestore()。}刻度繪制相關(guān)代碼。 for(int i=0。i=100。i++) { paintersave()。 painterrotate(startAngle)。 if(i%10==0) { paintersetPen(QColor(16,49,98))。 QPointF bottomPot(0,m_colorPieRadius+m_space)。 QPointF topPot(0,m_colorPieRadius+m_space+m_longHand)。 painterdrawLine(bottomPot,topPot)。 strValue=tr(%1).arg(value)。 qreal textWidth=fontMetrics().width(strValue)。 qreal textHeight=fontMetrics().height()。 QPointF textPot(textWidth/2,m_colorPieRadius+2*m_space+m_longHand+textHeight)。 paintersave()。 paintertranslate(textPot)。 painterrotate(180)。 painterdrawText(QPointF(textWidth,textHeight/2),strValue)。 painterrestore()。 value+=10。39 }與動態(tài)繪制有關(guān)的代碼。updateTimer=new QTimer(this)。updateTimersetInterval(10)。connect(updateTimer,SIGNAL(timeout()),this,SLOT(UpdateGraph()))。void myGauge1::UpdateGraph(){ if(m_bReverse) { m_currentValue=。 if(m_currentValue=m_value) { updateTimerstop()。 } } else { m_currentValue+=。 if(m_currentValue=m_value) { updateTimerstop()。 } } update()。}40 電流模塊電流模塊的界面與電壓模塊類似，不同點在于儀表上的數(shù)值顯示由進(jìn)度條更改為內(nèi)嵌式藍(lán)色指針。首先繪制出界面內(nèi)的所有內(nèi)容，之后，繪制一個另一個扇形Graph，用來掩蓋拱形進(jìn)度條，使用 connect()函數(shù)來進(jìn)行持續(xù)監(jiān)聽，檢測數(shù)據(jù)值的變化，采用 QTimer 類的 setInterval()的方法，每 10 毫秒發(fā)出一次超時信號，對數(shù)值進(jìn)行檢測，如果數(shù)值發(fā)生變化，則將 Graph 進(jìn)行重繪，每次大小改變角度微小，更新時間間隔短暫，從而實現(xiàn)動態(tài)效果。指針部分的代碼如下：void myGauge5::drawIndicator(QPainter* painter){ paintersave()。 paintersetPen(QPen(Qt::blue,2))。 paintertranslate(m_center)。 qreal increment=(qreal)180/100。 qreal endAngle=90+m_currentValue*increment。 painterrotate(endAngle)。 painterdrawLine(QPointF(0,0),QPointF(0,m_colorPieRadius+m_longHand))。 painterrestore()。}41圖 電流顯示界面由于電流模塊與電壓模塊其他部分基本相同，代碼和解釋說明不再給出。 波形模塊波形模塊可以用來顯示下位機儀表輸出的連續(xù)波形，或者其他類似的狀態(tài)模式。在波形模塊的設(shè)計中，模塊界面是用 QWidget 類來實現(xiàn) UI 框架，將 void QWidget::paintEvent(QPaintEvent * event) 虛保護(hù)函數(shù)進(jìn)行重構(gòu)來實現(xiàn) UI 內(nèi)容的繪制，使用 Vector 容器來存放數(shù)據(jù)，通過調(diào)用 void QWidget::update () 函數(shù)，來實現(xiàn)動態(tài)顯示。通過查閱 QT 的幫助文檔可以得知，void QWidget::update () 函數(shù)會在主界面給出信號后，對界面進(jìn)行重繪，雖然 repaint()函數(shù)也能夠?qū)崿F(xiàn)重繪的功能，但是update()函數(shù)的效率更高，更穩(wěn)定。42圖 波形界面對于界面的繪制，首先進(jìn)行背景的繪制，然后繪制坐標(biāo)系，之后進(jìn)行左邊刻度的繪制，繪制波形內(nèi)容，最后繪制標(biāo)題。對于波形內(nèi)容的繪制為此模塊繪制的重點。QLinerGrandient 類實現(xiàn)線性漸變的填充，然后使用 drawConvexPolygon 函數(shù)來繪制以多組數(shù)據(jù)構(gòu)成的多邊形。代碼的實現(xiàn)如下：QLinearGradient graphGradient((),())。 (,QColor(240,67,51))。 (,QColor(208,94,49))。 (,QColor(85,255,0))。43 paintersetBrush(graphGradient)。 paintersetPen(Qt::NoPen)。 painterdrawConvexPolygon(QPolygonF(potVec))。之后進(jìn)行數(shù)據(jù)點的繪制，使用 QRadialGradient 類來進(jìn)行輻射漸變填充，使用drawEllipse 函數(shù)來繪制數(shù)據(jù)點。具體的代碼實現(xiàn)如下：// draw points if(m_bShowPoint){ paintersetOpacity()。 for(int i=1。i()1。i++){ QPointF dataPot=(i)。 QRadialGradient potGradient(dataPot,POINT_RADIUS,dataPot)。 (,QColor(180,180,180))。 (,QColor(143,123,23))。 (,QColor(180,180,180))。 paintersetBrush(potGradient)。 painterdrawEllipse(dataPot,POINT_RADIUS,POINT_RADIUS)。 } }動態(tài)界面的實現(xiàn)過程：首先創(chuàng)建公共函數(shù) void myChart1::addData(qreal data)，用來添加在波形界面內(nèi)顯示的數(shù)據(jù)，并且提供一個接口給主窗體。在 QTabWidget 界面內(nèi)，當(dāng)與波形相關(guān)聯(lián)的按鈕按下時，會顯示波形界面，同時啟動一個定時器QTimer，定時器設(shè)置每 300ms 發(fā)出超時信號，此時，對應(yīng)的信號槽會產(chǎn)生一個隨機數(shù)據(jù)使用 void myChart1::addData(qreal data)添加到 vector 中，而 void myChart1::addData(qreal data)會調(diào)用 updateVector()函數(shù)，刪除之前的一個數(shù)據(jù)，并調(diào)用 update()函數(shù)， update()函數(shù)會對窗體內(nèi)容進(jìn)行重繪。函數(shù)的具體代碼如下：44void myChart1::addData(qreal data){ (data)。 updateVector()。}void myChart1::updateVector(){ int allowDataCount=()/X_INCREMENT。 if(()allowDataCount) { (allowDataCount,1)。 } update()。}void frmMain::on_btnChart1_clicked(){ thisChangeVisibleTab2(false)。 mychart1setVisible(true)。 updateTimer21start()。}updateTimer21=new QTimer(this)。updateTimer21setInterval(300)。 connect(updateTimer21,SIGNAL(timeout()),this,SLOT(UpdateData21()))。void frmMain::UpdateData21(){45 int value=qrand()%100。 mychart1addData(value)。 uilabValue2setText(tr(當(dāng)前值:%1).arg(value))。} 速度模塊速度模塊界面和之前的電壓模塊設(shè)計思路是相同的。不同點在于速度模塊的界面設(shè)計指示方式采用了指針的方式，與大多數(shù)汽車速度儀表顯示界面類似，使用顏色來標(biāo)注此時速度情況，0 到 67 為綠色，67 到 83 為黃色，83 到 100 為紅色，中部繪制一個凸起的圓，繪制一個指示數(shù)值的指針與圓相連，圓的下部為數(shù)字顯示。圖 速度顯示界面界面具體的指針繪制和凸起圓的繪制代碼如下：void myGauge2::drawIndicator(QPainter *painter){//指針繪制代碼 paintersave()。46 paintertranslate(m_center)。 qreal increment=(qreal)270/100。 qreal changedAngle=45+increment*m_currentValue。 painterrotate(changedAngle)。 QPointF topPot(0,m_colorCircleRadius+LONG1)。 QPointF bottomLeftPot(m_coverBallRadius/3,0)。 QPointF bottomRightPot(m_coverBallRadius/3,0)。 paintersetPen(Qt::NoPen)。 QLinearGradient indicatorGradient(topPot,bottomLeftPot)。 (,QColor(236,187,62))。 (,QColor(220,147,0))。 (,QColor(236,187,62))。 paintersetBrush(indicatorGradient)。 QVectorQPointF potVec。 (topPot)。 (bottomLeftPot)。 (bottomRightPot)。 painterdrawPolygon(potVec)。 painterresto