# FadeFromTo Action

## Overview

![The FadeFromTo Action Node.](https://2628349686-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fwnv17cpjDin2deSlOz0z%2Fuploads%2Fgit-blob-b180d55fc6aadc0adacf5eeb1612ddc73851cc7c%2Ffadefromtoactionupdatedimage.png?alt=media)

The **FadeFromTo Action Node** continuously modifies the `Opacity` of an [**Object**](https://docs.incari.com/incari-studio/2023.1/objects-and-types/scene-objects) over a specified period of time, thus creating an **Animation**. Both the initial and final values of the `Opacity` are chosen by the user. Find an [example](#example) of how to use this **Node** and its effect over an **Object** at the end of this page.

Furthermore, visit the [**Actions Nodes**](https://docs.incari.com/incari-studio/2023.1/toolbox/actions) page for a general introduction to these **Nodes**.

[**Scope**](https://docs.incari.com/incari-studio/2023.1/overview#scopes): **Scene**, **Function**, **Prefab**.

## Attributes

![The FadeFromTo Action Node Attributes.](https://2628349686-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fwnv17cpjDin2deSlOz0z%2Fuploads%2Fgit-blob-b3d0d3234ec4a4c60f15a7edfb5ed007199ddb75%2Ffadefromtoactionattributes.png?alt=media)

| Attribute        | Type          | Description                                                                                                                                                                                                                                                                                                                                |
| ---------------- | ------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| `From`           | **Float**     | The desired initial value of the `Opacity`, if none is received in the `From` **Input Socket**.                                                                                                                                                                                                                                            |
| `To`             | **Float**     | The desired final value of the `Opacity`, if none is received in the `To` **Input Socket**.                                                                                                                                                                                                                                                |
| `Duration (sec)` | **Float**     | The total time of the **Action**, if none is received in the `Duration` **Input Socket**.                                                                                                                                                                                                                                                  |
| `Interpolation`  | **Drop-down** | The `Interpolation` method to use for calculating the intermediate values of the `Opacity`. It can be [*Linear*](https://en.wikipedia.org/wiki/Linear_interpolation), [*Sine Ease In*](https://easings.net/#easeInSine), [*Sine Ease In Out*](https://easings.net/#easeInOutSine), or [*Sine Ease Out*](https://easings.net/#easeOutSine). |

## Inputs

| Input         | Type           | Description                                                                                                                                                                                               |
| ------------- | -------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `Instance ID` | **InstanceID** | The assigned [**Instance ID**](https://docs.incari.com/incari-studio/2023.1/toolbox/actions/..#instance-id) of the **Action**. If nothing is received, it automatically assigns 0 as the **Instance ID**. |
| (►) `Start`   | **Pulse**      | A standard **Input Pulse**, to trigger the execution of the **Node**.                                                                                                                                     |
| `Object ID`   | **ObjectID**   | The ID of the target **Object**.                                                                                                                                                                          |
| `Duration`    | **Float**      | The total time (in seconds).                                                                                                                                                                              |
| `From`        | **Float**      | The initial value of the desired `Opacity`.                                                                                                                                                               |
| `To`          | **Float**      | The final value of the desired `Opacity`.                                                                                                                                                                 |

## Outputs

| Output             | Type           | Description                                                                                                                            |
| ------------------ | -------------- | -------------------------------------------------------------------------------------------------------------------------------------- |
| *Pulse Output* (►) | **Pulse**      | A standard **Output Pulse**, to move onto the next **Node** along the **Logic Branch**, once this **Node** has finished its execution. |
| `Instance ID`      | **InstanceID** | The assigned [**Instance ID**](https://docs.incari.com/incari-studio/2023.1/toolbox/actions/..#instance-id) of the **Action**.         |
| `OnStart` (►)      | **Pulse**      | Flows to the next **Node** following **FadeFromTo Action** when the **Action** starts.                                                 |
| `OnEnd` (►)        | **Pulse**      | Flows to the next **Node** following **FadeFromTo Action** when the **Action** stops.                                                  |

## Example

This section shows a simple example of how to use the **FadeFromTo Action** **Node** and the effect it has on an **Object**. We start by [configuring the **Scene**](#scene-configuration), then [build the **Logic**](#logic), and finally show the [result](#final-result).

### Scene Configuration

We consider a [**Scene**](https://docs.incari.com/incari-studio/2023.1/objects-and-types/project-objects/scene) with two [**Objects**](https://docs.incari.com/incari-studio/2023.1/objects-and-types/scene-objects): a white arc over a black background, both of which can be easily created in the [**Scene Outliner**](https://docs.incari.com/incari-studio/2023.1/modules/scene-outliner). Then, we set the `Size` **Attribute** of the arc to $$(500, 500, 0)$$ and the `Opacity` to $$0.25$$. See this configuration in the following image:

![Scene configuration.](https://2628349686-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fwnv17cpjDin2deSlOz0z%2Fuploads%2Fgit-blob-be4d35e294b9169a10094164f5270cbaed6ef77f%2FExampleFadeFromTo_1.png?alt=media)

### Logic

We then need to configure the **Logic**. This is done in the [**Logic Editor**](https://docs.incari.com/incari-studio/2023.1/modules/logic-editor).

We use first a [**Get Opacity** **Node**](https://docs.incari.com/incari-studio/2023.1/toolbox/incari/object/get-opacity), which allows us to obtain an **Object's** current `Opacity` value, and then the **FadeFromTo Action** **Node**, to which we will feed the value previously obtained and configure it for it to change it from there to a fixed value of our choosing.

For this purpose, we set the **Attributes** of the **FadeFromTo Action** **Node** in the following way:

* `To`: $$1$$
* `Duration (sec)`: $$1$$
* `Interpolation`: `Linear`

We just leave the `From` **Attribute** as it is, since this value will be obtained through the corresponding **Input Socket**.

Then, we connect the **Object ID** from the white arc [**Object Node**](https://docs.incari.com/incari-studio/2023.1/objects-and-types/scene-objects#objects-in-the-logic) to the `Object ID` **Input Socket** of both **Nodes**, the `Opacity` **Output** from the **Get Opacity** **Node** to the `From` **Input Socket** in the **FadeFromTo** **Node**, and a **Pulse** through the **Get Opacity** **Node** and to the `Start` **Input** in **FadeFromTo**. Thus, having the following **Logic** configuration:

![Logic configuration.](https://2628349686-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fwnv17cpjDin2deSlOz0z%2Fuploads%2Fgit-blob-b3e0c16d812e8b6c4de464e818040d8f5c36d460%2FExampleFadeFromTo_2.png?alt=media)

### Final result

Finally, the effect of the **FadeFromTo Action** **Node** when triggered is the following:

![Final result.](https://2628349686-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fwnv17cpjDin2deSlOz0z%2Fuploads%2Fgit-blob-0b07f40f82eb11fd9c4fe8a91a423e853ff7c151%2FExampleFadeFromTo_3.gif?alt=media)

## See Also

* [**FadeTo Action**](https://docs.incari.com/incari-studio/2023.1/toolbox/actions/fadetoaction)

## External Links

* [*Transparency (graphic)*](https://en.wikipedia.org/wiki/Transparency_\(graphic\)) on Wikipedia.