Class Collapse

java.lang.Object
com.oorian.css.transitions.Transition
com.oorian.css.transitions.Collapse

public class Collapse extends Transition
A transition that collapses an element to zero height or width.

Collapse transitions animate max-height (vertical) or max-width (horizontal) to zero, creating an accordion-style collapse effect. The element's overflow is set to hidden during the transition.

Limitation: CSS cannot transition height: auto, so this class uses max-height: 2000px as the default expanded value. If your content exceeds 2000px, set a larger max-height on the element before triggering the transition.

Usage:


 // Vertical collapse (accordion)
 panel.addTransition(new Collapse());
 panel.transitionForward();   // collapses
 panel.transitionReverse();   // expands

 // Horizontal collapse
 sidebar.addTransition(new Collapse().setAxis(Axis.HORIZONTAL));
 sidebar.transitionForward();
 
Since:
2026
Version:
1.0
Author:
Marvin P. Warble Jr.
See Also:
  • Constructor Details

    • Collapse

      public Collapse()
      Constructs a Collapse transition that collapses vertically.
  • Method Details

    • setAxis

      public Collapse setAxis(Axis axis)
      Sets the collapse axis.
      Parameters:
      axis - Axis.VERTICAL for max-height, Axis.HORIZONTAL for max-width
      Returns:
      this Collapse for method chaining
    • getAxis

      public Axis getAxis()
      Returns the collapse axis.
      Returns:
      the axis
    • getTimingFunction

      protected TransitionTimingFunction getTimingFunction()
      Returns the timing function for this transition.

      The default is TransitionTimingFunction.EASE. Subclasses may override to use a different timing function (e.g., Collapse uses TransitionTimingFunction.EASE_IN_OUT).

      Overrides:
      getTimingFunction in class Transition
      Returns:
      the timing function
    • 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