发新帖本帖赏金 50.00元(功能说明)我要提问
返回列表

[IDE] TinyML研究和学习的小精灵 之二

[复制链接]
32385|9
手机看帖
扫描二维码
随时随地手机跟帖
jinglixixi|  楼主 | 2021-7-17 21:19 | 显示全部楼层 |阅读模式
本帖最后由 jinglixixi 于 2021-7-20 16:12 编辑

#申请原创#

上次我们介绍了Wio终端的优异性能及简单的使用方法,这次我们看一下Wio终端的强大显示功能,并了解图形函数的使用方法。
1.出色的显示功能
在Wio终端上,最大的器件要数TFT显示屏了,其实在例程的数量上显示屏也是占首位的,参见图1所示。
1.jpg
图1 显示屏示例
下面我们就领略一下它的特色,看看在设计界面方面它能为我们带来哪些帮助。
1)字体丰富
Wio终端提供了丰富的字体支持,其字体显示效果如图2所示。
2.jpg
图2字体效果
2)旋转显示
在界面设计上,因应用的需要往往会选择屏幕的使用方向,相应的显示内容也会产生改变。在手机的设计上,更是引入了力传感器,让手机能在旋转时来改变内容的方向,Wio终端也同样也随意的变换显示方向,参见图3所示。
3.jpg
图3旋转显示
3)图表效果
统计图表是一种常用的文档形式,在Wio终端也也依然能够实现,如圆饼图及分栏表格等,其显示如图4所示。
4.jpg
图4图表效果
4)时钟效果
在时间计时器的情况下,在Wio终端可以很容易地实现2种形式的电子时钟计时,其形式如图5所示。
5.jpg
图5计时效果
5)复杂曲线
借助图形函数和强大计算能力的支持,结合曲线函数的使用,在Wio终端能绘制出复杂而美丽的曲线图形。
6.jpg
图6曲线绘制
6)指针表盘
在工控领域,离不开各式各样的仪表,其中指针式仪表是一种表现起来直观,但又相对复杂的样式,在Wio终端它依然能完美地展现在入门眼前,见图7所示。
7.jpg
图7表针指示
7)特效纷呈
除了以上常规表现形式,在Wio终端还能展现出在艺术片上所呈现特效制作,图8就是其达到效果。
8.jpg
图8特效
8)其它效果
尽管介绍了怎么多,但依然有没能归类的显示效果,如图9是一个展示物体在屏幕边缘进行弹射的游戏效果,而图10则是通过计算所绘制出的图案。
9.jpg
图9弹射游戏
10.jpg
图10图案绘制
有了这些例程为模板,再遇到同样的设计问题了,在此基础上只需添加上你的内容即可快速、轻松地解决。
2. 库的加载
要使用TFT屏的显示函数,需有相应库的支持,访问该链接Seeed_Arduino_LCD,即可从中下载到Seeed_Arduino_LCD-master.zip。
11.jpg
图11 下载库文件
然后按图2和图3所示来添加下载的库文件,再按图4所示添加“Adafruit Zero DMA”。
12.jpg
图12 添加库文件
13.jpg
图13 选取添加内容
14.jpg
图14 添加“Adafruit Zero DMA”
15.jpg
图15 完成添加
在此,就完成了使用TFT屏显示的准备工作。
3. 显示屏与色彩模式
Wio终端所用的显示屏是一块2.4英寸的显示屏,以ILI9341为驱动芯片,屏幕的解析度为320*240像素点,坐标系统是按图16来设置,其中水平方向是x轴,垂直方向是y轴,左上是坐标的原点x=0,y=0。
16.jpg
图16 坐标系统
显示屏采用8位和16位色彩模式来显示色彩,其中RGB3色所占的位宽各有不同。
在8位色彩模式下,各位的含义为:
16a.jpg

在16位色彩模式下,各位的含义为:
16b.jpg
为了便于使用,常用的16位色彩定义为:
#define TFT_BLACK 0x0000     /* 0, 0, 0 */
#define TFT_NAVY 0x000F      /* 0,0, 128 */
#define TFT_DARKGREEN 0x03E0 /* 0, 128, 0 */
#define TFT_DARKCYAN 0x03EF  /* 0,128, 128 */
#define TFT_MAROON 0x7800   /* 128,0, 0 */
#define TFT_PURPLE 0x780F     /* 128, 0, 128 */
#define TFT_OLIVE 0x7BE0      /* 128,128, 0 */
#define TFT_LIGHTGREY 0xC618  /*192, 192, 192 */
#define TFT_DARKGREY 0x7BEF   /* 128, 128, 128 */
#define TFT_BLUE 0x001F       /* 0, 0, 255 */
#define TFT_GREEN 0x07E0      /* 0, 255, 0 */
#define TFT_CYAN 0x07FF       /* 0,255, 255 */
#define TFT_RED 0xF800        /* 255,0, 0 */
#define TFT_MAGENTA 0xF81F   /* 255, 0, 255 */
#define TFT_YELLOW 0xFFE0     /* 255,255, 0 */
#define TFT_WHITE 0xFFFF      /* 255, 255, 255 */
#define TFT_ORANGE 0xFDA0     /*255, 180, 0 */
#define TFT_GREENYELLOW 0xB7E0 /* 180, 255, 0 */
在使用时,可以色彩名称来选用色彩。
4. 图形函数及用法
为了便于用户使用,在开发环境下提供了丰富的显示函数,掌握这些函数的使用可以起到事半功倍的效果。
1)屏幕填充函数
该函数的格式为:
fillScreen(uint32_t color);
使用该函数可用来清除屏幕,其使用形式为:
tft.fillScreen(TFT_BLACK);
其中的“TFT_BLACK”,用于指定以黑色来清屏。
2)画点函数
该函数的格式为:
drawPixel(int32_t x, int32_t y, uint32_t color);
其作用是在屏上的坐标点(x,y)上显示指定色彩为color的点,其多用于绘制各种曲线或图像。
此外,由于在函数中未提供对中文显示的支持,故用该函数还可以自行设计相应的中文显示函数。
其使用形式为:
tft.drawPixel(4,7,TFT_BLACK);
3)画线函数
该函数的格式为:
drawLine(int32_t x0, int32_t y0, int32_t x1, int32_t y1, uint32_t color);
其作用是在屏上从坐标点(x0,y0)到(x1,y1)以指定色彩为color绘制一条直线,其多用于绘制波形曲线。
其使用形式为:
tft.drawLine(0,0,160,120,TFT_BLACK);
作为画线函数的特例,函数drawFastHLine()用于绘制水平线,而函数drawFastVLine ()用于绘制垂线,其函数格式为:
drawFastHLine(int32_t x, int32_t y, int32_t w, uint32_t color);
drawFastVLine(int32_t x, int32_t y, int32_t h, uint32_t color);
其中参数x,y是起点位置,而w和h是指线的宽度和高度,color是指直线的色彩。
4)矩形函数
该函数的格式为:
drawRect(int32_t x, int32_t y, int32_t w, int32_t h, uint32_t color);
其作用是在屏上从坐标点(x,y),以指定色彩color绘制一个宽度和高度分别为w和h的矩形。
其使用形式为:
tft.drawRect(110,70,100,100,TFT_BLACK);
若绘制实心矩形,则使用函数fillRect(),其函数格式为:
fillRect(int32_t x, int32_t y, int32_t w, int32_t h, uint32_t color);
5)圆函数
该函数的格式为:
drawCircle(int32_t x0, int32_t y0, int32_t r, uint32_t color);
其作用是在屏上从坐标点(x0,y0),以指定色彩color绘制一个半径为r的圆。
其使用形式为:
tft.drawCircle(160,120,50,TFT_BLACK);
若绘制实心圆,则使用函数fillCircle(),其函数格式为:
fillCircle(int32_t x0, int32_t y0, int32_t r, uint32_t color);
6)三角形函数
该函数的格式为:
drawTriangle(int32_t x0, int32_t y0, int32_t x1, int32_t y1, int32_t x2,int32_t y2, uint32_t color);
其作用是在屏上按3个坐标点(x0,y0)、(x1,y1)和(x2,y2),以指定色彩color绘制一个三角形。
其使用形式为:
tft.drawTriangle(160,70,60,170,260,170,TFT_BLACK);
若绘制实心三角形,则使用函数fillTriangle(),其函数格式为:
fillTriangle(int32_t x0, int32_t y0, int32_t x1, int32_t y1, int32_t x2,int32_t y2, uint32_t color);
7)圆角矩形函数
该函数的格式为:
drawRoundRect(int32_t x, int32_t y, int32_t w, int32_t h, int32_t r,uint32_t color);
其作用是在屏上从坐标点(x,y),以指定色彩color绘制一个宽度和高度分别为w和h倒角半径为r的圆角矩形。
其使用形式为:
tft.drawRoundRect(110,70,100,100,10,TFT_BLACK);
若绘制实心圆角矩形,则使用函数fillRoundRect(),其函数格式为:
fillRoundRect(int32_t x, int32_t y, int32_t w, int32_t h, int32_t r,uint32_t color);
8)椭圆函数
该函数的格式为:
drawEllipse(int16_t x0, int16_t y0, int32_t rx, int32_t ry, uint16_tcolor);
其作用是在屏上从坐标点(x0,y0),以指定色彩color绘制一个长短轴为rx和ry的椭圆。
其使用形式为:
tft.drawEllipse(160,120,50,100,TFT_BLACK);
若绘制实心椭圆,则使用函数fillEllipse(),其函数格式为:
fillEllipse(int16_t x0, int16_t y0, int32_t rx, int32_t ry, uint16_tcolor);
9)字符函数
该函数的格式为:
drawChar(int32_t x, int32_t y, uint16_t c, uint32_t color, uint32_t bg, uint8_tsize)
其作用是在屏上从坐标点(x,y)以指定色彩color显示一个字符c,该字符的大小为size,背景色为bg。
其使用形式为:
tft.drawChar(140,120,'A',TFT_BLACK, TFT_RED,2);
10)字符串函数
该函数的格式为:
drawString(const String& string, int32_t poX, int32_t poY);
其作用是在屏上坐标点(poX, poY),显示指定字符串。
其使用形式为:
tft.drawString("  Wio Terminal !",20,100);
5. 显示示例
有了前面介绍的知识,我们怎样才能完成一个自己的显示程序呢?
要实现图17所示的显示效果,其程序和上传结果如图18所示。
17.jpg
图17显示效果
18.jpg
图18 程序及上传
程序中相关语句的用途如下:
1)语句tft.begin()的作用是启动屏幕显示;
2)语句tft.setRotation(3)的作用是按屏幕的摆放位置来显示;若修改其参数则使显示内容产生旋转,该参数的取值为0:~3;
3)语句tft.fillScreen(TFT_RED)的作用是以红色填充屏幕做背景;
4)语句tft.setTextColor(TFT_WHITE)的作用是以白色来显示内容;
5)语句tft.setTextSize(3)的作用是指定显示整体的大小,参数值越大字体越大;
6)最后3条语句的作用是指定显示内容。
若按图19所示来修改参数,则显示效果见图20所示。
19.jpg
图19参数修改
20.jpg
图20 修改后效果

了解了图形函数的使用方法后,后面我们会看到它在字体显示方面的独特魅力,值得关注呦!



使用特权

评论回复

打赏榜单

21小跑堂 打赏了 50.00 元 2021-07-21
理由:恭喜通过原创文章审核!请多多加油哦!

相关帖子

alxd| | 2021-7-22 22:11 | 显示全部楼层
这个开发板 好奈斯啊 哪里搞?

使用特权

评论回复
B1lanche| | 2021-7-22 22:11 | 显示全部楼层
arduino开发就是方便而且快

使用特权

评论回复
Allison8859| | 2021-7-22 22:12 | 显示全部楼层
支持楼主,期待做出更好玩的东西出来

使用特权

评论回复
Annie556| | 2021-7-22 22:16 | 显示全部楼层
arduino 是真不错 好玩

使用特权

评论回复
Carina卡| | 2021-7-22 22:17 | 显示全部楼层
这开发板 哪里买啊?挺好的感觉

使用特权

评论回复
jinglixixi|  楼主 | 2021-7-23 00:33 | 显示全部楼层
Carina卡 发表于 2021-7-22 22:17
这开发板 哪里买啊?挺好的感觉

某宝搜“Wio Terminal”即可找到。

使用特权

评论回复
jinglixixi|  楼主 | 2021-7-23 00:33 | 显示全部楼层
B1lanche 发表于 2021-7-22 22:11
arduino开发就是方便而且快

没错!

使用特权

评论回复
jinglixixi|  楼主 | 2021-7-23 00:42 | 显示全部楼层
alxd 发表于 2021-7-22 22:11
这个开发板 好奈斯啊 哪里搞?

某宝搜“Wio Terminal”可得

使用特权

评论回复
jinglixixi|  楼主 | 2021-7-23 00:44 | 显示全部楼层
Allison8859 发表于 2021-7-22 22:12
支持楼主,期待做出更好玩的东西出来

争取能给大家分享更多的东西

使用特权

评论回复
返回列表 发新帖 本帖赏金 50.00元(功能说明)我要提问
您需要登录后才可以回帖 登录 | 注册

本版积分规则

我要发帖 我要提问 投诉建议 申请版主

优质原创写原创,赢大奖

编辑推荐

  • 1 呐咯密密 得到打赏 ¥310.00
  • 2 qbwww 得到打赏 ¥265.00
  • 3 yanzhengxin1 得到打赏 ¥200.00
  • 4 full_stack 得到打赏 ¥100.00
  • 5 laocuo1142 得到打赏 ¥55.00
  • 6 二哲科技 得到打赏 ¥50.00
  • 7 zhangjiantao 得到打赏 ¥50.00
  • 8 改名了 得到打赏 ¥50.00
  • 9 小叶三千 得到打赏 ¥50.00
  • 10 cjseng 得到打赏 ¥50.00
在线客服 快速回复 返回顶部 返回列表