TouchGFX使用教程（五）

Graph控件是用于实现图表以及需要绘制图像的控件，该控件在TouchGFX Designer中没有体现，但是可以在工程中自行添加，TouchGFX官方给的Demo中有针对于该部分的Demo，这些Demo可以给大家些帮助，下面针对于该控件给大家详细的介绍下。

CanvasWidget

Canvas Widgets和Canvas Widget Renderer是TouchGFX的功能强大且用途广泛的附加组件，它使用相对较少的内存就可以提供流畅，抗锯齿的几何形状图形，同时保持了高性能。但是，渲染几何形状必须被视为相当昂贵的操作，并且如果不小心使用，很容易使微控制器资源紧张。

Canvas Widget Renderer（以下称为CWR）是一种通用的图形API，可为图元提供优化的图形，并自动消除大多数多余的图形。TouchGFX使用CWR绘制复杂的几何形状。几何形状由“画布小部件”定义。TouchGFX随附了许多受支持的Canvas Widget，但就像普通的Widget一样，您可以制作自己的自定义Canvas Widget来满足您的需求。当Canvas Widget定义要由CWR绘制的图形的几何形状时，图形内每个像素的实际颜色由关联的Painter类定义。同样，TouchGFX附带了许多Painter，但是您可以根据自己的需要制作自己的自定义Painter。

TouchGFX中的其他小部件的大小会自动设置。例如，位图小部件将自动获取所包含位图的宽度和高度。因此，足以setXY()在位图小部件上使用以将位图放置在显示器上。
画布小部件没有默认大小，该默认大小可以自动确定并进行初始设置。必须不仅要注意位置，而且还要正确调整窗口小部件的大小，否则“画布”窗口小部件的宽度和高度将为零，并且在显示器上不会绘制任何内容。

因此，不要setXY()使用setPosition()来放置和调整画布小部件的大小，而要使用。另请参阅下面的“自定义画布小部件”，以获取有关如何创建和使用自定义画布小部件的示例。

设置画布小部件的位置和大小后，便可以在其中绘制几何形状。坐标系将在小部件（而不是显示）的左上角具有（0，0），X轴向右延伸，Y轴向下延伸。

Canvas窗口小部件在TouchGFX Designer中也受支持，它使用法简单并具有自动内存分配功能。

CanvasWidget内存分配

TouchGFX Designer中的内存分配

将小部件添加到屏幕的画布时，会自动生成一个内存缓冲区。缓冲区的大小基于具有以下公式的屏幕宽度（Width × 3）× 5。但是，这并非总是适用于所有情况的理想缓冲区大小。因此，可以覆盖缓冲区大小，如下图所示。

用户代码中的内存分配

内存可被分配和设置在target/main.cpp与simulator/main.cpp或可以设置和每画面分配。

static const uint16_t CANVAS_BUFFER_SIZE = 3600;
static uint8_t canvasBuffer[CANVAS_BUFFER_SIZE]

定义内存缓冲区大小的静态const，可以在main.cpp或的开头定义实际的内存缓冲区ScreenView.hpp
然后，在任一main()的方法main.cpp或setupScreen()方法ScreenView.cpp中的以下行建立缓冲区可以被添加。

CanvasW