Package com.oorian.css.transitions

Class Morph

java.lang.Object
com.oorian.css.transitions.Transition
com.oorian.css.transitions.Morph
public class Morph extends Transition
A transition that animates arbitrary CSS properties to target values.

Morph is a general-purpose transition that accepts any CSS property/value pairs via set(String, String). This enables multi-step sequences that reuse the same CSS property (e.g., transform) at different steps, which is not possible with property-specific transition classes like Slide or Grow.

Usage:


 // Move an element to the right
 new Morph().set("transform", "translateX(200px)")

 // Move and change color simultaneously
 new Morph()
     .set("transform", "translateX(200px) translateY(100px)")
     .set("background-color", "#10b981")

 // Use in a TransitionSequence for multi-step movement
 TransitionSequence seq = new TransitionSequence();
 seq.add(element, new Morph().set("transform", "translateX(200px)"));
 seq.add(element, new Morph().set("transform", "translateX(200px) translateY(100px)"));
 seq.add(element, new Morph().set("transform", "translateX(0) translateY(0)"));
 seq.play();
Since:
2026
Version:
1.0
Author:
Marvin P. Warble Jr.
See Also:

  • Constructor Details

    • Morph

      public Morph()
      Constructs an empty Morph transition.

      At least one property must be set via set(String, String) before use.

  • Method Details

    • set

      public Morph set(String property, String value)
      Adds a CSS property and its target value to this transition.

      Multiple properties can be chained:

      
 new Morph()
     .set("transform", "translateX(200px)")
     .set("opacity", "0.5");
      Parameters:
      property - the CSS property name (e.g., "transform", "opacity")
      value - the target CSS value
      Returns:
      this Morph for method chaining

    • getTransitionProperties

      protected String[] getTransitionProperties()
      Returns the CSS property names that this transition animates.

      Subclasses return the CSS properties they modify (e.g., "opacity", "transform", "max-height"). These are used to build the CSS transition shorthand.

      Specified by:
      getTransitionProperties in class Transition
      Returns:
      an array of CSS property names

    • applyEndState

      public void applyEndState(CssStyle style)
      Applies the transition's end state to the given style.

      This method sets the CSS property values that represent the final state of the transition. For example, a fade-out sets opacity: 0.

      Specified by:
      applyEndState in class Transition
      Parameters:
      style - the CssStyle to apply end-state values to

    • snapshotCurrentState

      public void snapshotCurrentState(CssStyle current, CssStyle snapshot)
      Saves the current values of the transition's properties from the element's style.

      Before a transition plays forward, the current property values are saved so they can be restored when playing in reverse. If a property has no current value, the subclass should save a sensible default (e.g., "1" for opacity).

      Specified by:
      snapshotCurrentState in class Transition
      Parameters:
      current - the element's current CssStyle to read values from
      snapshot - the CssStyle to save values into

    • restoreOriginalState

      public void restoreOriginalState(CssStyle style, CssStyle snapshot)
      Restores previously saved property values to the given style.

      This method copies values from the snapshot back to the element's style, causing the browser to animate back to the original state.

      Specified by:
      restoreOriginalState in class Transition
      Parameters:
      style - the CssStyle to restore values to
      snapshot - the CssStyle containing previously saved values