實(shí)戰(zhàn)貼:開源GUI STemWin在小熊派上的移植(顯示很漂亮、很細(xì)膩，棒！)
開篇前來一首歌放松一下，推薦簡弘亦的新歌：忽如一面，妥妥的歌唱實(shí)力派，可是不知道為啥感覺一直不溫不火，我是聽了他的不染喜歡上的，好了，進(jìn)入正題。
現(xiàn)在市面上有很多成熟的GUI，老早前就聽說過STemWin了，一直想學(xué)習(xí)怎么用，但一直又覺得沒地方可用，現(xiàn)在手上平臺(tái)很多(人送外號(hào)：最不缺錢且燒錢的玩家)，只要有時(shí)間，還是要把它搞起來！畢竟多掌握一門技能那肯定有好處的。
關(guān)于GUI的移植，之前也在小熊派上分享過一些別的GUI的教程，文章鏈接如下：
實(shí)戰(zhàn)貼:開源GUI LittlevGL在MCU上的移植
MCU SPI屏也能跑這么炫酷的特效？來，移植起來秀一秀
廢話不多說，先上效果圖：
該Demo用GUIBuilder工具畫了一個(gè)Listview的控件以及三個(gè)Text控件以及一個(gè)Image控件，最后保存生成代碼拷貝到Keil MDK后編譯下載到小熊派上運(yùn)行。
1、STemWin簡介
STemWin是SEGGER公司授權(quán)給意法半導(dǎo)體(ST)公司，使用ST芯片的用戶可免費(fèi)使用STemWin，關(guān)于STemWin的顯示效果，有興趣的可自行百度搜索查看。
1.1 下載并熟悉官網(wǎng)最新版本的STemWin
解壓后得到以下目錄，移植STemWin最主要關(guān)心的是Libraies目錄下的與STemWin相關(guān)的庫文件，其它的多數(shù)是ST官網(wǎng)的一些Demo例程，暫時(shí)用不著，如下圖所示：
簡單介紹下以下幾個(gè)目錄：
2、小熊派移植STemWin
2.1 移植STemWin到小熊派
2.1.1 添加STemWin軟件包到帶LCD的基礎(chǔ)工程
首先需要一個(gè)源碼工程，這個(gè)直接從小熊派源碼包拿就行了，不需要重新去寫，我們本次移植的是不帶操作系統(tǒng)的。
解壓，然后在工程目錄下創(chuàng)建兩個(gè)和STemWin相關(guān)的目錄：
將1.1下載的STemWin軟件包整個(gè)拷貝到STemWin這個(gè)目錄下。
2.1.2 添加STemWin相關(guān)庫及文件到Keil MDK
以下文件添加模板參考了正點(diǎn)原子的STM32F429 EMWIN開發(fā)手冊(cè):
這個(gè)app.c用來存放GUIBuilder軟件生成的代碼，最后通過調(diào)用STemWin的CreateWindow函數(shù)來展示界面。
注意：正點(diǎn)原子的STemWin版本可能比較老，當(dāng)前該版本所有的GUI讀點(diǎn)、畫點(diǎn)等函數(shù)配置只需要在LCDConf_FlexColor_Template.c下就可以完成了，不需要GUIDRV_Template.c這個(gè)文件，正點(diǎn)原子的教程和我現(xiàn)在下的最新版本移植還有些區(qū)別，僅供參考。
2.1.3 修改STemWin所需要的內(nèi)存空間
位于GUIConf.c文件：
#define GUI_NUMBYTES (16*1024)//0x200000 //設(shè)置EMWIN內(nèi)存大小
注意：如果該參數(shù)設(shè)置太大的話Keil會(huì)報(bào)空間不夠的錯(cuò)誤，這里我們根據(jù)需求，將其設(shè)置為16*1024即可，它分配的其實(shí)是一塊靜態(tài)連續(xù)的內(nèi)存空間：
2.1.4 配置LCD及STemWin相關(guān)
位于LCDConf_FlexColor_Template.c文件:
在這個(gè)文件中，我們需要包含LCD驅(qū)動(dòng)文件，小熊派已經(jīng)實(shí)現(xiàn)好了，我們直接拿過來用就行了。
#inlcude "lcd.h"
注意lcd.h中并沒有寫命令和寫數(shù)據(jù)的函數(shù)聲明，這里我們需要將lcd.c修改一下，然后在lcd.h導(dǎo)出這兩個(gè)函數(shù)，才能給LCDConf_FlexColor_Template.c使用。
(1)修改LCD顯示分辨率
//更改顯示分辨率
#define XSIZE_PHYS 240 // To be adapted to x-screen size
#define YSIZE_PHYS 240 // To be adapted to y-screen size
(2)實(shí)現(xiàn)寫指令、寫數(shù)據(jù)、寫多個(gè)數(shù)據(jù)、讀多個(gè)數(shù)據(jù)接口
注意，官方給的模板默認(rèn)是一次2個(gè)字節(jié)的寫入，而小熊派LCD是SPI OLED(ST7789)，實(shí)現(xiàn)的接口是一次只寫1個(gè)字節(jié)的數(shù)據(jù)，所以我們要將接口改成1個(gè)字節(jié)的寫入，否則顯示會(huì)有問題。
/********************************************************************
*
* LcdWriteReg 寫寄存器
*
* Function description:
* Sets display register
*/
static void LcdWriteReg(U8 Data)
{
// ... TBD by user
LCD_Write_Cmd(Data);
}
/********************************************************************
*
* LcdWriteData 寫數(shù)據(jù)
*
* Function description:
* Writes a value to a display register
*/
static void LcdWriteData(U8 Data)
{
// ... TBD by user
LCD_Write_Data(Data);
}
/********************************************************************
*
* LcdWriteDataMultiple 寫多個(gè)數(shù)據(jù)
*
* Function description:
* Writes multiple values to a display register.
*/
static void LcdWriteDataMultiple(U8 * pData, int NumItems)
{
while (NumItems--)
{
// ... TBD by user
LCD_Write_Data(*pData++);
}
}
/********************************************************************
*
* LcdReadDataMultiple 讀多個(gè)點(diǎn)
*
* Function description:
* Reads multiple values from a display register.
*/
static void LcdReadDataMultiple(U8 * pData, int NumItems)
{
while (NumItems--)
{
// ... TBD by user
//沒有讀點(diǎn)函數(shù)，留空
}
}(3)修改LCD_X_Config函數(shù)
void LCD_X_Config(void)
{
GUI_DEVICE * pDevice;
CONFIG_FLEXCOLOR Config = {0};
GUI_PORT_API PortAPI = {0};
// Set display driver and color conversion
pDevice = GUI_DEVICE_CreateAndLink(GUIDRV_FLEXCOLOR, GUICC_M565, 0, 0);
// Display driver configuration, required for Lin-driver
LCD_SetSizeEx (0, XSIZE_PHYS, YSIZE_PHYS);
LCD_SetVSizeEx(0, VXSIZE_PHYS, VYSIZE_PHYS);
// Orientation
//Config.Orientation = GUI_SWAP_XY | GUI_MIRROR_Y;
Config.Orientation = 0 ;
Config.NumDummyReads = 2;
GUIDRV_FlexColor_Config(pDevice, &Config);
// Set controller and operation mode
PortAPI.pfWrite8_A0 = LcdWriteReg;
PortAPI.pfWrite8_A1 = LcdWriteData;
PortAPI.pfWriteM8_A1 = LcdWriteDataMultiple;
PortAPI.pfReadM8_A1 = LcdReadDataMultiple;
//ST7789為GUIDRV_FLEXCOLOR_F66709
GUIDRV_FlexColor_SetFunc(pDevice, &PortAPI, GUIDRV_FLEXCOLOR_F66709, GUIDRV_FLEXCOLOR_M16C0B8);
}
那么這些參數(shù)具體是怎么適配的呢？詳情請(qǐng)看STemWin手冊(cè)參數(shù)配置部分的說明，手冊(cè)講得相當(dāng)詳細(xì)，這里就不再多解釋了。
(4)添加LCD初始化函數(shù)
int LCD_X_DisplayDriver(unsigned LayerIndex, unsigned Cmd, void * pData)
{
int r;
(void) LayerIndex;
(void) pData;
switch (Cmd)
{
case LCD_X_INITCONTROLLER:
{
//
// Called during the initialization process in order to set up the
// display controller and put it into operation. If the display
// controller is not initialized by any external routine this needs
// to be adapted by the customer...
//
// ...
//調(diào)用LCD初始化
LCD_Init();
return 0;
}
default:
r = -1;
}
return r;
}
(5)添加時(shí)基觸發(fā)
這里我們直接將該變量添加到STM32自帶的SysTick回調(diào)函數(shù)里就可以了，如下所示：
位于:stm32l4xx_it.c
/**
* @brief This function handles System tick timer.
*/
void SysTick_Handler(void)
{
/* USER CODE BEGIN SysTick_IRQn 0 */
#include "GUI.h"
extern volatile GUI_TIMER_TIME OS_TimeMS;
++OS_TimeMS ;
/* USER CODE END SysTick_IRQn 0 */
HAL_IncTick();
HAL_SYSTICK_IRQHandler();
/* USER CODE BEGIN SysTick_IRQn 1 */
/* USER CODE END SysTick_IRQn 1 */
}
添加完時(shí)基以后，需要在主循環(huán)中循環(huán)調(diào)用GUI_Delay()函數(shù)，為什么呢？官方文檔有相應(yīng)的描述：
到這里，STemWin在小熊派上的移植工作就基本結(jié)束了，接下來直接編寫例程。
3、編寫Demo驗(yàn)證
3.1 使用GUIBuilder畫界面
這個(gè)工具在使用的時(shí)候需要注意，在執(zhí)行該軟件前先把配置文件刪除。
為什么呢？我們打開這個(gè)配置文件看看就清楚了：
注意：這個(gè)配置文件里填的是Software目錄的絕對(duì)路徑，但這個(gè)軟件沒那么智能，換個(gè)地方打開GUIBuilder它還不更新?。?！這會(huì)導(dǎo)致軟件沒法用！?。∷杂眠@個(gè)工具前記得把它刪了，反正重新打開它還會(huì)繼續(xù)生成，這時(shí)候的路徑才是正確的。
打開軟件后，繪制界面如下：
繪制完畢后Ctrl+S保存，這時(shí)候會(huì)自動(dòng)生成代碼邏輯，就在當(dāng)前路徑下的WindowDLG.c中。
3.2 添加軟件生成的代碼到工程中
接下來我們打開這個(gè)程序，將所有代碼復(fù)制到app.c中。
在.h文件中導(dǎo)出CreateWindow函數(shù)，該函數(shù)就是剛剛畫的那個(gè)頁面的實(shí)現(xiàn)流程，詳情請(qǐng)分析app.c里的源代碼。
3.3 在主函數(shù)中添加代碼邏輯
包含頭文件:
#include "GUI.h"
#include "app.h"
主函數(shù)：
int main(void)
{
/* USER CODE BEGIN 1 */
/* USER CODE END 1 */
/* MCU Configuration----------------------------------------------------------*/
/* Reset of all peripherals, Initializes the Flash interface and the Systick. */
HAL_Init();
/* USER CODE BEGIN Init */
/* USER CODE END Init */
/* Configure the system clock */
SystemClock_Config();
/* USER CODE BEGIN SysInit */
/* USER CODE END SysInit */
/* Initialize all configured peripherals */
MX_GPIO_Init();
MX_SPI2_Init();
MX_USART1_UART_Init();
/* USER CODE BEGIN 2 */
//打開CRC
__HAL_RCC_CRC_CLK_ENABLE();
//初始化STemWin
GUI_Init();
//調(diào)用CreateWindow
CreateWindow();
/* USER CODE END 2 */
/* Infinite loop */
/* USER CODE BEGIN WHILE */
while (1)
{
/* USER CODE END WHILE */
/* USER CODE BEGIN 3 */
GUI_Delay(1);
}
/* USER CODE END 3 */
}
編譯下載后運(yùn)行結(jié)果：
關(guān)于STemWin要學(xué)習(xí)的東西還有很多，就安富萊和正點(diǎn)原子的學(xué)習(xí)手冊(cè)幾千頁就已經(jīng)夠?qū)W習(xí)很久了，我也打算以它為主要學(xué)習(xí)目標(biāo)，深入學(xué)習(xí)，后續(xù)做出一些好看的樣例再繼續(xù)分享。
4、案例下載
公眾號(hào)后臺(tái)回復(fù)：STemWin 即可獲取本節(jié)案例的下載鏈接。
往期精彩
MCU SPI屏也能跑這么炫酷的特效？來，移植起來秀一秀
代碼寫得很牛逼但UI界面卻搞得很丑？來，楊工帶你！
MCU串口命令解析器的實(shí)現(xiàn)
實(shí)戰(zhàn)貼:開源GUI LittlevGL在MCU上的移植
覺得本次分享的文章對(duì)您有幫助，隨手點(diǎn)[在看]并轉(zhuǎn)發(fā)分享，也是對(duì)我的支持。
免責(zé)聲明：本文內(nèi)容由21ic獲得授權(quán)后發(fā)布，版權(quán)歸原作者所有，本平臺(tái)僅提供信息存儲(chǔ)服務(wù)。文章僅代表作者個(gè)人觀點(diǎn)，不代表本平臺(tái)立場，如有問題，請(qǐng)聯(lián)系我們，謝謝！
下載文檔
