DgsAnimTo: Difference between revisions

From Multi Theft Auto: Wiki
Jump to navigation Jump to search
(Created page with "__NOTOC__ {{Client function}} This function allow us to add animation to dgs elements. Change any property of dgs elements with animation effect. ==Syntax== <syntaxhighligh...")
 
No edit summary
 
(10 intermediate revisions by the same user not shown)
Line 6: Line 6:
==Syntax==  
==Syntax==  
<syntaxhighlight lang="lua">
<syntaxhighlight lang="lua">
gui,property,value,easing,thetime
number/table dgsAnimTo ( element/table dgsElement, string propertyName, mixed value, string easing = "Linear", int duration [, int delay = 0, bool reverseProgress = false ] )
bool dgsAnimTo ( element dgsElement, string propertyName, mixed value, string easing = "Linear", int duration )
</syntaxhighlight>
</syntaxhighlight>


===Required Arguments===  
===Required Arguments===  
*'''dgsElement:''' The DGS element to set animation to.
*'''dgsElement:''' The DGS element or a list of DGS elements to set animation to.
*'''propertyName:''' The property you want to apply to,
*'''propertyName:''' The property you want to apply to,
*'''value:''' Target value (should be a number when using built-in easing functions)
*'''value:''' Target value (should be a number when using built-in easing functions)
*'''easing:''' The easing function to use for the interpolation (For More Detail :[[Easing]]), or your own easing function created by [[addEasingFunction]].
*'''easing:''' The easing function to use for the interpolation (For More Detail :[[Easing]]), or your own easing function created by [[dgsAddEasingFunction]].
*'''duration:''' The time(ms) to finish the animation.
*'''duration:''' The time(ms) to finish the animation.
===Optional Arguments===
*'''delay:''' The delay time before the animation start, can decrease the using of timer.
*'''reverseProgress:''' Would you like the progress go from 0 to 1 or go from 1 to 0?


===Returns===
===Returns===
Returns true if succeed, ''false'' otherwise.
Returns an ''integer''/''table'' indicates the animation ID or a list of animation IDs if succeed, ''false'' otherwise.


==Example==
==Example==
Line 28: Line 31:
--Predefined variable
--Predefined variable
-- progress: from 0 to 1 , indicates the progress of the whole animation
-- progress: from 0 to 1 , indicates the progress of the whole animation
-- settings: a table {propertyName,targetValue,initialValue}
-- setting: a table {propertyName,targetValue,initialValue}
-- self: the dgs element
-- self: the dgs element
-- propertyTable: property table of the dgs element
-- propertyTable: property table of the dgs element
local _r,_g,_b,_a = bitExtract(settings[3],0,8),bitExtract(settings[3],8,8),bitExtract(settings[3],16,8),bitExtract(settings[3],24,8)
local _b,_g,_r,_a = bitExtract(setting[3],0,8),bitExtract(setting[3],8,8),bitExtract(setting[3],16,8),bitExtract(setting[3],24,8)
local r,g,b,a = bitExtract(settings[2],0,8),bitExtract(settings[2],8,8),bitExtract(settings[2],16,8),bitExtract(settings[2],24,8)
local b,g,r,a = bitExtract(setting[2],0,8),bitExtract(setting[2],8,8),bitExtract(setting[2],16,8),bitExtract(setting[2],24,8)
return tocolor(_r+(r-_r)*progress,_g+(g-_g)*progress,_b+(b-_b)*progress,_a+(a-_a)*progress)
return tocolor(_r+(r-_r)*progress,_g+(g-_g)*progress,_b+(b-_b)*progress,_a+(a-_a)*progress)
]])
]])

Latest revision as of 15:25, 22 March 2022

This function allow us to add animation to dgs elements.

Change any property of dgs elements with animation effect.

Syntax

number/table dgsAnimTo ( element/table dgsElement, string propertyName, mixed value, string easing = "Linear", int duration [, int delay = 0, bool reverseProgress = false ] )

Required Arguments

  • dgsElement: The DGS element or a list of DGS elements to set animation to.
  • propertyName: The property you want to apply to,
  • value: Target value (should be a number when using built-in easing functions)
  • easing: The easing function to use for the interpolation (For More Detail :Easing), or your own easing function created by dgsAddEasingFunction.
  • duration: The time(ms) to finish the animation.

Optional Arguments

  • delay: The delay time before the animation start, can decrease the using of timer.
  • reverseProgress: Would you like the progress go from 0 to 1 or go from 1 to 0?

Returns

Returns an integer/table indicates the animation ID or a list of animation IDs if succeed, false otherwise.

Example

DGS = exports.dgs

if not DGS:dgsEasingFunctionExists("colorChange") then
	DGS:dgsAddEasingFunction("colorChange",[[
	--Predefined variable
	-- progress: from 0 to 1 , indicates the progress of the whole animation
	-- setting: a table {propertyName,targetValue,initialValue}
	-- self: the dgs element
	-- propertyTable: property table of the dgs element
		local _b,_g,_r,_a = bitExtract(setting[3],0,8),bitExtract(setting[3],8,8),bitExtract(setting[3],16,8),bitExtract(setting[3],24,8)
		local b,g,r,a = bitExtract(setting[2],0,8),bitExtract(setting[2],8,8),bitExtract(setting[2],16,8),bitExtract(setting[2],24,8)
		return tocolor(_r+(r-_r)*progress,_g+(g-_g)*progress,_b+(b-_b)*progress,_a+(a-_a)*progress)
	]])
end

image = DGS:dgsCreateImage(200,100,400,400,_,false,_,tocolor(0,0,0,255))
DGS:dgsAnimTo(image,"color",tocolor(200,100,50,255),"colorChange",5000)

See Also

Custom Cursor Functions

Multi Language Supports

Animation

3D Element

3D Interface

3D Line

3D Image

3D Text

Browser

Button

Check Box

Combo Box

Custom Renderer

Edit

Detect Area

Drag'N Drop

Grid List

Image

Memo

Menu

Label

Layout

Line

Progress Bar

Radio Button

Scale Pane

Scroll Bar

Scroll Pane

Selector

Style

Switch Button

Tab Panel

Window

Basic Shape Plugins

Circle

Quadrilateral

Rounded Rectangle

Other Plugins

Blur Box

Canvas

Chart

Color Picker

Effect 3D

Gradient

Mask

Media Browser

Nine Slice

Object Preview Supports

Paste Handler

QRCode

Remote Image

Screen Source

SVG

Tooltips