微波EDA网,见证研发工程师的成长!
首页 > 研发问答 > 嵌入式设计讨论 > MCU和单片机设计讨论 > 第26章 抗锯齿基础介绍

第26章 抗锯齿基础介绍

时间:10-02 整理:3721RD 点击:
第26章 抗锯齿基础介绍

    本期教程主要是跟大家讲解一下抗锯齿,关于抗锯齿,在第16章讲解字体显示的时候也讲了点。本期教程就是跟大家详细的讲解一下抗锯齿方面的知识。

    线条由一系列必须位于显示坐标处的像素近似构成。因此,可能看起来呈锯齿状,尤其是近似水平线或近似垂直线。这种现象称为锯齿(aliasing)。抗锯齿是对线条和曲线进行平滑处理。可以减少不完全水平或垂直的线条的楼梯状锯齿。STemWin支持不同的抗锯齿质量、无锯齿字体和高分辨率坐标。

    26. 1  介绍

    26. 2 抗锯齿API函数实例演示

    26. 3 总结


26.1 介绍

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

26.1.1 抗锯齿质量

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



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


26.1.2 抗锯齿字体

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



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


26.1.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);

    高分辨率坐标必须通过GUI_AA_EnableHiRes()程序启用,并用GUI_AA_DisableHiRes()禁用。


26.2 抗锯齿API函数实例演示

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



26.2.1 函数GUI_AA_DrawArc

模拟器上运行代码如下:

  1. #include "GUI.h"

  2. void MainTask(void)
  3. {
  4. GUI_Init();

  5. /* 设置画笔粗细 */
  6. GUI_SetPenSize(4);
  7. GUI_SetColor(GUI_RED);
  8. /* 使能高分辨率 */
  9. GUI_AA_EnableHiRes();

  10. /* 抗锯齿因数选择1 */
  11. GUI_AA_SetFactor(1);
  12. GUI_AA_DrawArc(50,120,50,50,0,180);

  13. /* 抗锯齿因数选择3 */
  14. GUI_AA_SetFactor(3);
  15. GUI_AA_DrawArc(160*3,120*3,50*3,50*3,0,180);

  16. /* 抗锯齿因数选择3 */
  17. GUI_AA_SetFactor(6);
  18. GUI_AA_DrawArc(270*6,120*6,50*6,50*6,0,180);
  19. while(1)
  20. {
  21. GUI_Delay(100);
  22. }
  23. }

复制代码

要注意选择了抗锯齿因数后,绘制是得乘以相应的因数。

显示效果如下:



26.2.2 函数GUI_AA_DrawLine

    模拟器上运行程序如下:

  1. #include "GUI.h"

  2. void MainTask(void)
  3. {
  4. GUI_Init();

  5. /* 设置画笔粗细 */
  6. GUI_SetPenSize(40);
  7. GUI_SetColor(GUI_RED);
  8. /* 使能高分辨率 */
  9. GUI_AA_EnableHiRes();

  10. /* 抗锯齿因数选择1 */
  11. GUI_AA_SetFactor(1);
  12. GUI_AA_DrawLine(50,40,50,120);

  13. /* 抗锯齿因数选择3 */
  14. GUI_AA_SetFactor(3);
  15. GUI_AA_DrawLine(150*3,40*3,150*3,120*3);

  16. /* 抗锯齿因数选择3 */
  17. GUI_AA_SetFactor(6);
  18. GUI_AA_DrawLine(250*6,40*6,250*6,120*6);
  19. while(1)
  20. {
  21. GUI_Delay(100);
  22. }
  23. }

复制代码

实际效果如下:



26.2.3 函数GUI_AA_DrawPolyOutline

    模拟器上运行代码如下:

  1. #define countof(Array) (sizeof(Array) / sizeof(Array[0]))

  2. static GUI_POINT aPoints[] = {
  3. { 0, 0 },
  4. { 15, 30 },
  5. { 0, 20 },
  6. {-15, 30 }
  7. };

  8. void MainTask(void)
  9. {
  10. GUI_Init();

  11. GUI_SetPenSize(10);
  12. GUI_SetColor(GUI_RED);

  13. GUI_AA_DrawPolyOutline(aPoints, countof(aPoints), 3, 150, 40);
  14. while(1)
  15. {
  16. GUI_Delay(100);
  17. }
  18. }

复制代码

    使用这个函数要注意:通过连接终点和起点,可使绘制的多线条自动闭合。起点不得再次指定为终点。如果采用高分辨率模式,则必须使用高分辨率坐标。否则,必须指定为像素值。默认情况下,该函数处理的定义点不超过10个。如果多边形由10个以的点构成,则必须使用GUI_AA_DrawPolyOutlineEx()函数。

实际效果如下:



26.2.4 函数GUI_AA_DrawRoundedRect

    模拟器上运行的代码如下:

  1. #include "GUI.h"

  2. void MainTask(void)
  3. {
  4. GUI_Init();
  5. GUI_SetBkColor(GUI_WHITE);
  6. GUI_Clear();
  7. GUI_SetColor(GUI_DARKBLUE);
  8. GUI_SetPenSize(5);
  9. GUI_AA_DrawRoundedRect(10, 10, 50, 50, 5);
  10. while(1)
  11. {
  12. GUI_Delay(100);
  13. }
  14. }

复制代码

实际显示效果如下:




26.2.5 函数GUI_AA_FillCircle

    模拟器上运行的代码如下:

  1. #include "GUI.h"

  2. void MainTask(void)
  3. {
  4. GUI_Init();
  5. GUI_AA_EnableHiRes();
  6. GUI_SetBkColor(GUI_WHITE);
  7. GUI_Clear();
  8. GUI_SetColor(GUI_DARKBLUE);
  9. GUI_SetPenSize(5);
  10. GUI_AA_SetFactor(3);
  11. GUI_AA_FillCircle(160*3, 120*3, 80*3);
  12. while(1)
  13. {
  14. GUI_Delay(100);
  15. }
  16. }

复制代码

实际显示效果如下:



26.2.6 函数GUI_AA_FillPolygon

    模拟器上运行的代码如下:

  1. #include "GUI.h"

  2. #define countof(Array) (sizeof(Array) / sizeof(Array[0]))

  3. static GUI_POINT aPoints[] = {   (1)
  4. { 0, 0 },
  5. { 70, -30 },
  6. { 0, 50 },
  7. {-70, -30 }
  8. };

  9. void MainTask(void)
  10. {
  11. GUI_Init();

  12. GUI_SetPenSize(10);
  13. GUI_SetColor(GUI_RED);

  14. GUI_AA_FillPolygon(aPoints, countof(aPoints), 150, 40);
  15. while(1)
  16. {
  17. GUI_Delay(100);
  18. }
  19. }

复制代码

1. 这些坐标点是相对于函数GUI_AA_FillPolygon中的X,Y坐标而言的。

实际运行效果如下:



26.2.7 函数GUI_AA_FillRoundedRect

    模拟器上运行的代码如下:

  1. #include "GUI.h"

  2. void MainTask(void) {
  3. GUI_Init();
  4. GUI_SetBkColor(GUI_WHITE);
  5. GUI_Clear();
  6. GUI_SetColor(GUI_DARKBLUE);
  7. GUI_AA_FillRoundedRect(10, 10, 54, 54, 5);
  8. while (1);
  9. {
  10. }
  11. }

复制代码

实际显示效果如下:




26.3总结
本期教程就跟大家讲这么多,下期教程再跟大家详细的讲解两个抗锯齿相关的应用例子。

Copyright © 2017-2020 微波EDA网 版权所有

网站地图

Top