加油機(jī)多媒體屏管理系統(tǒng)設(shè)計與實現(xiàn)

胡光元 畢靜

摘要：隨著物聯(lián)網(wǎng)技術(shù)與人工智能的發(fā)展，加油機(jī)不再僅僅作為加油支付的工具。該文本著設(shè)備即是服務(wù)的理念，使加油機(jī)作為與客戶交互的服務(wù)界面還充當(dāng)著業(yè)務(wù)信息交流的角色，該文對加油機(jī)加油支付管理操作進(jìn)行了改進(jìn)，設(shè)計的多媒體屏管理系統(tǒng)使司機(jī)在加油過程中不僅看到相關(guān)加油數(shù)據(jù)還能分享到來自油站的視頻廣告通知等服務(wù)信息。文中采用前后端分離技術(shù)，規(guī)劃設(shè)計了系統(tǒng)前端加油支付、視頻圖片等信息顯示功能，利用后端實現(xiàn)復(fù)雜算法和業(yè)務(wù)功能，采用消息機(jī)制實現(xiàn)前后端信息發(fā)送，并采用ftp和多線程技術(shù)實現(xiàn)播放文件的傳送和下載。文中對多媒體屏各個功能模塊的設(shè)計實現(xiàn)做了一一介紹。

關(guān)鍵詞：加油機(jī);多媒體屏;視頻廣告;消息機(jī)制

中圖分類號：TP315? ? ? 文獻(xiàn)標(biāo)識碼：A

文章編號：1009-3044（2021）13-0197-03

1 背景

目前加油站發(fā)布各種信息主要是通過短信、電話通知客戶或者需要客戶到店咨詢各種業(yè)務(wù)，既給客戶需求帶來不便也不利于加油站的業(yè)務(wù)發(fā)展和提高企業(yè)形象。因此加油站需要設(shè)計良好先進(jìn)的平臺來發(fā)布各種信息、宣傳自己的各種產(chǎn)品和服務(wù)。另外加油機(jī)在加油過程中通常只在顯示屏上實時顯示加油的升數(shù)、金額和單價等信息，比較單調(diào)[1]，加油時也沒有微信支付功能。多媒體加油機(jī)設(shè)計與研究除了讓加油機(jī)加油外，還完善支付功能，還讓加油機(jī)成為與客戶交互的服務(wù)系統(tǒng)，承載著提供功能性體驗、情感性體驗和社會性體驗的重要作用。文中提及的多媒體屏是一個小型嵌入式計算機(jī)即工業(yè)用平板 PC安裝在加油機(jī)上，用來作為加油機(jī)加油操作和數(shù)據(jù)信息畫面顯示終端。

2網(wǎng)絡(luò)拓?fù)浣Y(jié)構(gòu)

物聯(lián)網(wǎng)技術(shù)和設(shè)備智能化的快速發(fā)展，為加油站設(shè)備改造、現(xiàn)代化管理提供了技術(shù)保障，加油機(jī)不僅僅完成加油功能，支付方式電子化、設(shè)備的動態(tài)監(jiān)控、加油數(shù)據(jù)及各種相關(guān)信息最終要以界面顯示方式呈現(xiàn)給需求者，為方便查詢數(shù)據(jù)及監(jiān)控設(shè)備狀態(tài)，多個加油機(jī)和計算機(jī)等設(shè)備利用物聯(lián)網(wǎng)和互聯(lián)網(wǎng)技術(shù)組成網(wǎng)絡(luò)來實現(xiàn)加油站各個業(yè)務(wù)功能。加油站內(nèi)各個設(shè)備網(wǎng)絡(luò)拓?fù)浣Y(jié)構(gòu)如圖1所示。

站內(nèi)前置主機(jī)主要負(fù)責(zé)實時監(jiān)控多媒體加油機(jī)狀態(tài)，接收、顯示和保存加油機(jī)的加油數(shù)據(jù)，彼此相互通訊;油站管理主機(jī)對油站業(yè)務(wù)管理，包括統(tǒng)計、匯總加油數(shù)據(jù)、IC卡發(fā)放、續(xù)存等業(yè)務(wù);多媒體加油機(jī)除了完成加油功能，還可以使用IC卡加油支付、微信支付，在加油機(jī)的多媒體屏上除了顯示加油數(shù)據(jù)還可以顯示音視頻、圖片、通知廣告等信息;多媒體服務(wù)器負(fù)責(zé)準(zhǔn)備多媒體屏需要的文件和通知等信息，多媒體服務(wù)器與多媒體屏可以相互發(fā)送信息。

3 開發(fā)工具

Qt是一個跨平臺C++圖形用戶界面應(yīng)用程序開發(fā)框架。它既可以開發(fā)GUI程序，也可用于開發(fā)非GUI程序。Qt除了用來開發(fā)圖形界面應(yīng)用程序、繪制漂亮的界面（包括控件、布局、交互），還包含很多其他功能，比如多線程、訪問數(shù)據(jù)庫、圖像處理、音頻視頻處理、網(wǎng)絡(luò)通信、文件操作等，這些 Qt 都已經(jīng)內(nèi)置了[2]。Qt的qml界面編程方式非常靈活，設(shè)計出的界面簡潔大氣又非常絢麗，有很多動畫。為了使界面美觀、設(shè)計靈活方便，本文采用前后端分離技術(shù)，使用qml方式設(shè)計界面，使用Qt C++ 實現(xiàn)非界面的業(yè)務(wù)邏輯和復(fù)雜運算。

數(shù)據(jù)庫使用SQLite，它是一款輕型的數(shù)據(jù)庫，它包含在一個相對小的C庫中，它的設(shè)計目標(biāo)是嵌入式的，占用資源非常的低，在嵌入式設(shè)備中，可能只需要幾百K的內(nèi)存就夠了。它能夠支持Windows/Linux/Unix等主流的操作系統(tǒng)，同時能夠跟很多程序語言相結(jié)合，處理速度較快[3]。多媒體屏是一個小型嵌入式計算機(jī)，硬盤空間較小，需要使用SQLite數(shù)據(jù)庫記錄保存播放文件和通知等信息。

4 前端界面設(shè)計

當(dāng)多媒體屏運行時，顯示界面示意圖如圖2所示。

界面區(qū)域分為“視頻廣告區(qū)”“信息欄”“支付二維碼區(qū)”“通知欄”等四個主要區(qū)域。視頻廣告區(qū)在加油機(jī)空閑情況下處于全屏展示狀態(tài)，占據(jù)整個屏幕，當(dāng)有加油信息和通知信息顯示時，只在默認(rèn)區(qū)域顯示;信息欄顯示加油機(jī)各個狀態(tài)信息，包括插卡用戶信息、正在加油數(shù)據(jù)信息、加油結(jié)束信息、微信支付等信息;通知欄顯示通知信息，為單行滾動文字，文字信息來自多媒體服務(wù)器傳送。二維碼區(qū)為支付二維碼展示區(qū)域，此區(qū)域為客戶選擇微信支付后，后臺根據(jù)支付信息以及訂單詳情生成的二維碼，客戶使用微信掃一掃功能掃描該區(qū)域進(jìn)行付款，并在信息欄中顯示支付結(jié)果。信息欄、通知欄、二維碼區(qū)這三個功能區(qū)不是一直顯示在主界面，而是根據(jù)功能需要隨時顯示出來。默認(rèn)情況下整屏顯示視頻、圖形廣告。

使用Qtqml方式來完成界面的設(shè)計，圖2的布局可以用Rectangle控件實現(xiàn)， 通過Rectangle控件可設(shè)置每個區(qū)域大小、邊框顏色、背景顏色等;使用MediaPlayer控件實現(xiàn)音頻視頻播放;使用Image控件設(shè)置和顯示圖像，利用Image控件屬性可設(shè)置圖片來源、圖片填充樣式，設(shè)置動態(tài)顯示屬性來平移或旋轉(zhuǎn)圖片等，利用PropertyAnimation 可實現(xiàn)圖片動畫功能;使用可視化Text顯示文本內(nèi)容，可設(shè)置字體大小、寬度、高度、顏色等屬性，至于實現(xiàn)文本動畫狀態(tài)，可利用NumberAnimation控件實現(xiàn)文本從下往上滾動，通過不斷改變坐標(biāo)Y值;使用Timer控件實現(xiàn)定時或延時功能，如設(shè)置圖片停留時長或文本顯示時長等。前端界面運行顯示流程框架如圖3所示。

前端界面程序除了規(guī)劃、設(shè)計界面顯示功能外，還利用消息機(jī)制不斷接收后端程序發(fā)送來的信息，根據(jù)接收信息的類別，信息數(shù)據(jù)顯示在畫面的不同區(qū)域。

5 后端程序?qū)崿F(xiàn)

系統(tǒng)在設(shè)計時采用前后端分離技術(shù)，前端只負(fù)責(zé)渲染界面、顯示數(shù)據(jù)，后端執(zhí)行復(fù)雜算法和業(yè)務(wù)需求，并提供和保存各種數(shù)據(jù)，這樣便于系統(tǒng)維護(hù)和提升系統(tǒng)性能。在顯示界面設(shè)計好后，就要使用Qt C++設(shè)計后端程序，包括使用udp協(xié)議與下位機(jī)通訊、接收多媒體服務(wù)器傳送的通知和文件列表信息、使用多線程下載文件等。后端程序整個流程框架如圖4所示。

5.1 多媒體屏與下位機(jī)通訊

udp是一個無連接協(xié)議，傳輸數(shù)據(jù)之前源端和終端不建立連接，當(dāng)它想傳送時就簡單地去抓取來自應(yīng)用程序的數(shù)據(jù)，并盡可能快地把它扔到網(wǎng)絡(luò)上。在發(fā)送端，udp傳送數(shù)據(jù)的速度僅僅是受應(yīng)用程序生成數(shù)據(jù)的速度、計算機(jī)的能力和傳輸帶寬的限制;在接收端，udp把每個消息段放在隊列中，應(yīng)用程序每次從隊列中讀一個消息段[4]。一臺服務(wù)機(jī)可同時向多個客戶機(jī)傳輸相同的消息，也即是提供廣播和多播的功能。本系統(tǒng)有多個多媒體屏安裝在不同的加油機(jī)上，伺機(jī)等待著接收和顯示數(shù)據(jù)，在接收下位機(jī)的加油數(shù)據(jù)同時接收多媒體服務(wù)器的播放文件和通知等信息，綜合考慮選擇udp通訊方式更加有效。多媒體屏與下位機(jī)通訊協(xié)議如表1所示。

表1中XX表示機(jī)號，IDLE表示空閑，WORK表示正在加油，F(xiàn)INISH表示加油結(jié)束，NEEDPAY表示需要微信支付，PAYING表示正在等待支付，SUCCESS表示支付成功，F(xiàn)AIL表示支付失敗。

1）數(shù)據(jù)字段信息描述：ACCOUNT加油賬號，CARDNO加油卡號，REMAIN剩余余值，GRADE用戶積分，RMTYPE余值類型，VOLUME加油量，PRICE單價，MONEY加油金額，PAYMONEY實付金額，ORDERNO訂單號（騰訊微支付服務(wù)產(chǎn)生），STATIONORDER站內(nèi)訂單號，ORDERPATH支付路徑用于產(chǎn)生二維碼的數(shù)據(jù)信息，PAYCHANNEL支付渠道，00微信掃碼支付 01微信刷卡支付。

2）命令字描述：STATUS表示狀態(tài)指令字，QUERY表示查詢狀態(tài)。

5.2 多媒體屏與多媒體服務(wù)器通訊

多媒體服務(wù)器主要負(fù)責(zé)準(zhǔn)備要在多媒體屏播放顯示的音視頻、廣告、圖片、通知等各個信息，多媒體服務(wù)器與多個多媒體屏之間采用ftp協(xié)議完成文件的傳輸，需要把多媒體服務(wù)器配置成ftp服務(wù)器[5]，新建域名、建立登錄的用戶信息、訪問的文件目錄及訪問權(quán)限等。本文在設(shè)計時充分考慮系統(tǒng)性能，避免多媒體屏實時訪問多媒體服務(wù)器，只有當(dāng)播放的文件列表有更新時，多媒體服務(wù)器先采用udp協(xié)議把新的文件信息發(fā)給多個多媒體屏，多個多媒體屏收到信息后才開始連接訪問多媒體服務(wù)器按收到的信息下載文件。考慮下載的文件會比較大，下載時采用多線程技術(shù)完成多個文件下載，每個多媒體屏下載的文件統(tǒng)一保存在本地目錄上，每個下載的文件詳細(xì)信息同時也記錄在數(shù)據(jù)庫中，播放顯示時根據(jù)數(shù)據(jù)庫中保存的記錄讀取各個已下載的文件。

6結(jié)束語

智慧加油站是加油站企業(yè)的發(fā)展方向。“設(shè)備即是服務(wù)”的加油機(jī)設(shè)計理念將貫穿于現(xiàn)代化加油機(jī)的外觀設(shè)計、軟件流程設(shè)計、硬件選型設(shè)計過程中[6]。多媒體加油機(jī)的出現(xiàn)把加油機(jī)當(dāng)成服務(wù)系統(tǒng)給消費者帶來了全新的體驗，使消費者在加油過程中就能即時獲取油站各種業(yè)務(wù)信息，即方便了消費者，又提升了油站的服務(wù)水平。

參考文獻(xiàn)：

[1] 曹智軍，彭黎迎，張鵬.多媒體自助加油機(jī)的設(shè)計[J].水利電力機(jī)械，2006（6）：36-38.

[2] 朱晨冰，李建英.Qt5.12實戰(zhàn)[M].北京：清華大學(xué)出版社，2020.

[3] liuhe688.SQLite數(shù)據(jù)庫簡介[EB/OL].（2011-08-24）[2021-01-25].

[4] 陳香凝，王燁陽，陳婷婷.Windows網(wǎng)絡(luò)與通信程序設(shè)計[M].3版.北京：人民郵電出版社，2017.

[5] 溫曉軍，王小磊.Windows Server 2012 網(wǎng)絡(luò)服務(wù)器配置與管理[M].北京：人民郵電出版社，2020.

[6] 周俊峰，張材，張亮.新一代服務(wù)型多媒體加油機(jī)的技術(shù)及應(yīng)用[J].中國計量，2020（2）：78-80.

【通聯(lián)編輯：謝媛媛】