
由于我的希望是盡可能的複原儀表的動态,如果晚上找資源的話,那可定是會有很大的誤差,是以我決定自己手動用PS描一個出來,這裡就遇到一個極大的問題,網上資料中,所有GE儀表盤的圖檔有一堆一堆的,主要還是不一樣,這個可能會根據車型不同而分類吧,我選了其中一個來模仿,通過看視訊,看到,吉利GE這套車機的UI應該是花了大價錢的,不是友商可以比的,也許是我的技術不夠,我一個儀表的指針就耗費大約一天的時間來模仿。最後還是達不到那種想要的效果,這一刻好像要一個美工呀
好歹辛苦兩天總算有點結果。在給儀表填數的時候,我發現我根本就找不到能與這套UI中的數字配置的字型,經過詢問大神,才得知吉利的英文字型都是定制的,中文自己采用蘭亭細黑,由于沒有字型,智能找相應的代替了,這裡用到了“Square721 BT”這個字型來代替。
轉數表和速度表目前的實作來看下效果(圖檔尺寸大,點開放大了,CSDN的壓縮有損我顔值)
目前這個呢,隻是一個咱試試的展示,盡然計劃所三種模式,那就需要重新設計一下。目前這個儀表還隻隻有一個主界面,不過可以做一下基礎工作了,
比如,得讓我們的儀表可以移動呀,不然我的一個螢幕放不下。下面放上基礎代碼。是以這片就又要水一下了,哈哈哈
/*
* 滑鼠按下事件
*/
void mousePressEvent(QMouseEvent *event);
/*
* 滑鼠移動事件
*/
void mouseMoveEvent(QMouseEvent *event);
/*
* 滑鼠松開事件
*/
void mouseReleaseEvent(QMouseEvent *event);
/*
* 鍵盤事件
*/
void keyReleaseEvent(QKeyEvent *event);
/*
* 滑鼠按下事件
*/
void MeterDisplay::mousePressEvent(QMouseEvent *event)
{
point = event->globalPos();
}
/*
* 滑鼠移動事件
*/
void MeterDisplay::mouseMoveEvent(QMouseEvent *event)
{
int dx = event->globalX() - point.x();
int dy = event->globalY() - point.y();
point = event->globalPos();
this->move(this->x()+dx,this->y()+dy);
}
/*
* 滑鼠松開事件
*/
void MeterDisplay::mouseReleaseEvent(QMouseEvent *event)
{
int dx = event->globalX() - point.x();
int dy = event->globalY() - point.y();
this->move(this->x()+dx,this->y()+dy);
}
/*
* 鍵盤松開事件
* ESC鍵和Q鍵關閉控制台程式
*/
void MeterDisplay::keyReleaseEvent(QKeyEvent *event)
{
if(event->key() == Qt::Key_Escape || event->key() == Qt::Key_Q)
{
this->close();
}
}
剩下的就是這個兩個表了
這裡我們用到了Qt 繪制函數,這裡我将在Qlabe上繪制我們的指針。使用Qt自己在Qlabel上繪制圖形大緻流程如下
第二部,編寫事件過濾器,這裡聲明我就不寫了,直接寫代碼實作部分,注意傳回值是bool。
/*
* 事件過濾器
*/
bool MeterDisplay::eventFilter(QObject *watched, QEvent *event)
{
if(watched == ui->label_rotateSpeed && event->type() == QEvent::Paint)
{
draw_RotatetSpeed(m_RotateSpeed);
}
if(watched == ui->label_carSpeed && event->type() == QEvent::Paint)
{
draw_CarSpeed(m_CarSpeed);
}
return QWidget::eventFilter(watched,event);
}
第三部,實作我的繪制函數,這裡有兩個,就是事件過濾器中的那兩個函數 ,同樣,聲明我就不寫了,直接寫實作代碼
/*
* 繪制車速
*/
void MeterDisplay::draw_CarSpeed(int carSpeed)
{
QPainter painter(ui->label_carSpeed);
painter.setRenderHint((QPainter::SmoothPixmapTransform));
painter.setRenderHint(QPainter::HighQualityAntialiasing);
painter.translate(310,310);
painter.save();
painter.rotate(-132+22*carSpeed/20);
painter.drawPixmap(-281,-310,562,620,QPixmap(":/MeterDisplay/Resources/Images/MeterDisplay/pointer.png"));
painter.restore();
ui->label_carSpeedNumber->setText(QString::number(carSpeed,10));
}
以上兩個函數其實實作方式是一模一樣的,就是作用的對象不同,和旋轉角度的算法不一樣而已。好了,今天又水一篇