Difference between revisions of "Canvas (日本語)"

(Created page with "{{newin (日本語)|0.8.0|080|type=型|text=Framebuffer から名称変更}} Canvas (キャンバス、画布) は画面外表示で使用さ...")
 
m
 
(10 intermediate revisions by the same user not shown)
Line 1: Line 1:
 
{{newin (日本語)|[[0.8.0]]|080|type=型|text=[[Framebuffer (日本語)|Framebuffer]] から名称変更}}
 
{{newin (日本語)|[[0.8.0]]|080|type=型|text=[[Framebuffer (日本語)|Framebuffer]] から名称変更}}
Canvas (キャンバス、画布) は画面外表示で使用されます。つまり描画はできるが可視の実画面に描画されるまでは表示されない不可視の画面と考えることができます。さらに "テクスチャの表示" としても知られています。
+
Canvas (キャンバス、画布) は、作業用の裏画面(バッファ)へオブジェクトを描画します。この画面は視認可能な表画面とは異なり、視認不可能な作業用の裏画面です(複数枚併用可能)。明示的に指定するまで表画面には描画されません。これは『テクスチャ・レンダリング』としても知られています。
  
Canvas へ座標を変更せず頻繁に描画を行うとき(例えば背景にあるアイテム)、各アイテムごとではなく Canvas へ全て描画することにより、各フレームの描画操作の実行回数を削減できます。
+
座標無変更で頻繁にオブジェクトを描画するとき(例えば背景のアイテム)、アイテム単位ではなく Canvas へ一括描画することにより、各フレームの描画操作の実行回数削減に繋がります。
  
Version [[0.10.0]] 以前は、 LÖVE により対応している全てのグラフィックスカードで Canvas を使用できるとは限りません。
+
Version [[0.10.0]] 以前では、 LÖVE により対応している全てのグラフィックスカードで Canvas を使用できるとは限りません。
[[love.graphics.isSupported (日本語)|love.graphics.isSupported("canvas")]] は実行時に対応状況を調べるために使用できます。
 
  
 +
対応状況の確認は [[love.graphics.isSupported (日本語)|love.graphics.isSupported("canvas")]] を起動時に呼び出します。
  
 
{{notice|通常の透過混合を使用して内容を Canvas へ描画する場合は、その内容にある透過値は RGB 値で乗算されます。
 
{{notice|通常の透過混合を使用して内容を Canvas へ描画する場合は、その内容にある透過値は RGB 値で乗算されます。
Line 15: Line 15:
 
| headers=hide
 
| headers=hide
 
| default=None.
 
| default=None.
 +
| format=template
 +
| template=ListingFields
 +
| introtemplate=ListingIntro
 +
| outrotemplate=ListingOutro
 +
| ?Description
 +
| ?PrettySince
 +
| ?PrettyDeprecated
 +
}}
 +
== 関数 ==
 +
{{#ask: [[Category:Functions]] [[parent::Canvas (日本語)||Texture (日本語)||Drawable (日本語)||Object (日本語)]] [[Concept:Current]]
 +
| headers=hide
 
| format=template
 
| format=template
 
| template=ListingFields
 
| template=ListingFields
Line 22: Line 33:
 
| ?PrettySince
 
| ?PrettySince
 
| ?PrettyRemoved
 
| ?PrettyRemoved
 +
| ?PrettyDeprecated
 
}}
 
}}
== 関数 ==
+
== 列挙型 ==
{{#ask: [[Category:Functions]] [[parent::Canvas (日本語)||Drawable (日本語)||Object (日本語)]] [[Concept:Current]]
+
{{#ask: [[Category:Enums]] [[parent::Canvas (日本語)]] [[Concept:Current]]
 
| headers=hide
 
| headers=hide
 
| format=template
 
| format=template
Line 33: Line 45:
 
| ?PrettySince
 
| ?PrettySince
 
| ?PrettyRemoved
 
| ?PrettyRemoved
 +
| ?PrettyDeprecated
 
}}
 
}}
 
== 上位型 ==
 
== 上位型 ==
Line 48: Line 61:
 
         love.graphics.clear()
 
         love.graphics.clear()
 
         love.graphics.setBlendMode("alpha")
 
         love.graphics.setBlendMode("alpha")
         love.graphics.setColor(255, 0, 0, 128)
+
         love.graphics.setColor(1, 0, 0, 0.5)
 
         love.graphics.rectangle('fill', 0, 0, 100, 100)
 
         love.graphics.rectangle('fill', 0, 0, 100, 100)
 
     love.graphics.setCanvas()
 
     love.graphics.setCanvas()
Line 54: Line 67:
  
 
function love.draw()
 
function love.draw()
     love.graphics.setColor(255, 255, 255, 255)
+
    -- 最重要: 正確な色を表示するために Canvas の描画前に色を再初期化設定してください。
 +
    -- こちらの議論を参照してください: https://love2d.org/forums/viewtopic.php?f=4&p=211418#p211418
 +
     love.graphics.setColor(1, 1, 1, 1)
  
 
     -- Canvas にある長方形は既に透過混合が適用されています。
 
     -- Canvas にある長方形は既に透過混合が適用されています。
Line 66: Line 81:
 
     -- 通常の透過混合方式を設定した画面へ長方形を直接描画します。
 
     -- 通常の透過混合方式を設定した画面へ長方形を直接描画します。
 
     love.graphics.setBlendMode("alpha")
 
     love.graphics.setBlendMode("alpha")
     love.graphics.setColor(255, 0, 0, 128)
+
     love.graphics.setColor(1, 0, 0, 0.5)
 
     love.graphics.rectangle('fill', 200, 0, 100, 100)
 
     love.graphics.rectangle('fill', 200, 0, 100, 100)
 
end
 
end
Line 79: Line 94:
 
{{#set:Since=080}}
 
{{#set:Since=080}}
 
{{#set:PrettySince=0.8.0}}
 
{{#set:PrettySince=0.8.0}}
{{#set:Description=画面外へ対象を表示します。}}
+
{{#set:Description=作業用の裏画面(バッファ)へオブジェクトを描画します。}}
  
 
== そのほかの言語 ==
 
== そのほかの言語 ==
 
{{i18n|Canvas}}
 
{{i18n|Canvas}}

Latest revision as of 18:24, 19 September 2019

LÖVE 0.8.0 から使用可能
Framebuffer から名称変更。

Canvas (キャンバス、画布) は、作業用の裏画面(バッファ)へオブジェクトを描画します。この画面は視認可能な表画面とは異なり、視認不可能な作業用の裏画面です(複数枚併用可能)。明示的に指定するまで表画面には描画されません。これは『テクスチャ・レンダリング』としても知られています。

座標無変更で頻繁にオブジェクトを描画するとき(例えば背景のアイテム)、アイテム単位ではなく Canvas へ一括描画することにより、各フレームの描画操作の実行回数削減に繋がります。

Version 0.10.0 以前では、 LÖVE により対応している全てのグラフィックスカードで Canvas を使用できるとは限りません。

対応状況の確認は love.graphics.isSupported("canvas") を起動時に呼び出します。

O.png 通常の透過混合を使用して内容を Canvas へ描画する場合は、その内容にある透過値は RGB 値で乗算されます。

そのため Canvas のピクセル色は描画された時点で 事前乗算透過 になってしまうので、 Canvas を画面または別の Canvas へ描画する時は事前に透過混合を使用する必要があります。 ― love.graphics.setBlendMode("alpha", "premultiplied")

 


コンストラクタ

love.graphics.newCanvas (日本語) Canvas オブジェクトを新規作成します。 Added since 0.8.0

関数

Canvas:clear (日本語) Canvas の内容を消去します。 Added since 0.8.0 Removed in 0.10.0
Canvas:generateMipmaps (日本語) 最高解像度のミップマップレベルの内容をもとに Canvas のミップマップを生成します。 Added since 11.0
Canvas:getFSAA (日本語) Canvas の描画時に使用するアンチエイリアシングのサンプル数を取得します。 Added since 0.9.1 Removed in 0.10.0
Canvas:getFormat (日本語) Canvas のテクスチャ形式を取得します。 Added since 0.9.1
Canvas:getImageData (日本語) Canvas の内容から ImageData を生成します。 Added since 0.8.0 Removed in 0.10.0
Canvas:getMSAA (日本語) Canvas の描画時に使用するマルチサンプル・アンチエイリアシング (Multi Sample Anti-Alias : MSAA) のサンプル数を取得します。 Added since 0.9.2
Canvas:getMipmapMode (日本語) この Canvas の作成で使用した ミップマップ方式 を取得します。 Added since 11.0
Canvas:getPixel (日本語) 指定された座標にある Canvas のピクセルを取得します。 Added since 0.9.0 Removed in 0.10.0
Canvas:newImageData (日本語) Canvas の内容から ImageData を生成します。 Added since 0.10.0
Canvas:renderTo (日本語) Canvas へ表示するために関数を使用します。 Added since 0.8.0
Object:release (日本語) Lua が参照しているオブジェクトを即時破棄します。 Added since 11.0
Object:type (日本語) オブジェクトの種類を文字列形式で取得します。
Object:typeOf (日本語) オブジェクトが特定の種類かどうか確認します。
Texture:getDPIScale (日本語) テクスチャの DPI 尺度係数を取得します。 Added since 11.0
Texture:getDepth (日本語) ボリュームテクスチャの深度を取得します。 Added since 11.0
Texture:getDepthSampleMode (日本語) シェーダーで深度テクスチャのサンプリング時に用いる比較方式を取得します。 Added since 11.0
Texture:getDimensions (日本語) Texture の幅と高さを取得します。 Added since 0.9.0
Texture:getFilter (日本語) テクスチャのフィルタ方式を取得します。
Texture:getFormat (日本語) テクスチャのピクセル形式を取得します。 Added since 11.0
Texture:getHeight (日本語) Texture の高さを取得します。
Texture:getLayerCount (日本語) アレイテクスチャにあるレイヤーまたはスライスの枚数を取得します。 Added since 11.0
Texture:getMipmapCount (日本語) Texture (テクスチャ) にあるミップマップの個数を取得します。 Added since 11.0
Texture:getMipmapFilter (日本語) Texture の mipmap フィルタ方式を取得します。 Added since 0.9.0
Texture:getPixelDimensions (日本語) テクスチャの幅と高さをピクセル単位で取得します。 Added since 11.0
Texture:getPixelHeight (日本語) テクスチャの高さをピクセル単位で取得します。 Added since 11.0
Texture:getPixelWidth (日本語) テクスチャの幅をピクセル単位で取得します。 Added since 11.0
Texture:getTextureType (日本語) Texture の形式を取得します。 Added since 11.0
Texture:getWidth (日本語) Texture の幅を取得します。
Texture:getWrap (日本語) Texture の加工特性を取得します。
Texture:isReadable (日本語) Texture の描画と Shader へ送信可能であるか取得します。 Added since 11.0
Texture:setDepthSampleMode (日本語) 深度テクスチャのシェーダーでサンプリング時に用いる比較方式を設定します。 Added since 11.0
Texture:setFilter (日本語) Texture のフィルタ方式を設定します。
Texture:setMipmapFilter (日本語) Texture の mipmap フィルタ方式を設定します。 Added since 11.0
Texture:setWrap (日本語) Texture の加工特性を設定します。

列挙型

MipmapMode (日本語) Canvas におけるミップマップの有無と動作を制御します。 Added since 11.0

上位型

用例

なにか Canvas へ描画してから Canvas を画面に表示します。

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

    -- 通常の透過混合方式を設定した Canvas へ長方形を描画します。
    love.graphics.setCanvas(canvas)
        love.graphics.clear()
        love.graphics.setBlendMode("alpha")
        love.graphics.setColor(1, 0, 0, 0.5)
        love.graphics.rectangle('fill', 0, 0, 100, 100)
    love.graphics.setCanvas()
end

function love.draw()
    -- 最重要: 正確な色を表示するために Canvas の描画前に色を再初期化設定してください。
    -- こちらの議論を参照してください: https://love2d.org/forums/viewtopic.php?f=4&p=211418#p211418
    love.graphics.setColor(1, 1, 1, 1)

    -- Canvas にある長方形は既に透過混合が適用されています。
    -- 不適切な混合方式を防ぐために Canvas への描画時に事前乗算透過混合方式を使用します。
    love.graphics.setBlendMode("alpha", "premultiplied")
    love.graphics.draw(canvas)
    -- 代わりに通常の透過混合方式を設定して描画された Canvas との差異を観察してください。
    love.graphics.setBlendMode("alpha")
    love.graphics.draw(canvas, 100, 0)

    -- 通常の透過混合方式を設定した画面へ長方形を直接描画します。
    love.graphics.setBlendMode("alpha")
    love.graphics.setColor(1, 0, 0, 0.5)
    love.graphics.rectangle('fill', 200, 0, 100, 100)
end

関連



そのほかの言語