Package com.oorian.css.transitions

Class Reshape

java.lang.Object
com.oorian.css.transitions.Transition
com.oorian.css.transitions.Reshape
public class Reshape extends Transition
A transition that animates an element's border-radius.

Reshape transitions smoothly change the border-radius of an element, enabling morphing between shapes such as circles, rounded rectangles, and sharp-cornered squares.

Usage:


 // Round corners to 12px
 element.addTransition(new Reshape().setBorderRadius(12));
 element.transitionForward();

 // Morph to a circle
 new Reshape().setBorderRadius("50%")

 // Use in a TransitionSequence
 TransitionSequence seq = new TransitionSequence(element);
 seq.add(new Reshape().setBorderRadius(12).setDuration(0.5f));
 seq.add(new Reshape().setBorderRadius("50%").setDuration(0.4f));
 seq.play();
Since:
2026
Version:
1.0
Author:
Marvin P. Warble Jr.
See Also:

  • Constructor Details

    • Reshape

      public Reshape()
      Constructs a Reshape transition with no target border-radius.

      The target border-radius must be set via setBorderRadius(String) before use.

  • Method Details

    • setBorderRadius

      public Reshape setBorderRadius(String value)
      Sets the target border-radius as a CSS value string.
      Parameters:
      value - any valid CSS border-radius value (e.g., "12px", "50%", "10px 20px")
      Returns:
      this Reshape for method chaining

    • setBorderRadius

      public Reshape setBorderRadius(int pixels)
      Sets the target border-radius in pixels.
      Parameters:
      pixels - the border-radius in pixels
      Returns:
      this Reshape for method chaining

    • setBorderRadius

      public Reshape setBorderRadius(Units units)
      Sets the target border-radius using a CSS unit value.
      Parameters:
      units - the border-radius as a CSS unit (e.g., new Px(12), new Percent(50))
      Returns:
      this Reshape for method chaining

    • getBorderRadius

      public String getBorderRadius()
      Returns the target border-radius value.
      Returns:
      the CSS border-radius value, or null if not set

    • 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