3D Object Fade After Animation Complete

Hi Jessie,

You can actually do this effect without writing any code, using the Tween System and Behavior Script.

You can follow the tweening guide to import the tween manager to your project, then you can set up an alpha tween that looks something like this:

Next, follow the Behavior Script guide to download and add BehaviorScript.js to your project. Add BehaviorScript to an object and set it up like this:

For Target Object in the Response section, set it to the object that holds your alpha tween.

Here's a quick example project I made to show this in action: download project

Let me know if you have any questions!

Hey eL Be,

Assuming each rock has its own Mesh Visual, you can add a script like this to each object to make it fade out based on height:

// @input float startFadeHeight = 80
// @input float fadeOutHeight = 20

// @input bool copyMaterial = true

var transform = script.getTransform();

var meshVisual = script.getSceneObject().getFirstComponent("Component.MeshVisual");

if (script.copyMaterial) {
    meshVisual.mainMaterial = meshVisual.mainMaterial.clone();
}

var mainPass = meshVisual.mainPass;

function invLerp(a, b, t) {
    return (t-a) / (b-a);
}

function setAlpha(pass, alpha) {
    var col = pass.baseColor;
    col.a = alpha;
    pass.baseColor = col;
}

script.createEvent("UpdateEvent").bind(function(){
    var height = transform.getWorldPosition().y;

    var heightRatio = invLerp(script.fadeOutHeight, script.startFadeHeight, height);
    heightRatio = Math.max(0, Math.min(1, heightRatio));
    
    setAlpha(mainPass, heightRatio);
});

Adjust "startFadeHeight" to the height you want the object to start fading out. Adjust "fadeOutHeight" to the height you want the object to be completely invisible. 

Also, make sure the rock material has blend mode set to "Normal" or anything else that supports transparency.

Let me know if you need any more help!

Jacob