【第3版emWin教程】第37章 emWin6.x抗锯齿

2023-12-17 00:38
文章标签 教程 37 抗锯齿 emwin emwin6

本文主要是介绍【第3版emWin教程】第37章 emWin6.x抗锯齿,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

教程不断更新中:第3版emWin教程和ThreadX GUIX教程开工,双管齐下,GUIX更新至第28章,emWin更新至第48章(2021-09-13) - uCOS & uCGUI & emWin & embOS & TouchGFX & ThreadX - 硬汉嵌入式论坛 - Powered by Discuz!http://www.armbbs.cn/forum.php?mod=viewthread&tid=98429

第37章       emWin6.x抗锯齿

本章节为大家讲解抗锯齿,关于抗锯齿,在前面第21章讲解emWin字体时,有讲解到字体的抗锯齿效果。

什么称之为锯齿和抗锯齿呢?比如线条是由一系列位于显示坐标处的像素近似构成,可能看起来呈锯齿状,尤其是近似的水平线或近似的垂直线,这种现象称为锯齿(aliasing)。而抗锯齿是对线条和曲线进行平滑处理,降低锯齿感。emWin支持抗锯齿效果的2D图形绘制,抗锯齿字体和高分辨率坐标。

目录

37.1 初学者重要提示

37.2 抗锯齿介绍

37.2.1   抗锯齿质量

37.2.2   抗锯齿字体

37.2.3   高分辨率坐标

37.3 抗锯齿API函数实例演示

37.3.1   函数GUI_AA_DrawArc

37.3.2   函数GUI_AA_DrawLine

37.3.3   函数GUI_AA_DrawPolyOutline

37.3.4   函数GUI_AA_DrawRoundedRect

37.3.5   函数GUI_AA_FillCircle

37.3.6   函数GUI_AA_FillPolygon

37.3.7   函数GUI_AA_FillRoundedRect

37.4 模拟器上抗锯齿例程

37.5 实验例程说明(RTOS)

37.6 实验例程说明(裸机)

37.7 总结


37.1 初学者重要提示

  1.   抗锯齿的使用相对比较容易,但是也容易出错,用户设置了抗锯齿因子且使能了高分辨率坐标后,一定要记得相应抗锯齿绘制的坐标也要乘以相应的抗锯齿因子,这点要切记,本章37.3小节的例子中都进行了强调。
  2.   抗锯齿所有API函数在emWin手册中都有讲解,下图是中文版手册里面API函数的位置

下图是英文版手册里面API函数的位置:

37.2 抗锯齿介绍

抗锯齿通过使背景色与前景色相混合的方法来平滑曲线。背景色与前景色之间使用的阴影越多,抗锯齿效果越好,但计算时间越长。

37.2.1   抗锯齿质量

抗锯齿处理的质量由GUI_AA_SetFactor()函数设定,通过下面的截图给大家说明抗锯齿因子(也就是函数GUI_AA_SetFactor的参数)与对应结果之间的关系。

第一条线未经抗锯齿处理(因子为1)。第二条线以因子2进行了抗锯齿处理。也就是说,从前景到背景的阴影数为2 x 2 = 4。下一条线以抗锯齿因子3绘制,因而有3 x 3 = 9个阴影,后面几个因子的计算方法相同。一般情况下,因子4足以处理大多数应用,进一步增加抗锯齿因子不会大幅改善结果,但会增加计算时间。

37.2.2   抗锯齿字体

在前面章节介绍字体的时候讲解过2bpp和4bpp字体显示效果,下面再给大家展示下不使用抗锯齿和使用2bpp,4bpp两种抗锯齿下字母C的显示效果:

抗锯齿字体可以通过emWin字体小工具FontCvt创建。使用抗锯齿字体的一般目的是改进文字的外观。虽然高质量抗锯齿比低质量抗锯齿处理看起来更好,但计算时间和存储器占用量也会相应增加。低质量(2bpp)字体需要两倍于无抗锯齿处理(1bpp)字体的存储器容量,高质量(4bpp)字体则需要四倍的存储器容量。

37.2.3   高分辨率坐标

在使用抗锯齿绘制图形时,使用的是与常规(无抗锯齿处理)绘图程序相同的坐标,这是默认方式。在函数参数中无需考虑抗锯齿因子,例如,要从(50, 100)到(100, 50)绘制一条抗锯齿线,则编写以下代码:

GUI_AA_DrawLine(50, 100, 100, 50);

借助STemWin的高分辨率功能,大家就可以使用由抗锯齿因子和显示尺寸决定的虚拟空间。使用高分辨率坐标的优势在于图形不但可以置于显示器的每个点阵像素上,而且可以置于每个点阵像素内部。下图展示的是一个高分辨率像素的虚拟空间,其抗锯齿因子为3:

以抗锯齿因子3,从像素(50, 100)到像素(100, 50)绘制一条高分辨率线条,则需写入以下代码:

GUI_AA_DrawLine(150, 300, 300, 150);  /* 将坐标位置放大3倍,这一点千万不可忘记 */

另外特别注意,使用高分辨率坐标必须通过函数GUI_AA_EnableHiRes()进行使能,如果需要禁止可以调用函数GUI_AA_DisableHiRes()来实现。

37.3 抗锯齿API函数实例演示

StemWin支持的抗锯齿函数主要如下:

这里我们选择几个常用的函数进行说明。

37.3.1   函数GUI_AA_DrawArc

  •   void GUI_AA_DrawArc(int x0, int y0, int rx, int ry, int a0, int a1);

在当前窗口中的指定位置(x0,y0)绘制x轴方向半径为rx,y轴方向半径为ry,起始角度为a0,结束角度为a1的抗锯齿弧线。

下面是在模拟器上面实际运行的例子:

#include "GUI.h"/*********************************************************************
*
*       MainTask
*/
void MainTask(void) 
{/* 初始emWin */GUI_Init();/* 设置画笔粗细 */GUI_SetPenSize(4);GUI_SetColor(GUI_RED);/* 使能高分辨率 */GUI_AA_EnableHiRes();/* 抗锯齿因子选择1 */GUI_AA_SetFactor(1);GUI_AA_DrawArc(50*1, 120*1, 50*1, 50*1, 0, 180);/* 抗锯齿因子选择3 */GUI_AA_SetFactor(3);GUI_AA_DrawArc(160*3, 120*3, 50*3, 50*3, 0, 180);/* 抗锯齿因子选择6 */GUI_AA_SetFactor(6);GUI_AA_DrawArc(270*6, 120*6, 50*6, 50*6, 0, 180);while(1){GUI_Delay(10);}
}

要注意设置了抗锯齿因子且使能了高分辨率坐标后,绘制时得乘以相应的因子,这点切不可忘了。

显示效果如下:

37.3.2   函数GUI_AA_DrawLine

  •   void GUI_AA_DrawLine(int x0, int y0, int x1, int y1);

在当前窗口中绘制以(x0,y0)为起点,(x1,y1)为终点的抗锯齿直线。

下面是在模拟器上面实际运行的例子:

#include "GUI.h"/*********************************************************************
*
*       MainTask
*/
void MainTask(void) 
{/* 初始化emWin */GUI_Init();/* 设置画笔粗细 */GUI_SetPenSize(40);GUI_SetColor(GUI_RED);/* 使能高分辨率 */GUI_AA_EnableHiRes();/* 抗锯齿因子选择1 */GUI_AA_SetFactor(1);GUI_AA_DrawLine(50*1, 40*1, 50*1, 120*1);/* 抗锯齿因子选择3 */GUI_AA_SetFactor(3);GUI_AA_DrawLine(150*3,40*3,150*3,120*3);/* 抗锯齿因子选择6 */GUI_AA_SetFactor(6);GUI_AA_DrawLine(250*6, 40*6, 250*6, 120*6);while(1){GUI_Delay(100);}
}

要注意设置了抗锯齿因子且使能了高分辨率坐标后,绘制时得乘以相应的因子,这点切不可忘了。

实际效果如下:

37.3.3   函数GUI_AA_DrawPolyOutline

  •   void GUI_AA_DrawPolyOutline(const GUI_POINT * pPoint, int NumPoints, int Thickness, int x, int y)

在当前窗口指定的位置(x, y)绘制由坐标点数组pPoint中NumPoints个点组成的抗锯齿多边形轮廓,轮廓厚度为Thickness。

下面是在模拟器上面实际运行的例子:

#include "GUI.h"/* 宏定义,方便求出数组中成员个数 */
#define countof(Array) (sizeof(Array) / sizeof(Array[0]))/* 宏定义,抗锯齿因子*/
#define MAG  3/* 多边形的坐标点 */
static GUI_POINT aPoints[] = {{ 0*MAG,   0*MAG }, { 15*MAG,  30*MAG}, { 0*MAG,   20*MAG}, {-15*MAG,  30*MAG}
};/*********************************************************************
*
*       MainTask
*/
void MainTask(void) 
{/* 初始化emWin */GUI_Init();/* 使能高分辨率坐标 */GUI_AA_EnableHiRes();/* 设置前景色 */GUI_SetColor(GUI_RED);/* 设置抗锯齿因子是3,绘制抗锯齿多边形轮廓 */GUI_AA_SetFactor(MAG);GUI_AA_DrawPolyOutline(aPoints, countof(aPoints), 3*MAG, 150*MAG, 40*MAG);while(1){GUI_Delay(10);}
}

使用这个函数要注意

1. 通过连接起点和终点,可使绘制的多线条自动闭合,起点不得再次指定为终点。

2. 设置了抗锯齿因子且使能了高分辨率坐标后,绘制时得乘以相应的因子,这点切不可忘了。

3. 该函数处理的定义点不能超过10个。如果多边形由10个以上的点构成,则使用GUI_AA_DrawPolyOutlineEx()函数。

实际效果如下:

37.3.4   函数GUI_AA_DrawRoundedRect

  •   void GUI_AA_DrawRoundedRect(int x0, int y0, int x1, int y1, int r);

在当前窗口指定的左上角位置(x0, y0)和右下角位置(x1, y1)绘制圆角半径为r的抗锯齿圆角矩形。

下面是在模拟器上面实际运行的例子:

#include "GUI.h"/* 设置抗锯齿因子 */
#define MAG  3/*********************************************************************
*
*       MainTask
*/
void MainTask(void) 
{/* 初始化emWin */GUI_Init();/* 清屏 */GUI_SetBkColor(GUI_WHITE);GUI_Clear();/* 使能高分辨率坐标 */GUI_AA_EnableHiRes();/* 设置前景色和画笔粗细  */GUI_SetColor(GUI_RED);GUI_SetPenSize(5);/* 设置抗锯齿因子,绘制抗锯齿圆角矩形 */GUI_AA_SetFactor(MAG);GUI_AA_DrawRoundedRect(10*MAG, 10*MAG, 100*MAG, 100*MAG, 5*MAG);while(1){GUI_Delay(10);}
}

要注意设置了抗锯齿因子且使能了高分辨率坐标后,绘制时得乘以相应的因子,这点切不可忘了。

实际显示效果如下:

37.3.5   函数GUI_AA_FillCircle

  •   void GUI_AA_FillCircle(int x0, int y0, int r);

在当前窗口指定位置(x0, y0)半径为r的抗锯齿填充圆形。

下面是在模拟器上面实际运行的例子:

#include "GUI.h"/* 设置抗锯齿因子 */
#define MAG  3/*********************************************************************
*
*       MainTask
*/
void MainTask(void) 
{/* 初始化emWin */GUI_Init();/* 清屏 */GUI_SetBkColor(GUI_WHITE);GUI_Clear();/* 使能高分辨率坐标 */GUI_AA_EnableHiRes();/* 设置前景色 */GUI_SetColor(GUI_DARKBLUE);/* 设置抗锯齿因子是3,绘制抗锯齿填充圆形 */GUI_AA_SetFactor(MAG);GUI_AA_FillCircle(160*MAG, 120*MAG, 80*MAG);while(1){GUI_Delay(10);}
}

要注意设置了抗锯齿因子且使能了高分辨率坐标后,绘制时得乘以相应的因子,这点切不可忘了。

实际显示效果如下:

37.3.6   函数GUI_AA_FillPolygon

  •   void GUI_AA_FillPolygon(const GUI_POINT * pPoint, int NumPoints, int x, int y);

在当前窗口指定的位置(x, y)绘制由坐标点数组pPoint中NumPoints个点组成的抗锯齿填充多边形。

下面是在模拟器上面实际运行的例子:

#include "GUI.h"/* 宏定义,方便获得数组中成员个数 */
#define countof(Array) (sizeof(Array) / sizeof(Array[0]))/* 宏定义,抗锯齿因子*/
#define MAG  3/* 多边形坐标点 */
static GUI_POINT aPoints[] = {   { 0*MAG,   0*MAG}, { 70*MAG,  -30*MAG}, { 0*MAG,   50*MAG}, {-70*MAG,  -30*MAG}
};/*********************************************************************
*
*       MainTask
*/
void MainTask(void) 
{/* 初始化emWin */GUI_Init();/* 使能高分辨率坐标 */GUI_AA_EnableHiRes();/* 设置前景色*/GUI_SetColor(GUI_RED);/* 设置抗锯齿因子是3,绘制抗锯齿填充圆形 */GUI_AA_SetFactor(MAG);GUI_AA_FillPolygon(aPoints, countof(aPoints), 150*MAG, 40*MAG);while(1){GUI_Delay(100);}
}

要注意设置了抗锯齿因子且使能了高分辨率坐标后,绘制时得乘以相应的因子,这点切不可忘了。

实际运行效果如下:

37.3.7   函数GUI_AA_FillRoundedRect

  •   void GUI_AA_FillRoundedRect(int x0, int y0, int x1, int y1, int r);

在当前窗口指定的左上角位置(x0, y0)和右下角位置(x1, y1)绘制圆角半径为r的抗锯齿圆角填充矩形。

下面是在模拟器上面实际运行的例子:

#include "GUI.h"/* 宏定义,抗锯齿因子*/
#define MAG  3/*********************************************************************
*
*       MainTask
*/
void MainTask(void) 
{/* 初始化emWin */GUI_Init();/* 使能高分辨率坐标 */GUI_AA_EnableHiRes();/* 清屏 */GUI_SetBkColor(GUI_WHITE);GUI_Clear();/* 设置多边形颜色,多边形抗锯齿因子,然后绘制抗锯齿圆角填充矩形 */GUI_SetColor(GUI_DARKBLUE);GUI_AA_SetFactor(MAG);GUI_AA_FillRoundedRect(10*MAG, 10*MAG, 100*MAG, 100*MAG, 5*MAG);while(1){GUI_Delay(10);}
}

要注意设置了抗锯齿因子且使能了高分辨率坐标后,绘制时得乘以相应的因子,这点切不可忘了。

实际显示效果如下:

37.4 模拟器上抗锯齿例程

官方提供了几个抗锯齿方面的例子,这里将其中三个例子的位置和演示效果展示下,方便大家以后做参考,对于这三个例子,在我们emWin教程第1版的第27章简单进行了讲解,本次新升级的教程不再做讲解:

  •   例子1:AA_HiResAntialiasing.c

此例子所在的位置:

演示效果如下,这里的指针是动态旋转的:

  •   例子2:AA_HiResPixels.c

此例子所在的位置:

演示效果如下:

  •   例子3:AA_Lines.c

此例子所在的位置:

演示效果如下:

37.5 实验例程说明(RTOS)

配套例子:

V7-550_emWin6.x实验_抗锯齿(RTOS)

实验目的:

  1. 学习emWin的抗锯齿。
  2. emWin功能的实现在MainTask.c文件里面。

实验内容:

1、K1按键按下,串口或者RTT打印任务执行情况(串口波特率115200,数据位8,奇偶校验位无,停止位1)。

2、(1) 凡是用到printf函数的全部通过函数App_Printf实现。

(2) App_Printf函数做了信号量的互斥操作,解决资源共享问题。

3、默认上电是通过串口打印信息,如果使用RTT打印信息:

MDK AC5,MDK AC6或IAR通过使能bsp.h文件中的宏定义为1即可

#define Enable_RTTViewer  1

4、各个任务实现的功能如下:

App Task Start   任务 :启动任务,这里用作BSP驱动包处理。

App Task MspPro任务 :消息处理,这里用作LED闪烁。

App Task UserIF  任务 :按键消息处理。

App Task COM   任务 :暂未使用。

App Task GUI    任务 :GUI任务。

μCOS-III任务调试信息(按K1按键,串口打印):

RTT 打印信息方式:

程序设计:

  任务栈大小分配:

μCOS-III任务栈大小在app_cfg.h文件中配置:

#define  APP_CFG_TASK_START_STK_SIZE                      512u

#define  APP_CFG_TASK_MsgPro_STK_SIZE                     2048u

#define  APP_CFG_TASK_COM_STK_SIZE                        512u

#define  APP_CFG_TASK_USER_IF_STK_SIZE                    512u

#define  APP_CFG_TASK_GUI_STK_SIZE                        2048u

任务栈大小的单位是4字节,那么每个任务的栈大小如下:

App Task Start   任务 :2048字节。

App Task MspPro任务 :8192字节。

App Task UserIF  任务 :2048字节。

App Task COM   任务 :2048字节。

App Task GUI    任务 :8192字节。

  系统栈大小分配:

μCOS-III的系统栈大小在os_cfg_app.h文件中配置:

#define  OS_CFG_ISR_STK_SIZE                      512u     

系统栈大小的单位是4字节,那么这里就是配置系统栈大小为2KB

emWin动态内存配置:

GUIConf.c文件中的配置如下:

#define EX_SRAM   1/*1 used extern sram, 0 used internal sram */#if EX_SRAM
#define GUI_NUMBYTES  (1024*1024*24)
#else
#define GUI_NUMBYTES  (100*1024)
#endif

通过宏定义来配置使用内部SRAM还是外部的SDRAM做为emWin的动态内存,当配置:

#define  EX_SRAM     1 表示使用外部SDRAM作为emWin动态内存,大小24MB。

#define  EX_SRAM     0 表示使用内部SRAM作为emWin动态内存,大小100KB。

默认情况下,本教程配套的所有emWin例子都是用外部SDRAM作为emWin动态内存。

emWin界面显示效果:

800*480分辨率界面效果。

37.6 实验例程说明(裸机)

配套例子:

V7-549_emWin6.x实验_抗锯齿(裸机)

实验目的:

  1. 学习emWin的抗锯齿。
  2. emWin功能的实现在MainTask.c文件里面。

emWin界面显示效果:

800*480分辨率界面效果。

emWin动态内存配置:

GUIConf.c文件中的配置如下:

#define EX_SRAM   1/*1 used extern sram, 0 used internal sram */#if EX_SRAM
#define GUI_NUMBYTES  (1024*1024*24)
#else
#define GUI_NUMBYTES  (100*1024)
#endif

通过宏定义来配置使用内部SRAM还是外部的SDRAM做为emWin的动态内存,当配置:

#define  EX_SRAM     1 表示使用外部SDRAM作为emWin动态内存,大小24MB。

#define  EX_SRAM     0 表示使用内部SRAM作为emWin动态内存,大小100KB。

默认情况下,本教程配套的所有emWin例子都是用外部SDRAM作为emWin动态内存。

37.7 总结

抗锯齿的知识就跟大家讲这么多,相对来说也比较容易,实际应用中用到的地方也不少,望初学者掌握基本使用方法即可,用到的时候再查阅相关API函数。

这篇关于【第3版emWin教程】第37章 emWin6.x抗锯齿的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/502489

相关文章

Spring Security 从入门到进阶系列教程

Spring Security 入门系列 《保护 Web 应用的安全》 《Spring-Security-入门(一):登录与退出》 《Spring-Security-入门(二):基于数据库验证》 《Spring-Security-入门(三):密码加密》 《Spring-Security-入门(四):自定义-Filter》 《Spring-Security-入门(五):在 Sprin

Makefile简明使用教程

文章目录 规则makefile文件的基本语法:加在命令前的特殊符号:.PHONY伪目标: Makefilev1 直观写法v2 加上中间过程v3 伪目标v4 变量 make 选项-f-n-C Make 是一种流行的构建工具,常用于将源代码转换成可执行文件或者其他形式的输出文件(如库文件、文档等)。Make 可以自动化地执行编译、链接等一系列操作。 规则 makefile文件

SWAP作物生长模型安装教程、数据制备、敏感性分析、气候变化影响、R模型敏感性分析与贝叶斯优化、Fortran源代码分析、气候数据降尺度与变化影响分析

查看原文>>>全流程SWAP农业模型数据制备、敏感性分析及气候变化影响实践技术应用 SWAP模型是由荷兰瓦赫宁根大学开发的先进农作物模型,它综合考虑了土壤-水分-大气以及植被间的相互作用;是一种描述作物生长过程的一种机理性作物生长模型。它不但运用Richard方程,使其能够精确的模拟土壤中水分的运动,而且耦合了WOFOST作物模型使作物的生长描述更为科学。 本文让更多的科研人员和农业工作者

沁恒CH32在MounRiver Studio上环境配置以及使用详细教程

目录 1.  RISC-V简介 2.  CPU架构现状 3.  MounRiver Studio软件下载 4.  MounRiver Studio软件安装 5.  MounRiver Studio软件介绍 6.  创建工程 7.  编译代码 1.  RISC-V简介         RISC就是精简指令集计算机(Reduced Instruction SetCom

前端技术(七)——less 教程

一、less简介 1. less是什么? less是一种动态样式语言,属于css预处理器的范畴,它扩展了CSS语言,增加了变量、Mixin、函数等特性,使CSS 更易维护和扩展LESS 既可以在 客户端 上运行 ,也可以借助Node.js在服务端运行。 less的中文官网:https://lesscss.cn/ 2. less编译工具 koala 官网 http://koala-app.

【Shiro】Shiro 的学习教程(三)之 SpringBoot 集成 Shiro

目录 1、环境准备2、引入 Shiro3、实现认证、退出3.1、使用死数据实现3.2、引入数据库,添加注册功能后端代码前端代码 3.3、MD5、Salt 的认证流程 4.、实现授权4.1、基于角色授权4.2、基于资源授权 5、引入缓存5.1、EhCache 实现缓存5.2、集成 Redis 实现 Shiro 缓存 1、环境准备 新建一个 SpringBoot 工程,引入依赖:

Windows环境利用VS2022编译 libvpx 源码教程

libvpx libvpx 是一个开源的视频编码库,由 WebM 项目开发和维护,专门用于 VP8 和 VP9 视频编码格式的编解码处理。它支持高质量的视频压缩,广泛应用于视频会议、在线教育、视频直播服务等多种场景中。libvpx 的特点包括跨平台兼容性、硬件加速支持以及灵活的接口设计,使其可以轻松集成到各种应用程序中。 libvpx 的安装和配置过程相对简单,用户可以从官方网站下载源代码

PHP APC缓存函数使用教程

APC,全称是Alternative PHP Cache,官方翻译叫”可选PHP缓存”。它为我们提供了缓存和优化PHP的中间代码的框架。 APC的缓存分两部分:系统缓存和用户数据缓存。(Linux APC扩展安装) 系统缓存 它是指APC把PHP文件源码的编译结果缓存起来,然后在每次调用时先对比时间标记。如果未过期,则使用缓存的中间代码运行。默认缓存 3600s(一小时)。但是这样仍会浪费大量C

Qt多语种开发教程

Qt作为跨平台的开发工具,早已应用到各行各业的软件开发中。 今天讲讲,Qt开发的正序怎么做多语言开发。就是说,你设置中文,就中文显示;设置英语就英文显示,设置繁体就繁体显示,设置发育就显示法语等。 开发环境(其实多语种这块根环境没太大关系):win10,Qt.5.12.10 一.先用QtCreator创建一个简单的桌面程序 1.工程就随便命名“LanguageTest”,其他默认。 2.在设计师

如何打造个性化大学生线上聊天交友系统?Java SpringBoot Vue教程,2025最新设计思路

✍✍计算机编程指导师 ⭐⭐个人介绍:自己非常喜欢研究技术问题!专业做Java、Python、微信小程序、安卓、大数据、爬虫、Golang、大屏等实战项目。 ⛽⛽实战项目:有源码或者技术上的问题欢迎在评论区一起讨论交流! ⚡⚡ Java实战 | SpringBoot/SSM Python实战项目 | Django 微信小程序/安卓实战项目 大数据实战项目 ⚡⚡文末获取源码 文章目录