[N32L43X评测]6.移植超小体积的Gui uGui

现在Lvgl非常火，但是放到类32这一部分单片机上不论是Flash还是Ram都有点捉襟见肘的感觉，但是完全自己设计gui又有点复杂，就找了一个非常小巧的uGUI框架。这个框架虽然很老了，而且作者7年前就停更了，不过用起来确实很简单，也比较容易理解。

这是uGui的Github地址：https://github.com/achimdoebler/UGUI

以及官网地址：http://embeddedlightning.com/ugui/

移植只需要以下3个函数

static UG_RESULT HW_FillFrame ( UG_S16 x1, UG_S16 y1, UG_S16 x2, UG_S16 y2, UG_COLOR c){

LCD_Fill(x1,y1,x2,y2,c);

    return UG_RESULT_OK;

}

 

static UG_RESULT HW_DrawLine ( UG_S16 x1, UG_S16 y1, UG_S16 x2, UG_S16 y2, UG_COLOR c){

LCD_DrawLine(x1,y1,x2,y2,c);

    return UG_RESULT_OK;

}

 

static void pset(UG_S16 x,UG_S16 y,UG_COLOR c){

    LCD_DrawPoint(x,y,c);

}

 

在初始化中配置好驱动

void gui_ugui_init(){   

UG_Init(&gui, pset, 240 , 240 ) ;

UG_DriverRegister( DRIVER_DRAW_LINE,  HW_DrawLine ) ;

UG_DriverRegister( DRIVER_FILL_FRAME,  HW_FillFrame ) ;

 

UG_DriverEnable ( DRIVER_DRAW_LINE ) ;

UG_DriverEnable ( DRIVER_FILL_FRAME ) ;        

}

 

在循环函数中调用UG_Update()，这里一定别忘了

 

这样移植的工作就完成了，简单吧

根据例程中的例子使用了一个window，咱们来看看效果

/* Window 1 */
UG_WINDOW window_1;
UG_OBJECT obj_buff_wnd_1[MAX_OBJECTS];
UG_BUTTON button1_1;
UG_BUTTON button1_2;
UG_BUTTON button1_3;
UG_BUTTON button1_4;
UG_BUTTON button1_5;
UG_BUTTON button1_6;

void CreateWindow(void){
	UG_FillScreen(0x0);
	/* Create Window 1 */
	UG_WindowCreate( &window_1, obj_buff_wnd_1, MAX_OBJECTS, window_1_callback );
	UG_WindowSetTitleText( &window_1, "uGUI @ N32" );
	UG_WindowSetTitleTextFont( &window_1, &FONT_12X20 );
	UG_WindowSetTitleText( &window_1, "uGUI @ N32" );
	UG_WindowSetTitleTextFont( &window_1, &FONT_12X20 );
	UG_WindowSetBackColor(&window_1,C_WHITE);
	UG_WindowShow( &window_1 );
	
	/* Create some Buttons */
	UG_ButtonCreate( &window_1, &button1_1, BTN_ID_0, 10, 10, 110, 60 );
	UG_ButtonCreate( &window_1, &button1_2, BTN_ID_1, 10, 80, 110, 130 );
	UG_ButtonCreate( &window_1, &button1_3, BTN_ID_2, 10, 150, 110,200 );
	UG_ButtonCreate( &window_1, &button1_4, BTN_ID_3, 120, 10, UG_WindowGetInnerWidth( &window_1 ) - 10 , 60 );
	UG_ButtonCreate( &window_1, &button1_5, BTN_ID_4, 120, 80, UG_WindowGetInnerWidth( &window_1 ) - 10, 130 );
	UG_ButtonCreate( &window_1, &button1_6, BTN_ID_5, 120, 150, UG_WindowGetInnerWidth( &window_1 ) - 10, 200 );

	/* Configure Button 1 */
	UG_ButtonSetFont( &window_1, BTN_ID_0, &FONT_12X20 );
	UG_ButtonSetBackColor( &window_1, BTN_ID_0, C_LIME );
	UG_ButtonSetText( &window_1, BTN_ID_0, "Green\nLED" );
	/* Configure Button 2 */
	UG_ButtonSetFont( &window_1, BTN_ID_1, &FONT_12X20 );
	UG_ButtonSetBackColor( &window_1, BTN_ID_1, C_RED );
	UG_ButtonSetText( &window_1, BTN_ID_1, "Red\nLED" );
	/* Configure Button 3 */
	UG_ButtonSetFont( &window_1, BTN_ID_2, &FONT_12X20 );
	UG_ButtonSetText( &window_1, BTN_ID_2, "About\n?GUI" );
	UG_WindowShow( &window_1 );
	/* Configure Button 4 */
	UG_ButtonSetFont( &window_1, BTN_ID_3, &FONT_12X20 );
	UG_ButtonSetForeColor( &window_1, BTN_ID_3, C_RED );
         UG_ButtonSetBackColor( &window_1, BTN_ID_3, C_BLUE );
	UG_ButtonSetText( &window_1, BTN_ID_3, "HW_ACC\nOFF" );
	/* Configure Button 5 */
	UG_ButtonSetFont( &window_1, BTN_ID_4, &FONT_8X14 );
	UG_ButtonSetText( &window_1, BTN_ID_4, "Start\nBenchmark" );
	/* Configure Button 6 */
	UG_ButtonSetFont( &window_1, BTN_ID_5, &FONT_10X16 );
	UG_ButtonSetText( &window_1, BTN_ID_5, "Resize\nWindow" );
	
	UG_WindowShow( &window_1 );
}

 

这个uGUI也支持触摸操作，不过我这用不上就不研究了，说实话如果用触摸的话资源应该就不紧张了，直接用Lvgl比较合适

 

这是O0级别编译的体积

 

以及Oz级别

 

这样使用64KFlash的单片机基本就能满足UI部分的需要了

本文来自论坛，点击查看完整帖子内容。