電子發(fā)燒友App
一、項目背景
如上圖所示，迪文DGUS屏與單片機通過串口通信，來獲取單片機板輸入輸出狀態(tài)、AD電壓值，同時可以通過迪文DGUS屏實現(xiàn)按鍵控制控制板的輸出，并且可以進行一些參數(shù)的設(shè)定。
二、準(zhǔn)備工作
1、 迪文4.3寸觸摸屏一個，分辨率480*272
2、 24V開關(guān)電源或可調(diào)電源 1 個
3、 界面圖片 4 張 分辨率480*272 bmp格式(一定要是bmp格式的，否則不能識別)
4、 迪文DGUS工具
5、 TF卡 1 張 （8G或以下，帶讀卡器）
6、 STC15系列控制板 1 塊
8、 串口助手
三、能力要求
1、 圖形界面設(shè)計，最好是會試用coreldraw、PS等設(shè)計軟件
2、 熟悉STC15系列單片機的基本使用
3、 串口助手的基本使用
4、 熟悉迪文DGUS組態(tài)軟件基本操作
5、 熟悉迪文DGUS屏的基本指令
如果你手上恰好有上述工具，同時你也具備了相應(yīng)的能力，那么，恭喜你，在看完本例程后，關(guān)于單片機跟迪文DGUS屏的應(yīng)用，你基本能獨立完成了。話不多說，且跟著筆者的節(jié)奏，動起你的小手來完成這個小項目吧。
關(guān)于這個項目，筆者分兩個部分進行講解，即：DGUS工程和單片機程序，我們現(xiàn)在先做第一部分，迪文DGUS工程的設(shè)計。
首先，我們打開迪文DGUS工具，新建一個DGUS工程文件：
這時會“屏幕屬性設(shè)置”對話框，需要我們選擇屏幕尺寸以及DGUS工程存放的路徑，這里尺寸我們選擇480*272，因為我們用的是4.3寸的DGUS屏，它的分辨率就是這個。路徑的話根據(jù)自己的實際情況選擇就好了。
這個時候，我們可以看到，新建的DGUS工程文件是空白的：
先不急著添加其他東西，我們先對DGUS工程進行一些簡單的配置，點擊工具欄中的“配置”選項，彈出以下界面：
然后，跟著上圖，從第一步到第六步依次設(shè)置就好了。其中：
l? “串口波特率”即：單片機跟DGUS屏通信時的波特率。
l? “串口幀高字節(jié)”、“串口幀低字節(jié)”，即：串口通信時通信質(zhì)量的幀頭高字節(jié)和低字節(jié)，關(guān)于這個幀頭，可以參考《迪文的DGUS指令說明》文檔，里面介紹的很詳細。
l? “觸摸屏錄入?yún)?shù)后自動上傳到串口”，這個選項是針對DGUS屏的觸控變量而言的，只有選中了這個參數(shù)，在對觸控變量操作的時候，DGUS屏才會立即將指令發(fā)送給單片機。
l? “初始變量由22(0x16)字庫文件決定”，這個選項主要是針對一些變量的初值的設(shè)定，如果不選中這個選項的話，那么所有變量的初值都會是0，所以，在某些場合下，如果需要將變量初值設(shè)置成非0的數(shù)的話，這個選項是必要的。
l? “運行周期”，這個變量主要是配置DGUS屏的運行周期，最快可以選擇80ms，大家可以根據(jù)實際需要選擇，筆者這里選擇的是120ms。
以上參數(shù)配置完畢后，我們點擊“輸出配置文件”即可。
配置文件成功生成后，我們可以在DGUS工程的DWIN_SET文件夾下看到多出了一個CONFIG.txt的文件，這個就是我們所謂的配置文件。這里順便說一下，跟迪文DGUS工程相關(guān)的所有文件，都是存放在DWIN_SET文件夾中的，我們下載觸摸屏程序的時候，也只需要將整個DWIN_SET文件夾復(fù)制到SD卡就好了。
接下來，我們就要開始往DGUS工程中添加我們需要的文件了，我們將提前準(zhǔn)備好的跟項目相關(guān)的4張圖片復(fù)制到DWIN_SET文件夾中，這里特別需要注意的就是，圖片的分辨率一定要跟觸摸屏的分辨率一直，即，是480*272，否則顯示就會錯亂。另外，關(guān)于迪文DGUS屏文件的命名，請仔細查閱《迪文DGUS屏開發(fā)指南V43》，總是這里筆者要提醒大家的就是：文件名的前綴的數(shù)字，不是隨便想怎么改就怎么改的！
接下來，我們開始往DGUS工程中添加圖片，如下圖所示，在DGUS軟件中點擊“增加”選項：
在彈出的對話框中，選擇之前我們存放圖片的DWIN_SET文件夾，全選里面的四張圖片（也可以一張一張?zhí)砑?，這里筆者選擇一次性全部添加），然后點擊“打開”按鍵即可添加全部圖片：
然后，我們便可以在DGUS軟件里面看到選中的四張圖片被成功添加了進來：
至此，一個新的工程就建立好了，那么，接下來，筆者將要跟大家一起學(xué)習(xí)DGUS的幾個常用的控件。
第一個控件—“數(shù)據(jù)變量顯示”控件
首先，我們在需要顯示數(shù)字變量的地方添加一個“數(shù)據(jù)變量顯示”的控件，顧名思義，這個控件的作用就是用來顯示一些數(shù)據(jù)信息：
然后，我們需要調(diào)整好控件的大小及位置，當(dāng)然，控件的大小跟字體的大小和顯示的字體的位數(shù)也有關(guān)系，以14號字為例，顯示5位數(shù)據(jù)的話，那么字體的整體寬度就是14*5=70，字體的高度就是14*2=28，那么這個顯示控件的寬度就至少要為70，高度至少為28：
X：控件所在的X坐標(biāo)；
Y：控件所在的Y左邊;
W：控件的寬度
H：控件的高度
我們還可以給這個控件命名，同時每個變量都需要設(shè)定一個地址，每個地址的長度均為兩個字節(jié)，筆者這里設(shè)置為0x0010，然后可以設(shè)置字體的大小以及顏色、對齊方式、變量類型等參數(shù)，大家先按圖中所示的參數(shù)設(shè)置即可，更多的內(nèi)容，請查看《迪文DGUS屏開發(fā)指南V43》。
接下來，我們用同樣的方法，添加兩個“數(shù)據(jù)變量顯示”控件，分別用來顯示AD1和AD2的電壓值，我們分別給他們分配地址為：0x000E和0x000F，如下圖所示：
至此，“數(shù)據(jù)變量顯示”控件的操作筆者就介紹完畢了。
第二個控件—“變量圖標(biāo)顯示”控件
接下來，筆者就要跟大家介紹“變量圖標(biāo)顯示”控件的應(yīng)用。在工控領(lǐng)域中，很多時候我們都需要獲得輸入、輸出的狀態(tài)，并在觸摸屏或上位機上顯示，那么這種功能如果使用迪文DGUS屏來做的話，要怎么操作呢？其實也很簡單，這里我們只需要用到“變量圖標(biāo)顯示”控件，就能實現(xiàn)了。
首先，還是跟之前一樣，我們需要準(zhǔn)備兩個圖標(biāo)的bmp文件，大小為20*20像素：
接下來，我們利用“DWIN ICO生成工具”來生成一個ICO文件，也就是我們需要用到的圖標(biāo)文件，在“歡迎使用”界面中，我們可以找到“DWIN ICO生成工具”。
打開“DWIN ICO生成工具”會彈出如下對話框，我們先來操作第一步“選擇圖片文件所在的路徑”，然后我們選擇之前存放圖標(biāo)bmp文件的路徑：
點擊“確定”按鍵之后，我們可以看到，兩個圖標(biāo)文件被添加進來了：
接下來，我們操作第二步“生成ICO文件”，會彈出如下對話框，然后我們點擊“Build ICO”按鍵：
這時，會彈出一個對話框，需要我們選擇將生成的ICO文件存放到什么位置，前面我們說了，在下載DGUS屏程序的時候，實際上就是把DWIN_SET文件夾中的所有文件，都下載到DGUS屏中，所以，這里我們選擇還是將生成的ICO文件保存到DWIN_SET文件夾中，并將文件名保存為“42”，當(dāng)然這個名字也不是隨便取的，根據(jù)迪文手冊上的說明，圖標(biāo)的命名是24-127之間的數(shù)字，如圖標(biāo)庫大小大于256KB，假設(shè)為257KB，那么將占用兩個字庫空間，假設(shè)我們的字庫40.ICO 大小為257KB，那么占用了40,41 兩個字庫空間，下一個圖標(biāo)庫不能寫為41.ICO，必須由42 開始：
當(dāng)出現(xiàn)以下界面的時候，就說明我們的圖標(biāo)文件成功制作好了，然后我們點擊“確定”按鍵，然后再點“Close”按鍵，關(guān)閉對話框即可：
接下來，我們也可以預(yù)覽以下ICO文件中的內(nèi)容，我們將“DWIN ICO生成工具”的選項卡切換到“Preview of ICON File”界面，然后點擊“Open”按鍵：
接下來會彈出如下對話框，我們找到之前保存的ICO文件，然后點“打開”即可：
然后，我們便可以預(yù)覽到之前生成的圖標(biāo)文件里面的內(nèi)容了，另外，筆者在這里順便提一下，那就是用來制作圖標(biāo)ICO文件的bmp圖標(biāo)文件，最大尺寸不能超過255，當(dāng)然，我們在做狀態(tài)顯示的時候一般圖標(biāo)bmp圖片不會超過255，但是我們在某些場合下，還可以用圖標(biāo)變量來做報警提示，這樣的話，很多人不知不覺就將圖片弄成了超過255，筆者之前就犯過這樣的錯誤，前車之鑒啊，所以筆者在此特意提醒一下各位讀者：
圖標(biāo)文件制作好了，那我們就可以來開始用了。首先，我們找到DGUS工具中的“變量圖標(biāo)顯示”控件，將其拖動到圖片文件的對應(yīng)圖標(biāo)顯示的位置，然后我們將控件大小設(shè)置成W:20 H:20，也就是和我們之前圖片bmp文件的大小一致。同樣，我們給這個控件命名為X00，變量地址設(shè)置為：0x0000，圖標(biāo)文件選擇我們之前生成的42.ICO，變量下限設(shè)置為0，對應(yīng)圖標(biāo)選擇為1（即，紅色），變量上限為1，對應(yīng)的圖標(biāo)為2（即，綠色），顯示模式為透明，初始值為0。這里可能有讀者對變量下限和變量上限有點不理解，簡單說吧，目前我們的輸入狀態(tài)只有兩種，要么是紅色，要么是綠色，在X0沒有輸入的情況下，我們可以用紅色來顯示，當(dāng)X0有信號輸入的時候，用綠色來顯示，那么，我們可以用變量的兩個值來控制圖標(biāo)的顯示，當(dāng)變量的值為0的時候，我們就讓他顯示紅色（也就是顯示圖標(biāo)1），當(dāng)變量的值為1的時候，就讓他顯示綠色（也就是顯示圖標(biāo)2），那么如果要讓他上電的時候默認顯示紅色圖標(biāo)怎么辦呢？很簡單，我們只要設(shè)置初始值為0就可以了。當(dāng)然，變量下限、變量上限、初始值這些都是可以隨意更改的，只要范圍在0~65535即可，另外這里需要特別注意一下，那就是變量下限和變量上限的差值不是隨意的，需要根據(jù)所用到的圖標(biāo)的個數(shù)來設(shè)定，等大家后面接觸的多了，自然就明白了。
接下來，我們就按照同樣的方法，把其他的圖標(biāo)變量全部添加上去就可以了：
至此，整個工程的顯示變量都已經(jīng)完成了，接下來，筆者將要跟大家繼續(xù)學(xué)習(xí)本項目中用到的其他幾個常用的控件。
第三個控件—“按鍵返回”控件
接下來我們就要來設(shè)置觸控變量。首先，我們先來添加最簡單的—“按鍵返回”控件，很顯然，輸入端我們只需要能讀到輸入的狀態(tài)就好了，而輸出端，我們既要能讀到輸出的狀態(tài)，又要能控制某一個輸出的ON、OFF，因此，我們就需要用到了“按鍵返回”這個控件。
所謂按鍵返回，顧名思義，那就是說，當(dāng)我們用手去觸摸這個按鍵的時候，DGUS屏的串口會有數(shù)據(jù)返回。接下來，就讓我們來嘗試添加一個“按鍵返回”的控件吧。
這里主要需要注意三個地方，第一，就是需要勾選“數(shù)據(jù)自動上傳”選項；第二，就是需要給這個變量分配一個地址，避免跟之前的變量重復(fù)，這里講地址設(shè)置為0x0020；第三，就是需要設(shè)置“鍵值”，這個鍵值簡單來說，就是這個0x0020地址里面存放變量的值，也就是說，每次觸摸這個“按鍵返回”控件的時候，DGUS屏都會通過串口將變量0x0020的值發(fā)送出來。當(dāng)然，多個按鍵的時候，每個按鍵的地址可以設(shè)置成一樣，鍵值設(shè)置成不一樣即可；或者我們將每個按鍵的地址設(shè)置成不一樣，將鍵值設(shè)置成一樣，也同樣可以。那么，我們只需要通過判斷變量的地址和變量值，來識別出此時按下的是哪一個按鍵了。關(guān)于迪文DGUS屏的指令部分，后面在講編程的時候我們在詳細解釋。
第四個控件—“基本觸控”控件
接下來，筆者將要給大家介紹本項目中需要用到的一個新的控件，那就是—“基本觸控”控件，這個控件也是很常用的一個控件。下面，筆者以一個觸控鍵盤為例來給大家介紹一下這個控件。
我們將一個“基本觸控”控件拖動到數(shù)字鍵盤的“1”上面，然后來設(shè)置他的屬性。從屬性欄中我們可以看到，這個控件少了一個地址屬性，也就是說這個“基本觸控”按鍵是不需要地址的，沒有地址，也就意味著他沒有返回值，這就是他跟前面介紹到的“按鍵返回”控件的一個最大的區(qū)別了。我們可以給觸摸控件添加一個背景，這樣，在按下去的時候，將會有一個明顯的變化，能更好的體現(xiàn)出到底有沒有按下這個按鍵。其次最關(guān)鍵的一點就是鍵值的設(shè)置了，關(guān)于鍵值，在DGUS軟件中就有詳細的介紹，我們只需要按照給出的值設(shè)定好就OK了：
然后，按照同樣的方法，我們把數(shù)字鍵盤所需要的所有“基本觸控”控件添加好就OK了，至此，數(shù)字鍵盤就制作成功了，在別的界面需要輸入數(shù)字的時候，就可以直接調(diào)用這個數(shù)字鍵盤了。
接下里，筆者就要介紹一下，如何調(diào)用這個數(shù)字鍵盤來進行參數(shù)設(shè)置。那么，又有一個比較重要的控件，需要我們來學(xué)習(xí)了，那就是—“變量數(shù)據(jù)錄入”控件，這其實也是一個觸控控件。
第五個控件—“變量數(shù)據(jù)錄入”控件
這個變量的屬性還是比較多的，而且還需要用到數(shù)字鍵盤，乍一看確實有點頭疼，不過，在跟著筆者一步步操作后，你們會發(fā)現(xiàn)，其實，也就那么回事~
首先，我們還是需要勾選上“數(shù)據(jù)自動上傳”選項，這樣的話，一旦我們輸入了數(shù)據(jù)，DGUS屏就會馬上將數(shù)據(jù)通過串口發(fā)送出來。然后，我們需要設(shè)置變量地址，這里就需要注意了，因為我們是在“定時閃爍”這個“數(shù)據(jù)變量顯示”控件上添加的“數(shù)據(jù)變量錄入”控件，也就是說，我希望通過“數(shù)據(jù)變量錄入”這個控件來改變“定時閃爍”這個“數(shù)據(jù)變量顯示”的值，那么很顯然，這里的“數(shù)據(jù)變量錄入”控件的地址就要跟他一致，所以這里我們將這個控件的地址也設(shè)置為：0x0010，接下來的數(shù)據(jù)變量類型，這個就要根據(jù)我們所用到最大變量值來確定了，筆者這里設(shè)計的是0-99999ms可設(shè)置，那么很顯然，一個字（0-65535）的長度裝不下，所以需要用到雙字，整數(shù)位為5，小數(shù)位為0，因為沒有用到小數(shù)位。接下來，我們先不看“顯示位置”這個屬性，先把其他的設(shè)置好，顏色、字庫位置、字體大小、光標(biāo)顏色等，這里順便提下所謂的字庫，因為DGUS屏所使用的字庫是0號字庫，所以這里默認選擇0就好了，如果后面大家學(xué)會了自己制作字庫，那么就可以選擇自己的字庫了。然后，“輸入顯示方式”這里，我們選擇“直接顯示”，還有一種選擇就是“顯示*”，這個一般我們在用到密碼輸入的時候才會選這個，輸入普通的數(shù)字，我們直接顯示就好了。
接下里，我們就來設(shè)置鍵盤，首先是鍵盤位置，因為這里我們的鍵盤是在別的圖片中，所以選擇“其他頁面”，然后，我們點擊“鍵盤設(shè)置”按鍵，在彈出的對話框中，選擇我們鍵盤所在的頁面，點“確定”即可：
接下來，在彈出的對話框中，我們框選出鍵盤的顯示區(qū)域，選中后，我們也可以看到鍵盤所在區(qū)域的坐標(biāo)，然后點擊OK：
鍵盤的區(qū)域就設(shè)置好了，接下來我們就可以設(shè)置鍵盤的顯示區(qū)域，也就是說鍵盤要在哪個位置顯示。也許有讀者對這兩個概念有點不理解，那么筆者就舉個簡單的例子吧，相信系統(tǒng)自帶的畫圖軟件大家都有用過吧？那么我們把鍵盤這個圖片用畫圖軟件打開，然后，我們來選擇這個鍵盤區(qū)域，這樣一個操作就相當(dāng)于是“鍵盤區(qū)域的設(shè)置”了：
接下來就是鍵盤顯示位置的設(shè)置了，入下圖所示，也就是說，可以這個鍵盤放在位置1，或者位置2、或者位置3顯示。也就相當(dāng)于是在摳圖，然后把摳出來的這個圖放到任意一個位置，相信這么一說的話，讀者應(yīng)該能明白吧：
這里如果能看明白的話，那么我再來看前面跳過的設(shè)置數(shù)據(jù)顯示位置的部分就跟這里是一樣的道理了：
至此，整個項目的DGUS工程就建好了，接下來只需要點擊“生成配置文件”，即可自動生成用于下載的配置文件了，然后將整個工程保存就好了，當(dāng)然，其實在建工程的工程中，大家也要養(yǎng)成隨時保存的好習(xí)慣，否則萬一有異常狀況出現(xiàn)，那就白忙活了哈。
在成功生成配置文件后，我們會發(fā)現(xiàn)，在DWIN_SET文件夾中多出了三個文件，即：13觸控配置文件.bin、14變量配置文件.bin和22_Config.bin。
在下一講中，筆者將會給大家介紹下載觸摸屏程序以及如何模擬調(diào)試DGUS工程，模擬調(diào)試過程中，可能會對建好的工程中的某些屬性進行微調(diào)，以達到最佳的顯示效果，同時，也可以檢驗我們建的工程哪里有問題。最后，筆者在此特別提醒大家，在用觸控控件的時候，千萬不要有重疊的控件，否則，在生成配置文件的時候可能會失敗。好了，這一講就介紹到這了，如果大家喜歡的話，千萬別吝嗇你的點贊還有打賞喲……
工商網(wǎng)監(jiān)
評論