Class Slide


public class Slide extends Transition
A transition that slides an element in a specified direction.

Slide transitions move an element using CSS transform: translate(). The direction, distance, and optional fade can all be configured.

Note: Because Slide uses the CSS transform property, it cannot be combined with Grow on the same element — the last one applied will overwrite the other's transform value.

Usage:


 // Slide left and fade out
 panel.addTransition(new Slide().setDirection(Direction.LEFT));
 panel.transitionForward();

 // Slide up 50px without fading
 panel.addTransition(new Slide()
     .setDirection(Direction.UP)
     .setDistance("50px")
     .setWithFade(false));
 
Since:
2026
Version:
1.0
Author:
Marvin P. Warble Jr.
See Also:
  • Constructor Details

    • Slide

      public Slide()
      Constructs a Slide transition that slides down with fade.
  • Method Details

    • setDirection

      public Slide setDirection(Direction direction)
      Sets the slide direction.
      Parameters:
      direction - the direction to slide
      Returns:
      this Slide for method chaining
    • setDistance

      public Slide setDistance(String distance)
      Sets the slide distance as a CSS length value.
      Parameters:
      distance - the distance (e.g., "100%", "50px", "10rem")
      Returns:
      this Slide for method chaining
    • setWithFade

      public Slide setWithFade(boolean withFade)
      Sets whether the slide includes a simultaneous fade to transparent.
      Parameters:
      withFade - true to fade during the slide, false for slide only
      Returns:
      this Slide for method chaining
    • getDirection

      public Direction getDirection()
      Returns the slide direction.
      Returns:
      the direction
    • getDistance

      public String getDistance()
      Returns the slide distance.
      Returns:
      the CSS distance value
    • isWithFade

      public boolean isWithFade()
      Returns whether the slide includes a fade.
      Returns:
      true if fading during slide
    • 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