基于Qt的汽車儀表模擬

?

先看下目前的運行效果，這篇主要說一下轉向燈、速度表和背景透明的實現。

?

HUD在車上的使用場景就是投影在汽車前風擋玻璃上面，所以背景一定要做成空的。但是作為顯示器，我先應該是黑色吧，這里我就模擬了我們眼睛看到的畫面，至于顯示設備上面的，應該是黑色，或者根據每個玻璃上的參數不同調整下背景顏色，影響不大。代碼就兩行，這里我做了隱藏標題處理，所以就是三行了，如下

this->setWindowFlag(Qt::FramelessWindowHint); //隱藏標題欄this->setWindowOpacity(1);this->setAttribute(Qt::WA_TranslucentBackground);

轉向燈，屬于汽車燈光組成的一部分，主要就是告訴別人我要怎么走，左拐還是右拐或者我車怎么滴了，不能走了，警示后車即雙閃。大致流程如下圖所示。

?

這個圖看著有點復雜，其實代碼是不怎么復雜的。

說先定義三個變量，用來表示左轉、右轉和警告即雙閃。

#define TURN_LEFT 1 //左轉向燈 #define TURN_RIGHT 2 //右轉向燈 #define WARNING 3 //雙閃

其實這個不是必要的，只是為了后面使用方便。

初始化我們的定時器并吧要干活的分配給它

timer_TurnLeftLight = new QTimer;connect(timer_TurnLeftLight,&QTimer::timeout,this,[=](){if(ui->label_turnLight_L->isHidden()){ui->label_turnLight_L->show();}else{ui->label_turnLight_L->hide();}});timer_TurnRightLight = new QTimer;connect(timer_TurnRightLight,&QTimer::timeout,this,[=](){if(ui->label_turnLight_R->isHidden()){ui->label_turnLight_R->show();}else{ui->label_turnLight_R->hide();}});

這里我沒有單獨另寫槽函數，而是用了lambda表達式，詳細可以自行百度這個東東。

下面就是主要的接口了，

void HUD::set_TurnLight(int signalType, bool isOn) {switch (signalType) {case TURN_LEFT:{if(isOn){timer_TurnLeftLight->start(1000);}else{timer_TurnLeftLight->stop();ui->label_turnLight_L->hide();}break;}case TURN_RIGHT:{if(isOn){timer_TurnRightLight->start(1000);}else{timer_TurnRightLight->stop();ui->label_turnLight_R->hide();}break;}case WARNING:{if(isOn){timer_TurnLeftLight->start(1000);timer_TurnRightLight->start(1000);}else{timer_TurnLeftLight->stop();ui->label_turnLight_L->hide();timer_TurnRightLight->stop();ui->label_turnLight_R->hide();}break;}default:break;} }

控制定時器的開關和時間就好了。

速度表其實更好實現了，我仔細觀察了我車的HUD上面的速度表，三位數 單位km/h 三位數足夠了，哈哈，看樣子他的樣子和8位數碼管顯示的樣子差不多，這里我就百度了8為數碼管的樣子，仿照做了數字。

實現這個東西的大致想法如下

?

這里制作數字的過程就省略了。最后就是10張圖片，如下

?

上圖中實際背景是透明的，我只是為了截圖可看清，在這里我犯了一個錯誤，那就就是這個10和素材的大小不一樣，這就導致我在實際資源使用中，廢了好大勁才對齊所有數字。這個過程會在后面代碼中體現出來。

?

上圖中布局就是我的數字，就一個QLabel，完了根據數據接口的數字來給這個Lebel分配不同的資源。實現代碼如下

void HUD_Number::set_Number(int temp) {switch (temp) {case 0:ui->label_hudNumber->setGeometry(1,0,85,122);ui->label_hudNumber->setStyleSheet("border-image:url(:/HUD/Resources/Images/HUD/number/0.png)");break;case 1:ui->label_hudNumber->setGeometry(29,5,57,113);ui->label_hudNumber->setStyleSheet("border-image:url(:/HUD/Resources/Images/HUD/number/1.png)");break;case 2:ui->label_hudNumber->setGeometry(0,0,86,122);ui->label_hudNumber->setStyleSheet("border-image:url(:/HUD/Resources/Images/HUD/number/2.png)");break;case 3:ui->label_hudNumber->setGeometry(6,0,80,122);ui->label_hudNumber->setStyleSheet("border-image:url(:/HUD/Resources/Images/HUD/number/3.png)");break;case 4:ui->label_hudNumber->setGeometry(14,4,72,114);ui->label_hudNumber->setStyleSheet("border-image:url(:/HUD/Resources/Images/HUD/number/4.png)");break;case 5:ui->label_hudNumber->setGeometry(6,0,77,122);ui->label_hudNumber->setStyleSheet("border-image:url(:/HUD/Resources/Images/HUD/number/5.png)");break;case 6:ui->label_hudNumber->setGeometry(0,0,83,122);ui->label_hudNumber->setStyleSheet("border-image:url(:/HUD/Resources/Images/HUD/number/6.png)");break;case 7:ui->label_hudNumber->setGeometry(31,0,55,121);ui->label_hudNumber->setStyleSheet("border-image:url(:/HUD/Resources/Images/HUD/number/7.png)");break;case 8:ui->label_hudNumber->setGeometry(0,0,86,122);ui->label_hudNumber->setStyleSheet("border-image:url(:/HUD/Resources/Images/HUD/number/8.png)");break;case 9:ui->label_hudNumber->setGeometry(6,0,79,122);ui->label_hudNumber->setStyleSheet("border-image:url(:/HUD/Resources/Images/HUD/number/9.png)");break;default:break;} }

在上面的代碼中，可以看到，我每次給label分配資源的時候，都需要重新設置label的位置和大小，這就是因為我開始制作素材是沒有注意這個問題。大家在后面制作素材是可以注意。

那么我的這一個數字表就做好了，怎么把呀做成三個了，這就到了真真的設置速度的接口了，我吧這個實現方式寫在了設置速度表的接口中。如下

void HUD::set_Current_Speed(int temp) {if(temp <10){number_2->hide();number_3->hide();number_1->setGeometry(157,70,86,122);number_1->set_Number(temp);ui->label_Kmh->setGeometry(156,195,88,22);}else if(temp>=10 && temp<100){number_2->show();number_3->hide();number_1->setGeometry(200,70,86,122);number_2->setGeometry(114,70,86,122);number_1->set_Number(temp%10);number_2->set_Number(temp/10);ui->label_Kmh->setGeometry(199,195,88,22);}else{number_2->show();number_3->show();number_1->setGeometry(243,70,86,122);number_2->setGeometry(157,70,86,122);number_3->setGeometry(71,70,86,122);number_1->set_Number(temp%10);number_2->set_Number((temp/10)%10);number_3->set_Number(temp/100);ui->label_Kmh->setGeometry(240,195,88,22);} }

好了，這邊篇就完事了

?

2019/07/23 14:20

?

?

總結

以上是生活随笔為你收集整理的Qt [GC9-13]：HUD-转向灯、速度表、背景透明处理的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。