Difference between revisions of "Canvas (简体中文)"

(Created page with "{{newin|0.8.0|080|type=type|text=It has been renamed from Framebuffer}} A Canvas is used for off-screen rendering. Think of it as an invisible screen that you can draw to...")
 
m (修改 bug)
 
(7 intermediate revisions by 4 users not shown)
Line 1: Line 1:
−
{{newin|[[0.8.0]]|080|type=type|text=It has been renamed from [[Framebuffer]]}}
+
{{newin (简体中文)|[[0.8.0]]|080|type=type|text=从 [[Framebuffer]] 重命名而来}}
−
A Canvas is used for off-screen rendering. Think of it as an invisible screen that you can draw to, but that will not be visible until you draw it to the actual visible screen. It is also known as "render to texture".
 
  
−
By drawing things that do not change position often (such as background items) to the Canvas, and then drawing the entire Canvas instead of each item,  you can reduce the number of draw operations performed each frame.
+
Canvas(画布)用于离屏渲染（就是不真正地绘制，只是把数据存储起来）。可以把它看成是一种无形的屏幕，你可以在上面绘制一些东西，但直到你将它绘制到实际的屏幕，它都不会被看见。它也被称为“纹理渲染(render to texture)”。
  
−
Canvases can be susceptible to [[PO2_Syndrome| power of 2 syndrome]]. Most graphics cards that support Canvas should have non-PO2 texture support. However, there are some old cards that do not. Check with [[love.graphics.isSupported|love.graphics.isSupported("npot")]] if it is supported.
+
在Canvas上绘制一些不经常改变（相对）位置的东西（如背景图案，蓝天，白云形成一个整体）,然后再把整个Canvas绘制出来。以此来代替每个物品都独自绘制, 这样可以减少每帧绘制操作的次数。
  
−
{{notice|Some very old graphics cards do not support canvases, and will throw an error if you attempt to use them. Use [[love.graphics.isSupported|love.graphics.isSupported("canvas")]] to check for support at runtime.}}
+
在 [[0.10.0]] 之前的版本中，并不是所有的显卡都能够支持 LÖVE 的 Canvases。[[love.graphics.isSupported|love.graphics.isSupported("canvas")]] 可以用来在运行时检查是否支持。
  
−
== Constructors ==
+
{{notice|往 Canvas(画布) 上绘制内容是会使用 regular alpha blengding（一种颜色混合的模型[[BlendMode]]）, 所要绘制的内容的 alpha(透明度，rgba中的a) 值会直接和自己的 RGB 值相乘。
−
{{#ask: [[Category:Functions]] [[Constructs::Canvas]]
+
由于一旦 Canvas 要被绘制的时候，它的像素颜色都会被 ''premultiplied alpha(预乘混合值)''，所以要把 Canvas 绘制到屏幕上或者其他的 Canvas 时必须要用 premultiplied alpha blending (另外一种颜色混合模式，表示已经预乘过了)– [[love.graphics.setBlendMode]]("alpha", "premultiplied")。 }}
 +
 
 +
== 构造函数 ==
 +
{{#ask: [[Category:Functions]] [[Constructs::Canvas (简体中文)]]
 
| headers=hide
 
| headers=hide
 
| default=None.
 
| default=None.
Line 21: Line 23:
 
}}
 
}}
 
== 函数 ==
 
== 函数 ==
−
{{#ask: [[Category:Functions]] [[parent::Canvas||Drawable||Object]] [[Concept:Current]]
+
{{#ask: [[Category:Functions]] [[parent::Canvas (简体中文)||Texture (简体中文)||Drawable (简体中文)||Object (简体中文)]] [[Concept:Current]]
 
| headers=hide
 
| headers=hide
 
| format=template
 
| format=template
Line 32: Line 34:
 
}}
 
}}
 
== 父类 ==
 
== 父类 ==
−
* [[parent::Texture]]
+
* [[parent::Texture (简体中文)]]
−
* [[parent::Drawable]]
+
* [[parent::Drawable (简体中文)]]
−
* [[parent::Object]]
+
* [[parent::Object (简体中文)]]
−
== 范例 ==
+
== 示例==
−
=== 绘制一些东西到Canvas上，然后覆盖在画面上。 ===
+
=== 在画布上绘制物品，并将画布绘制到屏幕 ===
 
<source lang="lua">
 
<source lang="lua">
 
function love.load()
 
function love.load()
−
canvas = love.graphics.newCanvas(800, 600)
+
    canvas = love.graphics.newCanvas(800, 600)
  
−
-- Rectangle is drawn to the canvas with the alpha blend mode.
+
    -- 使用 regular alpha blend 颜色混合模式在画布上绘制一个矩形
−
love.graphics.setCanvas(canvas)
+
    love.graphics.setCanvas(canvas)
−
canvas:clear()
+
        love.graphics.clear()
−
love.graphics.setBlendMode('alpha')
+
        love.graphics.setBlendMode("alpha")
−
love.graphics.setColor(255, 0, 0, 128)
+
        love.graphics.setColor(255, 0, 0, 128)
−
love.graphics.rectangle('fill', 0, 0, 100, 100)
+
        love.graphics.rectangle('fill', 0, 0, 100, 100)
−
love.graphics.setCanvas()
+
    love.graphics.setCanvas()
 
end
 
end
  
 
function love.draw()
 
function love.draw()
−
love.graphics.setColor(255, 255, 255, 255)
+
    -- 非常重要！：在绘制 Canvas 时需要把颜色进行重置，这样 Canvas 才能正确地显示
−
+
    -- 可以看下这里的讨论: https://love2d.org/forums/viewtopic.php?f=4&p=211418#p211418
−
-- The rectangle from the Canvas was already alpha blended.
+
    love.graphics.setColor(255, 255, 255, 255)
−
-- Use the premultiplied blend mode when drawing the Canvas itself to prevent another blending.
+
 
−
love.graphics.setBlendMode('premultiplied')
+
    -- Canvas 中的矩形已经是混合模式
−
love.graphics.draw(canvas)
+
    -- 当绘制 Canvas 时需要使用 premultiplied（预乘） alpha blend 模式才能保证颜色正确的混合，如果不理解的话，就记住这个操作
−
-- Observe the difference if the Canvas is drawn with the alpha blend mode instead.
+
    love.graphics.setBlendMode("alpha", "premultiplied")
−
love.graphics.setBlendMode('alpha')
+
    love.graphics.draw(canvas)
−
love.graphics.draw(canvas, 100, 0)
+
    -- 可以观察一下在普通的混合模式下两者的区别
 +
    love.graphics.setBlendMode("alpha")
 +
    love.graphics.draw(canvas, 100, 0)
  
−
-- Rectangle is drawn directly to the screen with the alpha blend mode.
+
    -- 一般的绘制物品，如矩形是直接使用 alpha blending 模式的
−
love.graphics.setBlendMode('alpha')
+
    love.graphics.setBlendMode("alpha")
−
love.graphics.setColor(255, 0, 0, 128)
+
    love.graphics.setColor(255, 0, 0, 128)
−
love.graphics.rectangle('fill', 200, 0, 100, 100)
+
    love.graphics.rectangle('fill', 200, 0, 100, 100)
 
end
 
end
 
</source>
 
</source>
  
−
== 参考 ==
+
== 参见 ==
−
* [[parent::love.graphics]]
+
* [[parent::love.graphics (简体中文)]]
−
* [[love.graphics.setCanvas]]
+
* [[love.graphics.setCanvas (简体中文)]]
−
* [[love.graphics.isSupported]]
+
* [[love.graphics.setBlendMode (简体中文)]]
 +
* [[love.graphics.isSupported (简体中文)]]
 
[[Category:Types]]
 
[[Category:Types]]
−
{{#set:Description=Off-screen render target.}}
+
{{#set:Description=离屏渲染目标物体。}}
 +
{{#set:Since=080}}
 +
{{#set:PrettySince=0.8.0}}
  
 
== 其他语言 ==
 
== 其他语言 ==
 
{{i18n|Canvas}}
 
{{i18n|Canvas}}

Latest revision as of 12:53, 31 March 2018

自 LÖVE 0.8.0 可以使用
从 Framebuffer 重命名而来.


Canvas(画布)用于离屏渲染（就是不真正地绘制，只是把数据存储起来）。可以把它看成是一种无形的屏幕，你可以在上面绘制一些东西，但直到你将它绘制到实际的屏幕，它都不会被看见。它也被称为“纹理渲染(render to texture)”。

在Canvas上绘制一些不经常改变（相对）位置的东西（如背景图案，蓝天，白云形成一个整体）,然后再把整个Canvas绘制出来。以此来代替每个物品都独自绘制, 这样可以减少每帧绘制操作的次数。

在 0.10.0 之前的版本中，并不是所有的显卡都能够支持 LÖVE 的 Canvases。love.graphics.isSupported("canvas") 可以用来在运行时检查是否支持。

O.png 往 Canvas(画布) 上绘制内容是会使用 regular alpha blengding（一种颜色混合的模型BlendMode）, 所要绘制的内容的 alpha(透明度，rgba中的a) 值会直接和自己的 RGB 值相乘。

由于一旦 Canvas 要被绘制的时候，它的像素颜色都会被 premultiplied alpha(预乘混合值)，所以要把 Canvas 绘制到屏幕上或者其他的 Canvas 时必须要用 premultiplied alpha blending (另外一种颜色混合模式，表示已经预乘过了)– love.graphics.setBlendMode("alpha", "premultiplied")。

 


构造函数

love.graphics.newCanvas (简体中文) 创建一个新的 Canvas（画布）。 Added since 0.8.0

函数

Object:release (简体中文) 立即摧毁对象在 Lua 中的引用 Added since 11.0

父类

示例

在画布上绘制物品，并将画布绘制到屏幕

function love.load()
    canvas = love.graphics.newCanvas(800, 600)

    -- 使用 regular alpha blend 颜色混合模式在画布上绘制一个矩形
    love.graphics.setCanvas(canvas)
        love.graphics.clear()
        love.graphics.setBlendMode("alpha")
        love.graphics.setColor(255, 0, 0, 128)
        love.graphics.rectangle('fill', 0, 0, 100, 100)
    love.graphics.setCanvas()
end

function love.draw()
    -- 非常重要！：在绘制 Canvas 时需要把颜色进行重置，这样 Canvas 才能正确地显示
    -- 可以看下这里的讨论: https://love2d.org/forums/viewtopic.php?f=4&p=211418#p211418
    love.graphics.setColor(255, 255, 255, 255)

    -- Canvas 中的矩形已经是混合模式
    -- 当绘制 Canvas 时需要使用 premultiplied（预乘） alpha blend 模式才能保证颜色正确的混合，如果不理解的话，就记住这个操作
    love.graphics.setBlendMode("alpha", "premultiplied")
    love.graphics.draw(canvas)
    -- 可以观察一下在普通的混合模式下两者的区别
    love.graphics.setBlendMode("alpha")
    love.graphics.draw(canvas, 100, 0)

    -- 一般的绘制物品，如矩形是直接使用 alpha blending 模式的
    love.graphics.setBlendMode("alpha")
    love.graphics.setColor(255, 0, 0, 128)
    love.graphics.rectangle('fill', 200, 0, 100, 100)
end

参见



其他语言

Dansk – Deutsch – English – Español – Français – Indonesia – Italiano – Lietuviškai – Magyar – Nederlands – Polski – Português – Română – Slovenský – Suomi – Svenska – Türkçe – Česky – Ελληνικά – Български – Русский – Српски – Українська – עברית – ไทย – 日本語 – 正體中文 – 简体中文 – Tiếng Việt – 한국어
More info

Retrieved from "https://love2d.org./w/index.php?title=Canvas_(简体中文)&oldid=21208"