How to do a tween animation?

sholola · December 9, 2020, 9:36pm

Leonidas · December 9, 2020, 9:51pm

Hi @sholola,

Study this guide:

http://developer.playcanvas.com/en/tutorials/tweening

will · December 10, 2020, 1:57am

Even better than playcanvas-tween is this tweening script (built on top of tween.js):

github.com

playcanvas/engine/blob/master/examples/assets/scripts/animation/tween.js

var Tween = pc.createScript('tween');

Tween.attributes.add('tweens', {
    type: 'json',
    schema: [
        {
            name: 'autoPlay',
            title: 'Autoplay',
            description: 'Play tween immediately.',
            type: 'boolean',
            default: false
        }, {
            name: 'event',
            title: 'Trigger Event',
            description: 'Play tween on the specified event name. This event must be fired on the global application object (e.g. this.app.fire(\'eventname\');).',
            type: 'string'
        }, {
            name: 'path',
            title: 'Path',
            description: 'The path from the entity to the property. e.g. \'light.color\', \'camera.fov\' or \'script.vehicle.speed\'.',

This file has been truncated. show original

Just drop that into the Editor, along with tween.js itself that you can grab from here:

https://cdnjs.cloudflare.com/ajax/libs/tween.js/18.6.4/tween.umd.js