STemWin抗锯齿(部分)

会员952544

31.1  初学者重要提示

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

                               
登录/注册后看高清大图

转最新版本教程 本章节为大家讲解抗锯齿，关于抗锯齿，在前面第21章讲解STemWin字体时，有讲解到字体的抗锯齿效果。     什么称之为锯齿和抗锯齿呢？比如线条是由一系列位于显示坐标处的像素近似构成，可能看起来呈锯齿状，尤其是近似的水平线或近似的垂直线，这种现象称为锯齿(aliasing)。而抗锯齿是对线条和曲线进行平滑处理，降低锯齿感。STemWin支持抗锯齿效果的2D图形绘制，抗锯齿字体和高分辨率坐标。     31.1 初学者重要提示     31.2 抗锯齿介绍     31.3 抗锯齿API函数实例演示     31.4 模拟器上抗锯齿例程     31.5 实验例程说明（RTOS）     31.6 实验例程说明（裸机）     31.7       总结 下图是英文版手册里面API函数的位置：                                 登录/注册后看高清大图 31.2 抗锯齿介绍     抗锯齿通过使背景色与前景色相混合的方法来平滑曲线。背景色与前景色之间使用的阴影越多，抗锯齿效果越好，但计算时间越长31.2.1   抗锯齿质量     抗锯齿处理的质量由GUI_AA_SetFactor()函数设定，通过下面的截图给大家说明抗锯齿因子（也就是函数GUI_AA_SetFactor的参数）与对应结果之间的关系。                                 登录/注册后看高清大图     第一条线未经抗锯齿处理（因子为1）。第二条线以因子2进行了抗锯齿处理。也就是说，从前景到背景的阴影数为2 x 2 = 4。下一条线以抗锯齿因子3绘制，因而有3 x 3 = 9个阴影，后面几个因子的计算方法相同。一般情况下，因子4足以处理大多数应用，进一步增加抗锯齿因子不会大幅改善结果，但会增加计算时间。 31.2.2   抗锯齿字体     在前面第21章介绍字体的时候讲解过2bpp和4bpp字体显示效果，下面再给大家展示下不使用抗锯齿和使用2bpp，4bpp两种抗锯齿下字母C的显示效果：                                 登录/注册后看高清大图 抗锯齿字体可以通过STemWin字体小工具FontCvt创建。使用抗锯齿字体的一般目的是改进文字的外观。虽然高质量抗锯齿比低质量抗锯齿处理看起来更好，但计算时间和存储器占用量也会相应增加。低质量(2bpp)字体需要两倍于无抗锯齿处理(1bpp)字体的存储器容量，高质量(4bpp)字体则需要四倍的存储器容量在使用抗锯齿绘制图形时，使用的是与常规（无抗锯齿处理）绘图程序相同的坐标，这是默认方式。在函数参数中无需考虑抗锯齿因子，例如，要从(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()来实现。     在使用抗锯齿绘制图形时，使用的是与常规（无抗锯齿处理）绘图程序相同的坐标，这是默认方式。在函数参数中无需考虑抗锯齿因子，例如，要从(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()来实现。 [table=98%] 31.3抗锯齿API函数实例演示     STemWin支持的抗锯齿函数主要如下：                                 登录/注册后看高清大图 这里我们选择几个常用的函数进行说明。[table=98%] 31.3.1   函数GUI_AA_DrawArc void GUI_AA_DrawArc(int x0, int y0, int rx, int ry, int a0, inta1);     在当前窗口中的指定位置（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);      } }[table=98%] 31.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);      } }[table=2,rgb(251, 251, 251)] [table=98%] 要注意设置了抗锯齿因子且使能了高分辨率坐标后，绘制时得乘以相应的因子，这点切不可忘了。 实际效果如下：                                 登录/注册后看高清大图 31.3.3   函数GUI_AA_DrawPolyOutline void GUI_AA_DrawPolyOutline(const GUI_POINT * pPoint, intNumPoints, 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()函数。 实际效果如下：                                 登录/注册后看高清大图 [table=2,rgb(251, 251, 251)] [table=98%] 31.3.4   函数GUI_AA_DrawRoundedRect void GUI_AA_DrawRoundedRect(int x0, int y0, int x1, int y1, intr);     在当前窗口指定的左上角位置（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);      } } 31.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);      } } 31.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);      } }[table=2,rgb(251, 251, 251)] [table=98%] 31.3.7   函数GUI_AA_FillRoundedRect void GUI_AA_FillRoundedRect(int x0, int y0, int x1, int y1, intr);     在当前窗口指定的左上角位置（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);      } }

[/td][/tr]
[/table][/td][/tr]
[/table][/td][/tr]
[/table][/td][/tr]
[/table][/td][/tr]
[/table][/td][/tr]
[/table]
[/td][/tr]
[/table][/td][/tr]
[/table]




[/td][/tr]
[tr][td][/td][/tr]
[/table]