Gradients (日本語)
gradient (Mesh 版)
概要
mesh = gradientMesh( direction, color1, color2, ... )
階調度全体を一定間隔で均一に配置を行った配色テーブルからグラデーションのオブジェクト (中身は Mesh) を作成します。 これは後述のグラデーション関数よりも性能が良いです。
引数
string direction
- グラデーションの方向 (horizontal または vertical)。
table color1
- 最初の配色テーブル。
table color2
- 第二の配色テーブル。
table ...
- 追加の配色テーブル。
返値
Mesh mesh
- gradient オブジェクト。
ソース
-- 色の乗算
local COLOR_MUL = love._version >= "11.0" and 1 or 255
function gradientMesh(dir, ...)
-- 方向の判定
local isHorizontal = true
if dir == "vertical" then
isHorizontal = false
elseif dir ~= "horizontal" then
error("bad argument #1 to 'gradient' (invalid value)", 2)
end
-- 色の判定
local colorLen = select("#", ...)
if colorLen < 2 then
error("color list is less than two", 2)
end
-- メッシュの生成
local meshData = {}
if isHorizontal then
for i = 1, colorLen do
local color = select(i, ...)
local x = (i - 1) / (colorLen - 1)
meshData[#meshData + 1] = {x, 1, x, 1, color[1], color[2], color[3], color[4] or (1 * COLOR_MUL)}
meshData[#meshData + 1] = {x, 0, x, 0, color[1], color[2], color[3], color[4] or (1 * COLOR_MUL)}
end
else
for i = 1, colorLen do
local color = select(i, ...)
local y = (i - 1) / (colorLen - 1)
meshData[#meshData + 1] = {1, y, 1, y, color[1], color[2], color[3], color[4] or (1 * COLOR_MUL)}
meshData[#meshData + 1] = {0, y, 0, y, color[1], color[2], color[3], color[4] or (1 * COLOR_MUL)}
end
end
-- 1x1 の画像寸法から成るメッシュを返します
return love.graphics.newMesh(meshData, "strip", "static")
end
注釈
生成された Mesh の寸法は 1x1 となります。グラデーションの寸法は love.graphics.draw の尺度係数で決定されます。この異形を使うときは後述の drawinrect 関数は不要です (本当に使用する必要はありません)。
gradient (Image 版)
概要
gradient {color1, color2, color3, ..., direction = 'horizontal' or 'vertical'}
引数テーブルの "direction" により指定された方向へ、階調度全体を一定間隔で均一に配置を行った配色テーブルからグラデーションのオブジェクト (中身は Image) を作成します。
ソース
function gradient(colors)
local direction = colors.direction or "horizontal"
if direction == "horizontal" then
direction = true
elseif direction == "vertical" then
direction = false
else
error("Invalid direction '" .. tostring(direction) .. "' for gradient. Horizontal or vertical expected.")
end
local result = love.image.newImageData(direction and 1 or #colors, direction and #colors or 1)
for i, color in ipairs(colors) do
local x, y
if direction then
x, y = 0, i - 1
else
x, y = i - 1, 0
end
result:setPixel(x, y, color[1], color[2], color[3], color[4] or 255)
end
result = love.graphics.newImage(result)
result:setFilter('linear', 'linear')
return result
end
drawinrect
概要
drawinrect(img, x, y, w, h, r, ox, oy, kx, ky)
絶対的な大きさの長方形にて拡大・縮小された画像を描画する便利な関数です(画像の大きさとは相対的な大きさではなく、 love.graphics.draw() が処理するものです)。ほぼに常に拡大・縮小されたものを描画したい理由があるとき、および配色数により境界が変更されることを望まない場合、グラデーションに対して有用です。
ソース
function drawinrect(img, x, y, w, h, r, ox, oy, kx, ky)
return -- 効率的にするためのちょっとした付け足しのための末尾の呼び出し。
love.graphics.draw(img, x, y, r, w / img:getWidth(), h / img:getHeight(), ox, oy, kx, ky)
end
用例
drawing horizontal rainbow that fills the entire screen using Mesh variant
-- assume you already have gradientMesh function
local rainbow
function love.load()
rainbow = gradientMesh("horizontal",
{255, 0, 0};
{255, 255, 0};
{0, 255, 0};
{0, 255, 255};
{0, 0, 255};
{255, 0, 0};
)
end
function love.draw()
love.graphics.draw(rainbow, 0, 0, 0, love.graphics.getDimensions())
end
画面中央に 100 x 100 ピクセルの水平方向の虹 (すなわち、上部は赤であり、下部は紫) を描画します。
require "gradient"
local rainbow = gradient {
direction = 'horizontal';
{255, 0, 0};
{255, 255, 0};
{0, 255, 0};
{0, 255, 255};
{0, 0, 255};
{255, 0, 0};
}
function love.draw()
drawinrect(rainbow, love.graphics.getWidth() / 2 - 50, love.graphics.getHeight() / 2 - 50, 100)
end
画面全体を塗りつぶす垂直方向の白黒領域 (すなわち、左部は黒であり、右部は白) を描画します。
require "gradient"
local greyscale = gradient {
direction = 'vertical';
{0, 0, 0};
{255, 255, 255};
}
function love.draw()
drawinrect(greyscale, 0, 0, love.graphics.getWidth(), love.graphics.getHeight())
end