Skip to main content

FadeAlpha

The FadeAlpha action changes the node's opacity over time.

The options object for the FadeAlpha action has the following properties:

  • alpha: The opacity of the node once the Action has completed.
  • duration: The duration of the animation in milliseconds.
  • runDuringTransition: A boolean indicating whether the action should run during a transition. This is an optional property. If not specified, the default is false.

The below example will change the circle's opacity to .15 over a duration of one second when the button is clicked.

clickMeButton.onTapDown(() => {
circle.run(Action.fadeAlpha({
alpha: .15,
duration: 1000,
}));
console.log("Circle fadeAlpha action has begun.");
});

As in the Move example, repeated clicks will run the action again, but because the circle is already at its destination alpha, there will be no visible change.

Loading...
Explore:
  • To make a dissolve effect between one node and another, place them in the same position, and set one node's alpha to 0. Then run two FadeAlpha actions: one that fades out the first node and another that fades in the second node.