How to properly use tween for alpha?

Hi. I need to linearly tween an object’s alpha to 0. When I try to do this I get errors such as

Cannot read property 'tween' of undefined

This is my code:

 var screen4 = app.root.findByName('Screen4');
        var tween = new TWEEN.Tween(this.screen4);
        app.on('game:start', function () {
            setTimeout(function () {
            this.entity.tween(screen4).to({alpha: 0});
//            screen4.enabled = false;
            }, 1250);
        }, this);

what do I need to change to make it so this will work, I have tried debugging but I cannot figure this out :slight_smile: Thanks for any help

1 Like

So, first step is to add the tween.js library to your project. Make sure you get the latest version from the github page:

Then to tween the alpha, you need to access the material of the model referenced by this entity. As alpha isn’t a property of the pc.Entity class.

Something like this would work:

// some object with a property called 'value'
var data = {
    opacity: 0
var material = this.entity.model.material;
.to({opacity: 1.0}, 1.0, pc.Linear)
.on('update', function () {

    // alpha is called opacity in Playcanvas
    material.opacity = data.opacity;

1 Like

Using that code gives me an error that says
'Cannot read property 'tween' of undefined'

That sounds like you haven’t added the playcanvas tween library to your project.

If you did that, and it doesn’t work, try sharing a project to take a look.

for some reason it also won’t let me add it to Screen4…?

That project uses an outdated version of the tween library, you won’t be able to use it as it is.

Try creating a new empty project to experiment with tweening, that way you can isolate each problem and work your way around it, ultimately learning.

The new one that I added is called ‘tweening.js’

Sorry, can’t help you more in regards to the dependencies on that project. I would still propose creating an empty project to try and learn how to tween an objects alpha.

Okay, I have to go to sleep in a few minutes, I will try doing the new project tomorrow

1 Like