Introduction to Timelines

Thanks, DiegoM, for this great new feature!

Will it be possible to add "On keyframe reached" triggered event? I'm not entirely sure how it will work with different instances and properties, but this would definitely be a useful addition.

Let's say I want to change animation frame of the sprite at the keyframe. Currently the only way to do this is to compare Timeline.Time or Progress on every tick, which is not very convenient.

I guess this can be worked around with an instance variable, which you set to different values on each keyframe, but I can't test it - my C3 crashes all the time when I'm trying to add instance variables to the timeline...

dop2000

Somewhere in my TODO list there is the item "Further Event Sheet Integration", particularly the possibility to set a keyframe that would trigger an action on the related instance, an "Action Keyframe" if you will. But I have no timeframe as to when I would start working on that.

As for C3 crashing, I must have introduced that bug recently because I am pretty sure that should work, I will get around to fixing that for the next beta release.

rodimus111

> Did you think about doing it with BEZIER CURVES?

I realize that is a very popular request, so at some point I should be working on adding the functionality to use a bezier curve to edit the path an instance takes as it animates. I can't give any estimates as to when that work will start though, but it definitely is in the plans.

I'd really appreciate it. Thanks!!

Hi DiegoM, first off, thanks so much for the work you've put into this feature - it's a fantastic addition to Construct and I'm really looking forward to implementing it in my projects.

I've a question about the scrubbing: why is it necessary to hold Ctrl to see the current view? Are there going to be any situations where you don't want the marker to display the animation at the indicated time?

#DiegoM how do you open the timeline window on the mobile version of c3?

mekonbekon

When I first implemented the feature, there was no need to press ctrl to scrub. Right before making it public though, I was doing a little example animation, and I was constantly following what at the time was the wrong flow to create keyframes, which was:

1. making changes in the layout or properties bar
2. moving the time marker to a new position
3. setting keyframes in the new position

This meant that any changes I made in order to later create keyframes out of them, were lost because the program would preview the animation from the current time as soon as I moved the time marker to the position I wanted.

As the developer this was just a mild annoyance because I knew exactly what was going on. So I continued working taking into account that the correct workflow was:

1. moving the time marker to a new position
2. making changes in the layout or properties bar
3. setting keyframes in the new position

I thought that for anyone else this small gotcha would be confusing/annoying, so I decided that the default behaviour when moving the time marker shouldn't change instances values in any way.

Having to consciously press a key in order to preview makes it almost impossible to do it on accident, so the mild confusion of loosing changes because of an incorrect scrub becomes almost impossible.

When implementing these I thought about my previous experiences with other software like, 3d Studio Max or even Unity, where you have to juggle a bunch of keyboard shortcuts along with the mouse, just to be able to do something. I like every other person got used to that very quickly, so I thought it would be the same here.

this is such a nice thing! really.

This is awesome

Currently Timeline only works with Object which we animate but i think it should also work on multi instances of same object. and if we delete object from the layout Animation also removes from instance.

luckyrawatlucky

That is a feature I am planning on adding, at some point in the future. The idea is that somehow, possibly through an event action you should be able to change the instance or instances that a timeline is affecting, that way it would be possible to re-use the same animation for multiple instances. Not too sure when will I get around to doing that though.

Cubic Bezier Curves

As of the latest release, r144, it is possible to edit the path of an instance as it is animated using cubic bezier curves. This is not activated by default though. In order to use this feature you will need to set the new Path Mode property of the timeline. Currently there are two setting for it, Line and Cubic Bezier.

Once the mode is activated a few extra UI elements will appear in the Layout to allow you to edit the path of an instance as a curve. Remember that the new controls will only show up as long as Editing Mode is turned on.

It is also possible to see in the Timeline Bar which path mode is being used in between each pair of keyframes, and change the value if you like. This is similar to how you can change the ease function that is used in between each pair of keyframes.

Keep in mind that this feature is only used for X and Y properties of an instance, so other property tracks will not show a path mode.

DiegoM How do I loop a timeline? I want it to restart when it ends.

bilgekaan

How do I loop a timeline? I want it to restart when it ends.

Currently there seems to be a bug with restarting timelines, you can work around it as follows:

Make an "On timeline finished" event, and in it you set the timeline time back to zero. Instead of directly restarting it, you add a Wait 0.1s and then start it. Then it works.

I tried postponing it to after the event finished and then trigger a timeline start, but that won't work either.