基于TOPWAY液晶屏的水質檢測儀設計
加入技術交流群
近來使用一款帶電容觸摸的TOPWAY7寸智能顯示模塊制作了一個水質檢測儀，利用TOPWAY官方提供的智能LCD模塊開發(fā)工具，能夠類似開發(fā)C#上位機（并且可以省去C#中代碼編寫的部分），省去正常開發(fā)中單片機去驅動屏幕移植GUI等過程，只需添加簡單的協(xié)議交互，可以快速高效的實現(xiàn)項目需求，節(jié)省大量的開發(fā)時間和硬件成本。
本文引用地址：http://www.104case.com/article/202204/433019.htm一、項目簡介
1、需求分析：
1）采集數(shù)據(jù)（定時采集水體的PH值和溫度，以及環(huán)境的溫濕度）
2）顯示在屏幕上（將采集的值實時顯示在屏幕上）
3）曲線展示（以曲線的形式將一段時間內的變量顯示在屏幕上）
2、項目流程：
1）屏幕內容設計（主要設計屏幕的顯示內容和控件使用）
2）硬件設計（電源、傳感器接口、屏幕接口）
3）軟件設計（數(shù)據(jù)采集以及屏幕與單片機信息交互）
硬件：NUCLEO-G070RB及硬件擴展板、PH溫度采集傳感器、TOPWAY- HMT070ETD-1D
開發(fā)工具及版本：TOPWAY SGTools V9.35、STM32CuBeMx V6.4.0 、KEILMDK V5.25、PhotoShop
二、屏幕內容設計
1、界面規(guī)劃
根據(jù)需求，需要設計三個界面
a)主界面：顯示時間及各類傳感器實時值；
b)水質曲線顯示：顯示PH值和水溫的動態(tài)曲線；
c)溫濕度曲線顯示：顯示環(huán)境溫濕度的動態(tài)曲線。
2、設計資源整理
d)主界面：僅需要一個背景圖即可，其他的都可以用屏幕設計工具設計；
e)水質曲線顯示：需要兩個圖標和兩個坐標軸；
f)溫濕度曲線顯示：需要兩個圖標和兩個坐標軸。
可以在網上尋找資源或者配合公司UI人員去設計，這里我在網上找了背景圖和圖標，并使用PhotoShop和Word工具制作了坐標軸。
3、界面設計
a)創(chuàng)建工程
使用TOPWAY SGTools V9.35工具創(chuàng)建工程
創(chuàng)建工程和文件夾并選擇使用的屏幕類型，這里可以根據(jù)屏幕的大小篩選可以更快選擇，這里選擇屏幕大小時可以根據(jù)實際情況選擇0°/180°（正常顯示，即1024*600）或者90°/270°（旋轉90°顯示即600*1024）。
b)導入素材
工程文件夾中添加兩個文件夾分別存儲圖標和背景圖（看個人習慣）
在工程資源欄中，右鍵背景圖和圖標分別添加背景和圖標
c)選擇字庫
菜單欄中 工具-字體設置中可以選擇合適的字庫
其中字體配置1中都是一些固定的字庫，可以直接來用。
字體配置2中可以自己去創(chuàng)建自定義寬高的字體，讓開發(fā)有更多的選擇，也十分的方便，不過需要注意，生成的字庫也比較大，還是適量的添加，不然太耗屏幕本身的存儲了。
d)新建頁面并添加控件
按照規(guī)劃，需要新建三個頁面更換對應的背景，添加所需的控件。
控件使用情況：
靜態(tài)字符串-用來顯示一些靜態(tài)的字符，比如標題，變量名稱及固定符號等
日期時鐘-用來顯示時間
數(shù)字-顯示變量
表盤-直觀顯示變量范圍
進度條-直觀顯示變量范圍
曲線-顯示變量的動態(tài)變化過程
觸摸鍵-人機交互（調整時間，變換不同頁面等）
頁面0：
頁面1：
頁面2：
e)調整控件
調整控件可以使用工具欄中的對齊工具，可以拯救強迫癥患者
f)添加變量并綁定編輯
根據(jù)實際使用情況新建變量，這里只使用了16位數(shù)字變量和曲線變量
在對應的控件屬性VP地址里綁定對應的變量的地址，同時也可以修改顏色大小等。
例如下圖中這個進度條顯示，可以用顏色顯示直觀顯示出PH狀況，首先需要修改方向為從上到下（默認為從左到右），然后前景色1和2選為代表PH為0時的紅色和PH為14的紫色，選擇合適的間隔和步進，綁定VP地址，設置最小值和最大值
其余的數(shù)字、表盤和曲線都綁定并編輯
g)添加觸摸鍵
添加觸摸鍵的方式有兩種，一種是直接在控件上右鍵，選擇添加觸摸鍵，如下：
另一種是直接在控件欄添加控件，自由調整大小。
這里我使用的是自由添加的模式，如下圖，主界面中時間里年月日時分秒分別添加了觸摸鍵，用來調整時間，下邊兩個區(qū)域分別添加了觸摸鍵，用來跳轉到其他界面。
在時間這邊，還需要每個添加一個數(shù)字鍵盤，并綁定變量地址，調整一下最大最小值。
這樣可以通過觸摸鍵呼叫出數(shù)字鍵盤，輸入時間，下發(fā)到單片機，再由單片機返回設置指令到屏幕，達到設置時間的效果。
也可使用TOPWAY的屏內RTC時鐘功能, 并使用"RTC鍵盤(PIP)”替代，讓開發(fā)設計更加便捷。
跳轉界面就更簡單了，可以直接跳轉到目標頁面，在其他界面也可以添加觸摸鍵用來返回到主界面。
三、硬件設計
原理圖如下：
主要包括12V電源接口（NUCLEO板上有12V-5V-3.3V，所以就不需要再轉換了）、NUCLEO擴展接口、水質傳感器接口（溫度+PH）、屏幕接口、溫濕度AHT10、串口轉232和串口轉網口（使用的是億佰特的模塊），其中串口轉232和串口轉網口可以二選一，因為屏幕是支持232和以太網口的，可以根據(jù)不同情況來切換。
PCB實物圖如下：
評論