SvgSetSize - Revision history

Fernando187: Remove obsolete Requirements section

2024-11-07T17:30:01Z

Remove obsolete Requirements section

← Older revision		Revision as of 17:30, 7 November 2024
Line 77:		Line 77:
	end		end
	</syntaxhighlight>		</syntaxhighlight>

	~~==Requirements==~~
	~~{{Requirements\|n/a\|1.5.8-9.20979\|}}~~

	==See Also==		==See Also==

LopSided: Update usage & examples as per GitHub PR #2589

2022-04-08T23:09:25Z

Update usage & examples as per GitHub PR #2589

← Older revision		Revision as of 23:09, 8 April 2022
Line 1:		Line 1:
	{{Client function}}		{{Client function}}
	{{Added feature/item\|1.5.9\|1.5.8\|20979\|Sets the underlying XML document from an SVG element.}}		{{Added feature/item\|1.5.9\|1.5.8\|20979\|Sets the underlying XML document from an SVG element.}}

			{{Important Note\|Before r21155 ([https://github.com/multitheftauto/mtasa-blue/commit/31579051cc046bc5cb55c59fc4e9e70ec1bdce34 3157905]) the provided callback wasn't stored on the SVG and was only fired '''once''' after the function had performed its task. This is no longer the case - each SVG can now store a single callback function (optional) which is fired '''every time''' the SVG texture has been changed/updated. }}

	==Syntax==		==Syntax==
	<syntaxhighlight lang="lua">bool svgSetSize( svg svgElement, int width, int height [, function callback ( ~~bool didLoad~~ ) ] )</syntaxhighlight>		<syntaxhighlight lang="lua">bool svgSetSize( svg svgElement, int width, int height [, function callback ( element svg ) ] )</syntaxhighlight>

	===Required Arguments===		===Required Arguments===
Line 11:		Line 14:
	===Optional Arguments===		===Optional Arguments===
	{{OptionalArg}}		{{OptionalArg}}
	*'''callback:''' A callback function which is ~~invoked upon~~ SVG ~~document~~ and texture ~~creation~~ (~~after resizing~~), ~~useful for knowing when~~ the ~~SVG element is ready~~		*'''callback:''' A callback function which is stored on the SVG and fired every time the SVG texture is updated (for example, via [[svgSetDocumentXML]]). '''Note''': if present, this will overwrite the current callback stored on the svg

	===Returns===		===Returns===
Line 17:		Line 20:

	==Example==		==Example==
	This example creates an [[svg]] element ~~(with callbacks to initialize drawing)~~ including a keybind to resize the ~~[[svg]]~~ randomly ~~(see bindKey).~~		This example creates an [[svg]] element including a keybind (F2) to resize the SVG randomly, with the use of callbacks to notify in debugscript when the SVG was updated.

	~~'''IMPORTANT''': Depending on your implementation~~, ~~callback usage may be necessary~~ to ~~ensure~~ the SVG ~~texture and XML document are ready~~.

	<syntaxhighlight lang="lua">		<syntaxhighlight lang="lua">
	-- This could also be a file, with the path provided to svgCreate		-- This could also be a file, with the path provided to svgCreate instead
	local rawSvgData = [[		local rawSvgData = [[
	<svg viewBox="0 0 500 500" xmlns="http://www.w3.org/2000/svg">		<svg viewBox="0 0 500 500" xmlns="http://www.w3.org/2000/svg">
Line 29:		Line 30:
	]]		]]

	local ~~svg~~		local svgs = {}

	function ~~init~~()		local function render(svg)
	~~-- Create an SVG containing a circle, using the raw XML data above~~		if (not isElement(svg)) or (getElementType(svg) ~= "svg") then
	svg ~~= svgCreate~~(~~500, 500, rawSvgData, function~~(~~didLoad~~)		removeEventHandler("onClientRender", root, svgs[svg].handler)
	if (~~not didLoad~~) ~~then -- SVG failed to load, so don't continue~~		svgs[svg] = nil
	~~return~~		end
	end

	~~onSvgLoad~~(svg)		local width, height = svgGetSize(svg)
	~~end~~)		dxDrawImage(0, 0, width, height, svg, 0, 0, 0, tocolor(255, 255, 255), false)
	end		end
	~~addEventHandler("onClientResourceStart", resourceRoot, init)~~

			local function onUpdate(svg)
			-- If this is the first update, add svg to our table and start drawing it
			if (not svgs[svg]) then
			svgs[svg] = {
			state = true,
			handler = function()
			render(svg)
			end
			}

			addEventHandler("onClientRender", root, svgs[svg].handler)
			end

	~~-- Implement a callback for SVG load~~		iprint("SVG texture updated", svg, getTickCount())
	~~function onSvgLoad(svg)~~
	~~addEventHandler~~("~~onClientRender~~", ~~root~~, ~~render~~)
	end		end

	function ~~render~~()		local function init()
	~~local width~~, ~~height = svgGetSize(svg)~~		-- Create an SVG containing a circle, using the raw XML data above
	~~dxDrawImage~~(0, 0, ~~width~~, ~~height~~, ~~svg~~, 0, ~~0, 0, tocolor~~(~~255, 255, 255~~)~~, false~~)		local mySvg = svgCreate(500, 500, rawSvgData, onUpdate)

			-- Bind a key to set SVG to a random size, which will trigger the onUpdate callback
			bindKey("F2", "down", function()
			setRandomSVGSize(mySvg)
			end)
	end		end
			addEventHandler("onClientResourceStart", resourceRoot, init)

	~~-- Add a keybind which sets the SVG to a random size~~		function setRandomSVGSize(svg)
	~~bindKey("r", "down",~~ function()		local width, height = svgGetSize(svg)
	~~if (not isElement~~(svg)) or (~~getElementType(svg~~) ~= ~~"svg"~~) ~~then~~		local diff = math.min(width, height) / math.max(width, height)
	~~return false~~		local size = math.random(100, 500)
	~~end~~

	~~local size = math.random(100, 500)~~		svgSetSize(svg, size, size * diff)
	svgSetSize(svg, size, size)		end
	end)
	</syntaxhighlight>		</syntaxhighlight>

LODS at 03:53, 20 February 2022

2022-02-20T03:53:16Z

← Older revision		Revision as of 03:53, 20 February 2022
Line 70:		Line 70:
	==See Also==		==See Also==
	{{SVG_functions}}		{{SVG_functions}}

			[[pt-br:svgSetSize]]

LopSided: Add callback note to example

2021-09-28T10:33:47Z

Add callback note to example

← Older revision		Revision as of 10:33, 28 September 2021
Line 18:		Line 18:
	==Example==		==Example==
	This example creates an [[svg]] element (with callbacks to initialize drawing) including a keybind to resize the [[svg]] randomly (see bindKey).		This example creates an [[svg]] element (with callbacks to initialize drawing) including a keybind to resize the [[svg]] randomly (see bindKey).

			'''IMPORTANT''': Depending on your implementation, callback usage may be necessary to ensure the SVG texture and XML document are ready.

	<syntaxhighlight lang="lua">		<syntaxhighlight lang="lua">
	-- This could also be a file, with the path provided to svgCreate		-- This could also be a file, with the path provided to svgCreate

LopSided: Initial page creation

2021-09-26T17:59:05Z

Initial page creation

New page

{{Client function}}
{{Added feature/item|1.5.9|1.5.8|20979|Sets the underlying XML document from an SVG element.}}
==Syntax==
<syntaxhighlight lang="lua">bool svgSetSize( svg svgElement, int width, int height [, function callback ( bool didLoad ) ] )</syntaxhighlight>

===Required Arguments===
*'''svgElement:''' The svg element you want to set the size of.
*'''width:''' Desired width, preferably power of two (16, 32, 64 etc.), maximum is 4096
*'''height :''' Desired height, preferably power of two (16, 32, 64 etc.), maximum is 4096

===Optional Arguments===
{{OptionalArg}}
*'''callback:''' A callback function which is invoked upon SVG document and texture creation (after resizing), useful for knowing when the SVG element is ready

===Returns===
* Returns '''true''' if successful, '''false''' otherwise

==Example==
This example creates an [[svg]] element (with callbacks to initialize drawing) including a keybind to resize the [[svg]] randomly (see bindKey).
<syntaxhighlight lang="lua">
-- This could also be a file, with the path provided to svgCreate
local rawSvgData = [[
<svg viewBox="0 0 500 500" xmlns="http://www.w3.org/2000/svg">
<circle cx="250" cy="250" r="250" fill="#0fc0fc" />
</svg>
]]

local svg

function init()
-- Create an SVG containing a circle, using the raw XML data above
svg = svgCreate(500, 500, rawSvgData, function(didLoad)
if (not didLoad) then -- SVG failed to load, so don't continue
return
end

onSvgLoad(svg)
end)
end
addEventHandler("onClientResourceStart", resourceRoot, init)

-- Implement a callback for SVG load
function onSvgLoad(svg)
addEventHandler("onClientRender", root, render)
end

function render()
local width, height = svgGetSize(svg)
dxDrawImage(0, 0, width, height, svg, 0, 0, 0, tocolor(255, 255, 255), false)
end

-- Add a keybind which sets the SVG to a random size
bindKey("r", "down", function()
if (not isElement(svg)) or (getElementType(svg) ~= "svg") then
return false
end

local size = math.random(100, 500)
svgSetSize(svg, size, size)
end)
</syntaxhighlight>

==Requirements==
{{Requirements|n/a|1.5.8-9.20979|}}

==See Also==
{{SVG_functions}}