Saltar al contenido
CrossFly es 100% open sourceSíguenos en GitHub
CrossFlyCrossFly
Empezar

Esta página fue traducida automáticamente del portugués y puede contener errores. La versión en portugués es la canónica.

Cómo hacer fade (aparecer/desaparecer) de un componente

Propósito. Hacer que un componente aparezca suavemente (0 → 1) o desaparezca (1 → 0). AlphaAnimation interpola un float con ease-in-out; tú aplicas ese valor a la opacidad del componente y fuerzas el repaint.

APIs usadas

  • new AlphaAnimation(float start, float end, float duration [, float fps]) — crea la animación. start/end son limitados a [0,1]; interpolación ease-in-out cubic; duration en segundos; fps opcional (por defecto 60).
  • AlphaAnimation.onUpdate(Runnable) — callback en cada frame; lee getValue() aquí.
  • AlphaAnimation.onComplete(Runnable) — callback al llegar a end (también disparado por stop()).
  • AlphaAnimation.getValue() — valor actual interpolado.
  • AlphaAnimation.start() / stop() / cancel() — inicia / detiene (dispara onComplete) / cancela (no dispara).
  • Component.alpha(float) — define la opacidad del componente (0–1, limitada). Divergencia de Javadoc: el doc cita setAlpha, pero el método real es alpha(...).
  • Component.repaint() — método estático; solicita re-render (CrossFly renderiza bajo demanda, por lo que es obligatorio llamarlo dentro del onUpdate).

Ejemplo completo (copiar, pegar y ejecutar)

package com.exemplo;

import dev.crossfly.ui.*;
import dev.crossfly.ui.layout.*;
import dev.crossfly.ui.animation.*;

/** Pantalla principal ejecutable: aplica fade-in en un Label al abrir. */
public class MainWindow extends Window
{
   @Override
   public void onShow() throws Exception
   {
      super.onShow();
      setLayout(new VerticalLayout());

      Label c = new Label("Olá");
      add(c);

      // Declara la variable antes para poder leer getValue() dentro del onUpdate.
      AlphaAnimation anim = new AlphaAnimation(0f, 1f, 0.3f);       // 300 ms, 0 → 1
      anim.onUpdate(() ->
         {
            c.alpha(anim.getValue());   // aplica opacidad
            Component.repaint();        // render bajo demanda: sin esto, el frame no se redibuja
         })
         .onComplete(() -> Component.repaint())
         .start();
   }
}

El fragmento de abajo muestra solo el núcleo. Para ejecutarlo, colócalo en el esqueleto MainWindow de arriba.

Fragmento mínimo

// verificado en la fuente: AlphaAnimation clamp [0,1] ease-in-out; Component.alpha(float); Component.repaint() estático
Label c = new Label("Olá");
add(c);

// Declara la variable antes para poder leer getValue() dentro del onUpdate.
AlphaAnimation anim = new AlphaAnimation(0f, 1f, 0.3f);       // 300 ms, 0 → 1
anim.onUpdate(() ->
   {
      c.alpha(anim.getValue());   // aplica opacidad
      Component.repaint();        // render bajo demanda: sin esto, el frame no se redibuja
   })
   .onComplete(() -> Component.repaint())
   .start();

Notas:

  • alpha(1f) (o >= 0.999) elimina la propiedad de opacidad (componente 100% opaco); alpha(0f) lo hace invisible pero sigue presente en el layout.
  • Para fade-out usa new AlphaAnimation(1f, 0f, 0.3f) y, en el onComplete, hide()/elimina el componente si quieres.
  • Siempre llama a Component.repaint() en el onUpdate — CrossFly solo redibuja cuando se le solicita.

Profundiza

¿Te resultó útil esta página?