U8g2图形库使用技巧记录（3）

已于 2023-07-08 10:52:46 修改
阅读量1.1k 收藏 3
点赞数 3
分类专栏： 电子DIY技术分享 文章标签： c语言 嵌入式硬件 mcu
于 2023-04-18 21:57:44 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq893974195/article/details/130231591
版权

~滴答滴答，瓦力的身体已经基本完成，是时候给它注入灵魂了~

        停了蛮久的没有更新U8g2图形库的系列博客了，最近又加了一点小功能，在这里记录一下，同时把自己的一些经验分享给大家，本次功能硬件实现是使用了Tlite RC遥控和U8g2 UI页面显示实现在线调节系统参数的功能(可以实现对正负7位整数或者最高万位带两位小数的浮点型数据进行修改编辑)，所用到的硬件如下：

（脑壳子裸露的瓦力。。。力，，，力 ）

（这是瓦力隔壁家的小弟弟，暂时叫它“初一” ）

        整点小视频来看看~~        

（为了让你们看清楚，我自觉躺平了~~~ ） 

        本次功能软件实现都是基于U8g2原有的u8g2_UserInterfaceInputValue()函数实现，具体实现代码如下：

uint8_t u8g2_UserInterfaceInputValue(u8g2_t *u8g2, const char *title, const char *pre, float *value, uint8_t type, uint8_t digits, const char *post)
{
  uint8_t line_height;
  uint8_t height;
  u8g2_uint_t pixel_height;
  u8g2_uint_t  y, yy;
  u8g2_uint_t  pixel_width;
  u8g2_uint_t  x, xx;

  int32_t lo = -9999999; 
  int32_t hi = 9999999;

  int32_t local_value = 0;

  if (type == MAV_PARAM_TYPE_REAL32)
  	local_value = *((float *)value)*pow(10, DOT_INDEX);
  else
  	local_value = *((int32_t *)value);
  
  u8g2_int_t digit_index = 0;
  //uint8_t r; /* not used ??? */
  uint8_t event;

  /* only horizontal strings are supported, so force this here */
  u8g2_SetFontDirection(u8g2, 0);

  /* force baseline position */
  u8g2_SetFontPosBaseline(u8g2);
  
  /* calculate line height */
  line_height = u8g2_GetAscent(u8g2);
  line_height -= u8g2_GetDescent(u8g2);
  
  
  /* calculate overall height of the input value box */
  height = 1;	/* value input line */
  height += u8x8_GetStringLineCnt(title);

  /* calculate the height in pixel */
  pixel_height = height;
  pixel_height *= line_height;


  /* calculate offset from top */
  y = 0;
  if ( pixel_height < u8g2_GetDisplayHeight(u8g2)  )
  {
    y = u8g2_GetDisplayHeight(u8g2);
    y -= pixel_height;
    y /= 2;
  }

  /* calculate offset from left for the label */
  x = 0;
  
  pixel_width = u8g2_GetUTF8Width(u8g2, pre); 
  //pixel_width += u8g2_GetUTF8Width(u8g2, "0") * digits;
  if (type == MAV_PARAM_TYPE_REAL32)
  	pixel_width += u8g2_GetUTF8Width(u8g2, "0") * DIGIT_LEN+1;
  else
  	pixel_width += u8g2_GetUTF8Width(u8g2, "0") * DIGIT_LEN;	
  pixel_width += u8g2_GetUTF8Width(u8g2, post);
  
  if ( pixel_width < u8g2_GetDisplayWidth(u8g2) )
  {
    x = u8g2_GetDisplayWidth(u8g2);
    x -= pixel_width;
    x /= 2;
  }
  
  /* event loop */
  for(;;)
  {
    u8g2_FirstPage(u8g2);
    do
    {
      /* render */
      yy = y;
      yy += u8g2_DrawUTF8Lines(u8g2, 0, yy, u8g2_GetDisplayWidth(u8g2), line_height, title);
      xx = x;
      xx += u8g2_DrawUTF8(u8g2, xx, yy, pre);

	  if (type == MAV_PARAM_TYPE_REAL32)
	  {
	  	if (digit_index>=DOT_INDEX)
			xx += u8g2_DrawUTF8Inv(u8g2, xx, yy, u8x8_floattoa(local_value, DOT_INDEX), DIGIT_LEN-digit_index);
		else			
	  		xx += u8g2_DrawUTF8Inv(u8g2, xx, yy, u8x8_floattoa(local_value, DOT_INDEX), DIGIT_LEN+1-digit_index);
	  }
	  else
	  	xx += u8g2_DrawUTF8Inv(u8g2, xx, yy, u8x8_int32toa(local_value), DIGIT_LEN-digit_index);
	  
      u8g2_DrawUTF8(u8g2, xx, yy, post);
    } while( u8g2_NextPage(u8g2) );
    
#ifdef U8G2_REF_MAN_PIC
      return 0;
#endif
    
    for(;;)
    {
      event = u8x8_GetMenuEvent(u8g2_GetU8x8(u8g2));
      if ( event == U8X8_MSG_GPIO_MENU_SELECT )
      {
		if (type == MAV_PARAM_TYPE_REAL32)
		{
		  *((float *)value) = local_value/pow(10, DOT_INDEX);
		  ESP_LOGI(TAG, "value=%f", *((float *)value));
		}
		else
		{
		  *((uint32_t *)value) = local_value;
		  ESP_LOGI(TAG, "value=%d", *((uint32_t *)value));
		}

		return 1;
      }
      else if ( event == U8X8_MSG_GPIO_MENU_HOME )
      {
		return 0;
      }
	  else if ( event == U8X8_MSG_GPIO_MENU_NEXT)
	  {
		if ( digit_index < (DIGIT_LEN-1) )
		  digit_index++;
		else
		  digit_index = 0;
		
		break;
	  }
	  else if ( event == U8X8_MSG_GPIO_MENU_PREV)
	  {
		if ( digit_index > 0 ) 
		  digit_index--;
		else
		  digit_index = (DIGIT_LEN-1);
		
		break;
	  }
      else if ( event == U8X8_MSG_GPIO_MENU_UP )
      {
      	#if 0
		if ( local_value >= hi )
		  local_value = lo;
		else
		  local_value++;
		#else
		if ( digit_index == (DIGIT_LEN-1) )
		{
			local_value = -local_value;
		}
		else
		{
			local_value += pow(10, digit_index);
			if ( local_value > hi )
			  local_value = hi;
		}
		#endif

		if (type == MAV_PARAM_TYPE_REAL32)
		{
		  *((float *)value) = local_value/pow(10, DOT_INDEX);
		  ESP_LOGI(TAG, "value=%f", *((float *)value));
		}
		else
		{
		  *((uint32_t *)value) = local_value;
		  ESP_LOGI(TAG, "value=%d", *((uint32_t *)value));
		}

		break;
      }
      else if ( event == U8X8_MSG_GPIO_MENU_DOWN )
      {
		#if 0
		if ( local_value <= lo )
		  local_value = hi;
		else
		  local_value--;
		#else
		if ( digit_index == (DIGIT_LEN-1) )
		{
			local_value = -local_value;
		}
		else
		{
			local_value -= pow(10, digit_index);
			if ( local_value < lo )
			  local_value = lo;
		}
		#endif
		
		if (type == MAV_PARAM_TYPE_REAL32)
		{
		  *((float *)value) = local_value/pow(10, DOT_INDEX);
		  ESP_LOGI(TAG, "value=%f", *((float *)value));
		}
		else
		{
		  *((uint32_t *)value) = local_value;
		  ESP_LOGI(TAG, "value=%d", *((uint32_t *)value));
		}

		break;
      }        
    }
  }
  
  /* never reached */
  //return r;  
}

以下是一些和本文相关的文章链接和U8g2的wiki链接：

一、~~呆萌的瓦力平衡机器人~~链接：

        1.基于ESP32双无刷FOC电机的瓦力平衡机器人（1）；

        2.基于ESP32双无刷FOC电机的瓦力平衡机器人（2）；

二、 ~~U8g2图形库使用技巧记录~~链接：

        1.U8g2图形库使用技巧记录（1）；

        2.U8g2图形库使用技巧记录（2）；

        3.U8g2图形库使用技巧记录（3）；

三、U8g2 wiki链接：

        1.U8g2_wiki；

下一步计划：
        ~~现阶段已经实现了实用的参数编辑功能，同时平衡车的基本功能也大致完成，后续就可以整些花活了，目前刷新的帧率还可以，下一步可以考虑加入一些机器人的动画表情了，是的，要做个有表情的呆萌平衡机器人了~~

                     大家如果也感兴趣，可以加qun交流学习（群里提供了丰富的esp32资料）：

                               

                                                            燃起来吧 ！！！！！！
 

TL_gone
关注
  • 3
    点赞
  • 踩
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
U8g2 图形库必备！试试这几个即时生效的界面工具
arenascat的博客
10-04 3619
使用这个在线模拟器，你可以非常容易地去调试你的界面生成的代码，这个代码可以非常快地在左上角的那边看到，并且还可以甚至放大的程度 在屏幕支持上面，除了常见的12864尺寸OLED还有12832和128128，且这一个工具可以快速支持电子纸，最常见的2.13那种 另外里面的例子也可以参考一下，特别是在没有什么想法的时候，一些元件的绘制我觉得不错。 ...
arduino OLED显示温度 ，二氧化碳，和空气质量，使用u8g2库
weixin_45345982的博客
02-15 7013
材料 arduino nano一个 MQ-2传感器一个 18B20传感器一个 OLED屏幕一个 若干杜邦线 成品是这个样子 引脚 18B20 <–> A6 SCL <–> A5 SDA <–> A4 A0 <–> A3 D0 <–> A2 vcc和gnd跳线接电源和地线 需要引用DallasTemperature库、...
【STM32学习】基于I2C协议的OLED显示(利用U8G2库)
最新发布
2301_78895982的博客
06-24 759
这次的博客主要了解学习了I2C协议和时序协议，移植修改u8g2代码，利用u8g2库实现界面可视化技术，让嵌入式学习变得可视化，变得精彩。
u8g2图像库c语言函数
knaicooo的博客
05-08 2560
u8g2图像库移植到stm32上的一些函数介绍（c语言）
【arduino】（u8g2最基础使用）mega2560 使用SH1106 OLED显示字符串，整数，浮点数，中文
域名baixiao.blog.csdn.net
05-17 6491
. . 参考：【u8g2库字体问题：修改字体+中文字体支持-哔哩哔哩】 下载安装库： 打开arduino库管理 u8g2，找到u8g2，点击安装 查看例程： 选择对应型号的驱动，将注释去掉，我用的是SH1106，这里的接线需要接默认的才可以 下面个人的例子会讲到如何设置自己的接线 个人例子：显示字符串，数字，中文。 #include <Arduino.h> #include <U8g2lib.h> #include <Wire.h...
U8g2图形库使用技巧记录（4）
、的博客
07-08 1503
一个很优雅的UI框架
U8g2 驱动oled自定义中文字库
acktomas的博客
08-09 7298
我们在项目中大概率会遇到LED显示中文的需求，而通过汉字取模一个一个的定义中文字，不仅会增加程序编译后占用的存储空间，造成稀缺硬件资源的浪费，而且这种方式对编码的灵活性也不够友好。本文将介绍如何使用U8g2自带的工具，将项目中常用的汉字定义成自己的汉字库，编码时直接使用方法实现。本文参考了其他网友的内容，但是他们大都是替换到u8g2中现有的字体类型，这会破坏掉u8g2库的完整性。本文将介绍如何定义自己的u8g2Font类型，而不是替换现有的。
U8g2图形显示库及实例演示
05-28
U8g2是嵌入式设备的单色图形库，一句话简单明了。主要应用于嵌入式设备，包括我们常见的单片机；U8g2支持单色OLED和LCD，包括以下控制器：SSD1305，SSD1306，SSD1309，SSD1322，SSD1325，SSD1327，SSD1329，SSD1606...
STM32F407标准库+U8g2图形库，0.96寸OLED驱动
07-02
U8g2图形库的优点是可以使用多种字体，支持中文显示，提供丰富的图形程序，如线条，框，圆，位图等。U8g2图形库的缺点是需要占用一定的内存空间，速度较慢，不支持无控制器的显示屏。U8g2图形库的应用场景有：显示...
linux系统中自制u8g2中文库方法
03-18
u8g2是一个用于微控制器的开源C语言图形库，支持多种显示控制器，如SSD1306、SH1106等，广泛应用于小型嵌入式设备上的图形显示，包括字符和图像。这个库提供了丰富的API，可以方便地绘制文本、图形和基本的UI元素。...
u8g2-OLED图形库
03-14
U8g2是一个高度优化且功能强大的图形库，专为使用单色 OLED（有机发光二极管）显示屏的嵌入式系统设计。这个库广泛应用于各种微控制器平台，如Arduino、ESP8266、ESP32等，它提供了丰富的图形操作函数，使得在小巧的...
U8g2单色图形库源码
11-16
U8g2是嵌入式设备的单色图形库。主要应用于嵌入式设备，包括我们常见的单片机使用，最常用的是OLED屏或者LCD屏进行使用的一个库；  U8g2支持单色OLED和LCD，包括以下控制器：SSD1305，SSD1306，SSD1309，SSD1322，...
U8g2图形库使用技巧记录（2）
、的博客
09-12 5966
~恍恍惚惚中，感觉瓦力已经慢慢悠悠的向我走来，看了他的孤独，感觉自己的也就不算什么了~ 前言 这一次和大家分享一下怎么使用U8g2的图形库把瓦力搬到自己的屏幕上显示，通过下面三张图，我们可以把这个实现分为三个步骤进行： 一.选图---> 二.取模---> 三.显示---> 第一步选图： 其实就是收集选取你想要显示在屏幕上的图片，保存下来后通过图片编辑器对...
U8g2图形库使用技巧记录（1）
、的博客
09-05 1万+
~~呆萌的瓦力平衡机器人~~的显示UI我希望做得精致一些 所以寻觅了好久，最终寻来了u8g2这款精巧的图形库，这款ui图形库可以算得上是图形库里面的瑞士小军????，深得吾爱，所以该系列的文章既是我筛选图形库过程的心路历程，也是在选中u8g2这款图形库后的一些开发记录； u8g2 图形库简介： 1.U8g2 是用于嵌入式设备的单色图形库。 支持显示控制器：SSD1305、SSD1306、SSD1309、SSD1316、SSD1322、SSD1325、SSD1327、SSD1329、SSD1606、 S
移植U8g2图形库—驱动OLED显示(模拟IIC)
qq_26043945的博客
08-26 1014
本篇，介绍一下U8g2库如何移植到STM32上，进行OLED的图形显示，本实验使用的OLED-0.96寸(SSD1306)作为驱动显示屏。
u8g2图形库——丝滑菜单制作
weixin_63780683的博客
11-24 1697
u8g2图形库——丝滑菜单制作。
NodeMCU 之 U8G2 库使用详解
perseverance51博客
01-25 8936
NodeMCU 之 U8G2 库使用详解
u8g2库常用函数
Archer的博客
08-09 1万+
转自：https://www.cnblogs.com/loadbxh/articles/12074549.html 如有侵权，请联系我删除。 1.指令 u8g2.clearDisplay(); // 清除显示数据及屏幕 u8g2.clearBuffer(); // 清Buffer缓冲区的数据 u8g2.sendBuffer(); // 将Buffer帧缓冲区的内容发送到显示器,发送刷新消息 u8g2.sendF("c", 0x0a7); // 向显示控制器发送特殊命令 u8g2.se
【arduino】【u8g2库】OLED屏-U8glib库 增强版 U8G2库
热门推荐
g1fdgfgdf2_的博客
12-14 5万+
转载请注明:  冬菇不败   及出处 ：http://www.arduino.cn/thread-41193-1-1.html 以下的函数描述是源自原文：https://github.com/olikraus/u8g2/wiki/u8g2reference#begin 自己再通过测试后才发布，采用一个更新方式（精力有限，学习为主），客官觉得不错，就打赏一下呗~ U8G2是U8GLIB的增强版
u8g2库的使用stm32
07-27
您好！关于u8g2库在STM32上的使用，以下是一般的步骤： 1. 首先，确保您的STM32开发板已连接到您的计算机，并且您已经安装了适当的开发环境（如Keil、STM32CubeIDE等）。 2. 下载u8g2库的最新版本，可以从u8g2官方网站（https://github.com/olikraus/u8g2）上找到源代码。 3. 将下载的库文件解压缩，并将u8g2文件夹复制到您的项目目录中。 4. 打开您的开发环境，并创建一个新的STM32项目。 5. 在您的项目中包含u8g2库的头文件。根据您的开发环境不同，可能有不同的方法。例如，在Keil中，您可以通过右键单击项目->Options for Target->C/C++选项卡->Include Paths and Symbols来添加路径。 6. 在您的代码中，使用合适的接口初始化u8g2库。根据您使用的显示设备类型（如OLED、LCD等），选择适当的初始化函数。例如，如果您使用I2C接口的OLED显示屏，可以使用以下代码进行初始化： ```c #include "u8g2.h" u8g2_t u8g2; void u8g2_init(void) { u8g2_Setup_ssd1306_i2c_128x64_noname_f(&u8g2, U8G2_R0, u8x8_byte_sw_i2c, u8x8_gpio_and_delay_stm32cube_hal); u8x8_SetI2CAddress(&u8g2.u8x8, 0x78); u8g2_InitDisplay(&u8g2); u8g2_SetPowerSave(&u8g2, 0); } ``` 7. 使用u8g2库提供的函数来控制显示设备。例如，您可以使用以下代码在屏幕上绘制文本： ```c u8g2_DrawStr(&u8g2, 0, 10, "Hello, World!"); u8g2_SendBuffer(&u8g2); ``` 这是一个简单的示例，演示了如何在STM32上使用u8g2库。您可以根据自己的需求使用其他u8g2库的功能和函数来绘制图形、显示图像等。 希望这可以帮助到您！如有其他问题，请随时提问。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值