正點(diǎn)原子T100智能焊臺體驗(yàn),順便咱們來說說它的軟件菜單、界面切換如何來實(shí)現(xiàn)?

前陣子收到了正點(diǎn)原子贈送的T100智能焊臺以及DS100數(shù)字示波器，目前經(jīng)過個(gè)人實(shí)際體驗(yàn)，總體感覺非常優(yōu)秀，如下：

1、正點(diǎn)原子T100智能焊臺體驗(yàn)

將T100智能焊臺做了一下簡單組裝，然后開啟了一波操作和焊接：

個(gè)人體驗(yàn)總結(jié)如下：

• 體積較小，便于外出攜帶界面操作簡單，參數(shù)設(shè)置功能豐富升溫較快，控溫穩(wěn)定人性化的自動休眠和待機(jī)功能維護(hù)保養(yǎng)簡單

2、正點(diǎn)原子T100智能焊臺菜單框架

但是，作為軟件工程師，我更有興趣的是，它的界面是如何實(shí)現(xiàn)的？因?yàn)榻缑娌僮饕彩钦麄€(gè)產(chǎn)品中非常重要的一部分，如下：

Q1.界面切換的軟件設(shè)計(jì)思路

關(guān)于界面的切換的設(shè)計(jì)思想，可以參考如下文章：

C語言表驅(qū)動法編程實(shí)踐(精華帖,建議收藏并實(shí)踐)

C語言映射表在嵌入式串口解析、UI設(shè)計(jì)中的應(yīng)用(值得收藏并實(shí)踐的精華帖)

Q2.多語言版本的軟件設(shè)計(jì)思路

如上，之前有小伙伴問過我一個(gè)問題，如何來設(shè)計(jì)多語言版本呢？正常面向全球出貨的電子產(chǎn)品，那么它一定逃不過多語言版本，不同國家由于語言不同，導(dǎo)致上面顯示的內(nèi)容不一樣，對于不同語言我們可以采用一個(gè)二維指針數(shù)組的方式來實(shí)現(xiàn)，第一維表示具體是哪國的語言，第二維表示具體要顯示什么內(nèi)容，例如：

const u8* Mulit_Language[3][LANGUAGE_NUM]=
{
  {
    "0.退出",
    "1.步進(jìn)設(shè)置",
    "2.休眠溫度",
    "3.休眠時(shí)間",
    "4.待機(jī)時(shí)間",
    "5.自動關(guān)機(jī)",
    "6.參數(shù)選擇",
    "7.溫度校準(zhǔn)",
    "8.輸出電源",
    "9.輸出開關(guān)",
    "10.蜂鳴器",
    "11.語言選擇",
    "12.恢復(fù)出廠",
  },
  {
    "0.Exit",
    "1.Step Set",
    "2.Sleep Temp",
    "3.Sleep Time",
    "4.Stdby Time",
    "5.Auto P_Off",
    "6.Param Sel",
    "7.Temp Calib",
    "8.Output Cur",
    "9.Output ON",
    "10.Beep ON",
    "11.Language",
    "12.Restore",
  },
  //后面還可以繼續(xù)拓展別的語言
};

Q3.滑動菜單列表的軟件設(shè)計(jì)思路

先來觀察下這個(gè)界面包含什么信息：

最上面是帶填充色的標(biāo)題顯示，右邊是一個(gè)滾動條，然后中間區(qū)域有一個(gè)指向當(dāng)前項(xiàng)的手的圖標(biāo)還有具體的字符串項(xiàng)，當(dāng)操作旋鈕時(shí)，對應(yīng)的項(xiàng)則被填充背景色，且對應(yīng)項(xiàng)的字符串的前景色也發(fā)生改變，根據(jù)這個(gè)思路，我們可以得到設(shè)計(jì)軟件應(yīng)該有的一些信息：

• 1.當(dāng)前選中的位置，它應(yīng)該是一個(gè)變量，可以改變2.這個(gè)菜單列表具體有多長，包含了多少個(gè)菜單列表項(xiàng)3.選中的時(shí)候長什么樣？沒有被選中的時(shí)候呢？4.選中的時(shí)候加載圖標(biāo)顯示，沒有被選中加載空圖標(biāo)5.菜單列表項(xiàng)顯示的內(nèi)容，具體每一項(xiàng)要顯示什么東西6.當(dāng)選中這個(gè)菜單項(xiàng)以后，按確認(rèn)鍵后要觸發(fā)什么操作？7.菜單之間的切換，分級，列表的話就有前、后的關(guān)系8.滾動條的實(shí)現(xiàn)，如何與列表信息關(guān)聯(lián)？

接下來，將這些信息就可以抽象為一個(gè)結(jié)構(gòu)體ListItem：

typedef struct ListItem
{   
  //菜單顯示時(shí)光標(biāo)位置
 int8_t  item_cursor; 
  //菜單包含項(xiàng)目數(shù)
 uint8_t item_count;
  //顯示菜單的狀態(tài) 是否選中
 uint8_t item_is_select;
  //菜單項(xiàng)目選中的ICO數(shù)據(jù)地址
 const uint8_t *item_ico_display; 
  //菜單項(xiàng)目沒選中的ICO數(shù)據(jù)地址
 const uint8_t *item_ico_un_display; 
  //菜單列表顯示的文本內(nèi)容
 const uint8_t *item_display_text;
  //跳轉(zhuǎn)到對應(yīng)的功能菜單
 void (*Jump_Menu)(void); 
  //切換到上一級菜單列表項(xiàng)
 struct ListItem* prev_item_list; 
  //切換到下一級菜單列表項(xiàng)
 struct ListItem* next_item_list; 
}List_Item_Typedef;

這里我們采用的是雙向鏈表的設(shè)計(jì)思想對這個(gè)菜單進(jìn)行維護(hù)和更新，根據(jù)這個(gè)結(jié)構(gòu)體，繼續(xù)完成一個(gè)菜單列表的控制函數(shù)與具體的結(jié)構(gòu)體變量還有滾動條關(guān)聯(lián)起來即可，關(guān)于滾動條我們需要單獨(dú)去設(shè)計(jì)一個(gè)控件，由于篇幅原因，這里就不實(shí)現(xiàn)了；詳細(xì)的設(shè)計(jì)過程寫起來稍微有些復(fù)雜，我可以在后期單獨(dú)用小熊派出一個(gè)專題來實(shí)現(xiàn)這個(gè)過程，并進(jìn)行詳細(xì)的講解。

3、開源的GUI框架

現(xiàn)在GUI框架設(shè)計(jì)趨向于成熟，有很多大神也在Github和Gitee上開源了不少優(yōu)秀的GUI框架，經(jīng)過簡單的移植(GUI是純軟件實(shí)現(xiàn)，只要硬件支持的操作就可以套用)，我們可以擁有很多基礎(chǔ)控件，比如按鈕，進(jìn)度條，圖標(biāo)，曲線等等，其中著名的有STemWin、LVGL、TouchGFX等等，但是針對正點(diǎn)原子T100焊臺，其實(shí)只需要能夠繪制單色的GUI框架即可，對于單色的GUI框架，我們在碼云上可以輕松找到：

還有類似的：

針對單色顯示屏的 GUI 解決方案SimpleGUI

正點(diǎn)原子也有類似的產(chǎn)品，界面與T100智能焊臺類似，源代碼也是開源的，詳情可以訪問正點(diǎn)原子資料下載中心查看：

http://www.openedv.com/docs/tool/solder/solder.html

當(dāng)然，你還能搜索到更多相關(guān)的資源，通過學(xué)習(xí)這些資源你會發(fā)現(xiàn)，其實(shí)設(shè)計(jì)思想都差不多，只要掌握其中一個(gè)，了解其設(shè)計(jì)思想，相信有朝一日你也可以擼一個(gè)適合自己項(xiàng)目的GUI框架，關(guān)于菜單切換和界面實(shí)現(xiàn)，我之前也開源了一些項(xiàng)目，如下，有興趣可自行學(xué)習(xí)或研究：

談?wù)勄度胧綉?yīng)用軟件人機(jī)界面開發(fā)的菜單框架編寫

開源作品：基于RT-Thread 智慧農(nóng)業(yè)監(jiān)測系統(tǒng)產(chǎn)品級開發(fā)

TencentOS tiny危險(xiǎn)氣體探測儀產(chǎn)品級開發(fā)

基于TencentOS tiny云打印機(jī)&智能達(dá)特甲醛探測系統(tǒng)

4、開源的T12烙鐵控制器

至于具體功能，比如焊臺里PID算法是怎么處理的，功能是如何交互的，在碼云上有位大佬，這位大佬現(xiàn)在還在讀研究生，但已經(jīng)能自己通過STM32把一把烙鐵給造出來了，詳細(xì)可以訪問他的碼云參考他的設(shè)計(jì)思路：

https://gitee.com/Cai-Zi/STM32_T12_Controller?_from=gitee_search