Difference between revisions of "Pendulum Animation (h2)"

From The Official Visionaire Studio: Adventure Game Engine Wiki
(Created page with "{| class="ts" style="width:100%" |- ! style="text-align:left" | Name !! style="text-align:left;width:10%" | By |- | Pendulum Animation Playback [loop forwards > backwards, or...")
 
 
(13 intermediate revisions by the same user not shown)
Line 3: Line 3:
 
! style="text-align:left" | Name !! style="text-align:left;width:10%" | By
 
! style="text-align:left" | Name !! style="text-align:left;width:10%" | By
 
|-
 
|-
| Pendulum Animation Playback [loop forwards > backwards, or vice versa] (animation, Lua) || AFRLme
+
| Pendulum Animation Playback (animation, lua) || AFRLme
|}{{AFRLme_Patreon}}
+
|}
  
This tutorial shows you how to create dynamic blinking for your characters using some if queries & a little bit of Lua script to force which animation frames should show. This tutorial only delves into the basics of adding a blinking animation to your characters idle animations, however you could quite easily use the same method to insert blink animations anywhere you like in any of your characters animations by querying which frames should be played or skipped.
+
This tutorial shows you how to apply a pendulum effect to your animations, so that you can make them play forwards then backwards or vice versa. The idea in itself is quite simple & it only requires 2 tiny lines of Lua script, however I do believe that a pendulum animation option should be included as a standard feature in Visionaire Studio be default, so here's hoping that it gets added at some point in the future.
  
  
== Tutorial #1: Single Blink ==
+
== Tutorial ==
First I started off by attaching the blink animation to the end of each of the idle animations & then I edited the first frame of each of the idle animations & created an execute a script action part containing...
+
Start off by creating an animation & then you need to add all the frames that are required for playing the forward animation.
<syntaxhighlight>
+
 
if math.random(20) < 13 then
+
<html><img src="https://wiki.visionaire-tracker.net/images/a/a8/Pendulum_tutorial_(step_1).gif" width="100%"/></html>
ActiveAnimations["animation_name"].AnimationLastFrame = 16
+
 
else
+
Next you need to select the first frame & then click on the edit button to open up the properties tab & then you need to click on the edit icon ( [[File:anim_editframe.png|16px|link=]] ), then you need to click on the create actions icon ( [[File:choose_action.png|16px|link=]] ) & then you need to create an '''execute a script''' action, which should contain something along the lines of this...
ActiveAnimations["animation_name"].AnimationLastFrame = 21
+
<syntaxhighlight lang="lua">
end
+
ActiveAnimations["animation_name"].PlayOppositeDirection = false -- play animation forwards
 
</syntaxhighlight>
 
</syntaxhighlight>
"animation_name" would be the name of the animation (I added a generic name to the code block). Also the number values are the amount of frames of the animation without & with the blink part of the animation. In this case frames 1-16 were the idle part of the animation & frames 17-21 was the blink part.
 
  
The little script above randomly generates a number between 1 & 20 & if the number is less than 13 then it will only play the idle part of the animation but if it equals 13 or more then it will play the idle part of the animation & then the blink part of the animation. This means that there is a 7 out of 20 chance that the character will blink at the end of the idle animations loop cycle.
+
<html><img src="https://wiki.visionaire-tracker.net/images/a/a8/Pendulum_tutorial_(step_2).gif" width="100%"/></html>
  
Pretty straightforward, no?
+
& now you need to do the same again for the last frame of the animation except the code you add should look something along the lines of...
 +
<syntaxhighlight lang="lua">
 +
ActiveAnimations["animation_name"].PlayOppositeDirection = true -- play animation in reverse
 +
</syntaxhighlight>
  
 
{| class="ts"
 
{| class="ts"
 
|-
 
|-
| ''Quick note: In Visionaire Studio we can force which animation frames of an animation can be played by defining the initial & end frame using AnimationFirstFrame & AnimationLastFrame.''
+
| ''Quick note: "animation_name" should be replaced with the actual name of the animation & remember the animation name is case sensitive.''
 
|}
 
|}
  
[[File:blink_screen_code.png|800px]]
+
[[File:pendulum_tutorial_(step_3).png|800px]]
 
 
 
 
== Tutorial #2: Double Blink ==
 
Same principal as [[#Tutorial #1: Single Blink|Tutorial #1]] except this time we will be adding some additional frames to the end of the animation, so that the character blinks twice, though technically I suppose you could also use a value, force the animation to play the blink frames only & increment or decrement the value until the value = 0 then force it back to the initial animation frame - ''actually now that I think about it, this would be a much better method as you can get a lot more creative with the amount of times the character consecutively blinks, but we'll delve into that at some other point in the future.''
 
 
 
Right, so again, you need to begin by attaching enough blink animation frames to the end of each of your idle animations to allow your character to be able to blink twice in a row & then what you are going to do is edit the first frame & create an execute a script action part inside of the actions area for said animation frame. It should contain something along the lines of this...
 
<syntaxhighlight>
 
blink = math.random(60)
 
 
 
if blink < 40 then
 
ActiveAnimations["animation_name"].AnimationLastFrame = 16 -- no blink
 
elseif blink >= 40 and < 50 then
 
ActiveAnimations["animation_name"].AnimationLastFrame = 21 -- single blink
 
else
 
ActiveAnimations["animation_name"].AnimationLastFrame = 27 -- double blink
 
end
 
</syntaxhighlight>
 
... again, the "animation_name" should be changed to the actual name of the animation you have added the little script to, & the AnimationLastFrame values should reflect the amount of frames you have used for idle, single blink & total. ''Remember to take into consideration that animation names are case sensitive.''
 
  
<html><img src="https://wiki.visionaire-tracker.net/images/3/33/Dynamic_blink_(2).gif" width="100%"/></html>
+
== Reference Video ==
 +
<html><iframe width="800" height="450" src="https://www.youtube.com/embed/1f4urBiIB78" frameborder="0" allowfullscreen></iframe></html>
  
 
== Resources ==
 
== Resources ==
Line 56: Line 41:
 
! style="text-align:left" | Name !! style="text-align:left" | Description
 
! style="text-align:left" | Name !! style="text-align:left" | Description
 
|-
 
|-
| - || N/A
+
| [[media:pendulum_animation.zip|pendulum_animation.zip]] || A working .ved file, complete with resources. Check out the readme.txt file for instructions.
 
|}{{toc}}
 
|}{{toc}}

Latest revision as of 01:18, 20 October 2018

Name By
Pendulum Animation Playback (animation, lua) AFRLme

This tutorial shows you how to apply a pendulum effect to your animations, so that you can make them play forwards then backwards or vice versa. The idea in itself is quite simple & it only requires 2 tiny lines of Lua script, however I do believe that a pendulum animation option should be included as a standard feature in Visionaire Studio be default, so here's hoping that it gets added at some point in the future.


Tutorial

Start off by creating an animation & then you need to add all the frames that are required for playing the forward animation.

Next you need to select the first frame & then click on the edit button to open up the properties tab & then you need to click on the edit icon ( Anim editframe.png ), then you need to click on the create actions icon ( Choose action.png ) & then you need to create an execute a script action, which should contain something along the lines of this...

ActiveAnimations["animation_name"].PlayOppositeDirection = false -- play animation forwards

& now you need to do the same again for the last frame of the animation except the code you add should look something along the lines of...

ActiveAnimations["animation_name"].PlayOppositeDirection = true -- play animation in reverse
Quick note: "animation_name" should be replaced with the actual name of the animation & remember the animation name is case sensitive.

Pendulum tutorial (step 3).png

Reference Video

Resources

Name Description
pendulum_animation.zip A working .ved file, complete with resources. Check out the readme.txt file for instructions.