UGUI:一个轻量级的TFTLCD彩色显示屏GUI库

目录

一、引言

二、移植说明

三、如何使用UGUI函数

2.1 UGUI函数介绍

2.2 窗口控件管理

2.3 如何建立一个按键

四、如何实现触摸控制

五、资料获取


一、引言

UGUI是一个经过精心设计的轻量级TFT-LCD彩色显示屏GUI库,旨在为用户提供高效、稳定且易于使用的图形用户界面。该库采用先进的图形处理技术,能够实现高质量的图像显示和流畅的用户交互体验。同时,UGUI还提供了丰富的组件和工具,使用户能够轻松地创建各种类型的GUI界面,满足不同应用场景的需求。

二、移植说明

开源小型GUI系统,仅需ugui.c和ugui.h两个源文件,简洁高效。

最低硬件配置要求: 

1、在开始移植之前,请确保已准备好工程模板。

2、在https://github.com/achimdoebler/UGUI上下载开源文件,将ugui.c和ugui.h加入工程中;

3、构建下面三个函数,分别是画线、填充、画点函数,画点函数是最基本的,移植UGUI必须建立此函数。请注意,确认调用三个函数可以在显示屏正常显示。

UG_RESULT _HW_DrawLine( UG_S16 x1, UG_S16 y1, UG_S16 x2, UG_S16 y2, UG_COLOR c );

UG_RESULT _HW_FillFrame( UG_S16 x1, UG_S16 y1, UG_S16 x2, UG_S16 y2, UG_COLOR c );

这两个函数跟使用平台有关,用于快速画线、填充等,有些MCU可能不带图形快速处理,此例程基于stm32f4,STM32 专门定制了DMA2D 外设,它可用于快速绘制矩形、直线、分层数据混合、数据复制以及进行图像数据格式转换,可以把它理解为图形专用的 DMA。

4、初始化UGUI和注册快速画线、填充函数,使能对应函数。

恭喜你,至此移植完成,可以开始设计自己的GUI了。

三、如何使用UGUI函数

2.1 UGUI函数介绍

所有GUI函数说明可以参考官方手册Reference Guide ugui v0.3。

UGUI框架构成:

  1. 窗口:可以绘制多个窗口;
  2. 控件:支持窗口内显示其他控件如按钮、文本框等;
  3.  事件处理:支持界面和用户交互操作,事情回调,如触摸事件等;
  4.  接口函数:提供给开发者友好的接口。

例如建立一个窗口,如下图为显示效果:

注意此时只是简单的完成window1控件定义,LCD还未显示绘制窗口,要显示窗口必须在主循环或者定时中断中调用  UG_Update()

还有就是实现窗口内控件的回调点击处理函数,如下:

2.2 窗口控件管理

窗口控件管理:你在一个窗口中需要几个空间就要定义几个空间的相关类型变量定义,其中obj_buff[]数组用于记录你这个窗口中的空间,以数组方式管理和检索这些控件;一个窗口中可以容纳N个控件,由宏开关MAX_OBJECTS控制;

窗口中所有控件管理数组的初始化

2.3 如何建立一个按键

1、首先理解按键控件的属性结构体

2、创建自己的按键控件

a、首先从控件所在的窗口的控件管理数组中获得一个空闲的object元素来管理这个将要创建的button控件,并返回对应元素地址;

UG_OBJECT* obj  = _UG_GetFreeObject( wnd );

b、初始化按键控件自身的属性;

c、初始化管理对应控件的object数据属性;

d、注意创建按键控件的最后 obj->state &= ~OBJ_STATE_FREE;表示该数组元素已被占用,这个窗口需要创建别的控件时,需要在object数组中需要另一个空闲元素;如果空间多,你可以增加数组的长度,来管理更多的控件;

e、建立了窗口中的按键控件,最后需要对控件的内容和字体进行设置。

四、如何实现触摸控制

如下代码所示,先获取触摸坐标,然后确认触摸状态为按下,调用UG_TouchUpdate更新坐标信息,然后UG_Update()里面会处理触摸信息,按下的相关控件会调用回调函数处理,例如上面描述的回调函数window_1_callback,里面有判断是哪个控件按下,然后处理对应的函数。

UG_Update()其实主要做以下几件事情:

  1. 更新窗口;
  2. 更新窗口内的控件;
  3. 更新触摸事件,检测触摸屏是否按下,如果按下,检测哪个控件区域按下;
  4. 更新事件,即得到某个控件按下,然后调用对应的回调函数;

UG_Update()内部分代码:更新以上四个事情。

_UG_HandleEvents内部分代码,查询是否有事件发生,然后将消息压入消息结构体中,然后调入回调函数。

五、资料获取

通过点击以下链接,您可以获取UGUI方案原理图、源代码以及开发资料。链接地址将为您提供详细的文件资料,以供您进行参考和使用。

如果您在使用过程中遇到任何问题或疑虑,欢迎加我QQ ,一起探讨技术问题,我的QQ号是986571840,加的时候请注明CSDN。

基于4.3寸TFTLCD的小型开源GUI - 硬创社 (jlc.com)icon-default.png?t=N7T8https://x.jlc.com/platform/detail/78b7cd2a4a7a446f9bba8700bc1ca702?type=1

感谢各位用户点赞、分享、在看,这些行为让知识得以更加广泛地传播,从而让更多人受益。

请在转载作品时注明出处,严禁抄袭行为。

  • 22
    点赞
  • 31
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

芯航路IOT

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值