Canvas
ImportStatement: import QtQuick 2.2
Since: Qt 5.0
Inherits: Item
Properties
available :size
canvasSize :size
canvasWindow: rect
context :object
contextType: string
renderStrategy: enumeration
renderTarget: enumeration
tileSize :size
Signals
imageLoaded()
paint(rectregion)
painted()
Methods
cancelRequestAnimationFrame(longhandle)
objectgetContext(string contextId, any)
isImageError(urlimage)
isImageLoaded(urlimage)
isImageLoading(urlimage)
loadImage(urlimage)
markDirty(rectarea)
longrequestAnimationFrame(callback)
requestPaint()
boolsave(string filename)
stringtoDataURL(string mimeType)
unloadImage(urlimage)
DetailedDescription
Canvas允许我们画直线和曲线,简单和复杂的形状,图表,引入一张图片。它也能添加文本,颜色,阴影,渐变、调色板,能进行低级别的像素处理。Canvas能输出到一张图片文件,也能作为URL交付其他组件使用。
可通过width和height属性来设置画布的面积。例如,下面的代码定义了宽100像素,高200像素的画布。
importQtQuick 2.0
Canvas {
id: mycanvas
width: 100
height: 200
}
当前Canvas只支持二维渲染。
线程渲染和渲染目标
Canvas支持两种渲染目标:Canvas.Image和Canvas.FramebufferObject。
Canvas.Image是QImage对象,这个渲染目标支持后台渲染线程,这允许复杂或长时间运行的绘制操作不会阻塞用户界面。
Canvas.FramebufferObject是通过OpenGL硬件加速来处理画布。因为不需要在内存中进行渲染操作,从而在许多情形中,渲染变得更快。它依赖的OpenGL扩展GL_EXT_framebuffer_multisample和GL_EXT_framebuffer_blit能提供抗锯齿功能。当渲染策略不是Canvas.Cooperative时,它会消费更多的图形内存。
默认的渲染目标是Canvas.Image,默认的渲染策略是Canvas.Immediate。
瓷片画布
通过设置canvasSize、tileSize和canvasWindow,Canvas能支持瓷片渲染。
瓷片系统允许我们通过一个小的画布窗口显示一个巨大的虚拟画布。这个功能实际消费的内存跟画布窗口的尺寸关联。画笔不需要经过坐标转换,就可以在虚拟画布上作画。瓷片重叠的区域在需要重绘的时候消除缓存,在一些情况下,这能明显提高性能。
像素操作
所有符合HTML5 2D内存的像素操作都被支持。为了确保像素的读写性能的提高,请选择Canvas.Image作为渲染目标。因为Canvas.FramebufferObject在操作像素的时候,要求在系统内存和图形卡之间交换数据。这明显要昂贵得多。渲染和可以和V-sync信号同步,以避免显示的画面是撕裂的。它会进一步影响Canvas.FramebufferObject的像素操作。
移植现有的HTML5画布应用。
尽管Canvas提供了所有的HTML5的API。HTML5的画布应用还需要做下面的修改,才能运行在Canvas上。
1、所有的DOM API调用需用QML属性绑定或Canvas方法替换。
2、用MouseArea替换所有HTML事件处理
3、用Timer或requestAnimationFrame()修改setInterval/setTimeout的功能调用
4、绘制使用onPaint句柄,用markDirty()或requestPaint()方法触发绘制。
5、绘制图片时,用loadImage()加载图片,然后在onImageLoaded上提出绘制请求。
同时参阅Context2D。
PropertyDocumentation
available :size
指明画布能进行绘制操作的尺寸。
canvasSize :size
逻辑画布的大小。默认画布尺寸和当前画布一样大。通过设置canvasSize、tileSize和 canvasWindow将画布变成由许多矩形的瓷片拼成的巨大虚拟画布后,只有当前画布窗口的瓷片,才能被画布渲染引擎渲染。同时参阅tileSize和canvasWindow。
canvasWindow: rect
当前画布可见的窗口,默认的窗口尺寸和画布尺寸一样大。左上角的点为(0,0)。如果canvasSize和画布尺寸不同,Canvas能通过改变画布的windowSize或位置来显示画布的不同区域。同时参阅canvasSize和tileSize。
context :object
活跃的绘图内容。如果画布准备好,那么通过调用getContext()或设置contextType属性的值为支持的绘制类型,则这个属性为当前活跃的绘制内容,否则为空。
contextType: string
用来绘制的类型。这个属性为活跃的绘制类型的名字。如果设置,则画布在变得可用后,将尝试创建绘制类型的绘图内容。类型的名字和getContext()调用的相同,例如2d画布的值为"2d"。同时参阅getContext()和available的属性文档。
renderStrategy: enumeration
当前画布的渲染策略。
Canvas.Immediate- 在UI主线程立刻进行渲染。
Canvas.Threaded- 绘制内容在私有渲染线程渲染。
Canvas.Cooperative- 绘制内容提供图形命令到全局渲染线程渲染。
策略的隐藏提供者为renderTarget。renderStrategy、renderTarget或组合可能不被图像系统支持。在这种情况下,绘制内容将选择合适的策略,画布将有属性改变的信号。设置或运行时测试可能促使QML场景在GUI主线程渲染,此时选择Canvas.Cooperative并不能保证渲染发生在独立于GUI线程的另一线程。默认值为Canvas.Immediate。
renderTarget: enumeration
当前画布渲染的目标。
Canvas.Image- 渲染到内存中的图像buffer。
Canvas.FramebufferObject- 渲染到OpenGL的帧buffer。
隐藏的提供者是renderStrategy定义的渲染方法。renderStrategy、renderTarget或组合可能不被图像系统支持。在这种情况下,绘制内容将选择合适的策略,画布将有属性改变的信号。默认值是Canvas.Image。
tileSize :size
画布上的瓷片尺寸。通过设置canvasSize、tileSize和canvasWindow,Canvas能进入瓷片模式。通过渲染和缓存瓷片,而不是渲染整个画布,可以提高渲染性能。消费的内存跟当前可视的区域相关。默认的tileSize和canvasSize一样。
SignalDocumentation
imageLoaded()
加载完图片后发射这个信号。
paint(rectregion)
当区域需要渲染时发射这个信号。如果绘制内容是活跃的,可从绘制内容的属性中引用。它也能通过markdirty()、requestPaint()或改变当前画布窗口来触发。
painted()
所有的绘制命令被执行,同时画布被渲染完毕后,这个信号触发。
MethodDocumentation
cancelRequestAnimationFrame(longhandle)
取消动画回调引用的处理。
objectgetContext(string contextId, any)
这里没有资料,等待中……
isImageError(urlimage)
如果图片加载失败,返回真。
isImageLoaded(urlimage)
图片成功加载并准备好使用时,返回真。
isImageLoading(urlimage)
图片正在加载则返回真。
loadImage(urlimage)
异步加载一张图片。当图片准备好,imageLoaded将被发射。通过unloadImage()可卸载加载好的图片。注意:只有加载的图片能被画布绘制。同时参阅unloadImage、imageLoaded、isImageLoaded()、Context2D::createImageData()和Context2D::drawImage()。
markDirty(rectarea)
给一个区域标记为脏,如果这个区域可视,则画布重绘它,这回出发paint信号。
longrequestAnimationFrame(callback)
在组成Qt Quick场景之前分配被调用的回调。
requestPaint()
请求重绘可视区域。
boolsave(string filename)
保存当前的画布内容到图片文件。保存的图片格式被文件名的后缀自动决定。注意:这个方法的调用将强迫绘制整个画布,不只是绘制可视的窗口中的内容。
stringtoDataURL(string mimeType)
为画布中的图片返回URL。默认的mimeType是"image/png"
unloadImage(urlimage)
卸载图片,一旦图片被卸载,在再次加载之前,它不能被画布绘制。-
顶
- 0
-
踩