An interface for animations that can be run by Animator.
Remarks
- An animated object is first created using the constructor of a subclass.
- Immediately before the animation a client calls initialize.
- To change the state of the animated object a client does a series of calls to animate, usually with an increasing relative time parameter.
- If the animation is done, the client calls cleanUp once.
- While animate uses a relative time scheme, there might be an absolute time value for the preferred duration of the whole sequence of animation steps. Since an IAnimation instance has no control on the number of animate calls or the intervals between them, the preferred duration is only a hint on how long the animation should take. Clients can ask for that hint using preferredDuration and try to find a suitable sequence of animate calls in order to fulfill the preference.
Type Details
- yfiles module
- view-component
- yfiles-umd modules
- All view modules
- Legacy UMD name
- yfiles.view.IAnimation
See Also
Properties
Gets the preferred duration of the animation.
Methods
Creates a delayed animation instance from this instance.
Remarks
delay longer than the existing one.Parameters
A map of options to pass to the method.
- delay - TimeSpan
- The delay to wait before the provided animation starts.
Returns
- ↪IAnimation
- A new animation that will first wait before the animation starts.
Creates an eased animation for the given base animation.
Remarks
The animation speed linearly increases up to a easeIn and linearly decreases from easeOut. Between those two points, the animation speed is constant.
The duration of the ease in and ease out is determined by a mapping [0,1] → [0,1]. The mapping has to be increasing to preserve the order of the frames in the decorated animation. In general, we consider continuously differentiable functions f where integral of f′ equals 1 a suitable choice for the mapping.
Parameters
A map of options to pass to the method.
- easeIn - number
- The ratio for the ease-in time [0,1] where 0 is the start of the animation and 1 the end.
0.5is the default value. - easeOut - number
- The ratio for the ease-out time [0,1] where 0 is the start of the animation and 1 the end.
0.5is the default value.
See Also
Initializes the animation.
Remarks
Static Methods
Creates a delay animation that does nothing.
Remarks
Parameters
A map of options to pass to the method.
- duration - TimeSpan
- The value for the preferredDuration of the created animation
Returns
- ↪IAnimation
- An animation that does nothing for amount of time specified in
duration.
createEdgeSegmentAnimation
(graph: IGraph, edge: IEdge, endBends: IPoint[], endSourceLocation: Point, endTargetLocation: Point, preferredDuration: TimeSpan) : IAnimationCreates a new IAnimation that animates the given edge's bends from its current shape linearly to the shape given by the endBends and final port locations.
Remarks
The bends of the edge layout are animated from their current location to their target locations. It is assumed that the edge style is a polyline style and the control points are the bends accordingly. The animation works for other styles too, but the effect might not be as expected. The number of bends in endBends can be different to the current number of bends. This will result in the animation automatically removing bends at the end of the animation or inserting new bends accordingly at the beginning of the animation.
The source and target points are also animated to new locations. However, the ports will not be moved by this animation. Instead a separate animation for the ports is needed to actually move IPorts at the ends of the edge if desired.
Parameters
A map of options to pass to the method.
- graph - IGraph
- The graph the animated edge belongs to.
- edge - IEdge
- The edge layout to animate.
- endBends - IPoint[]
- The bend positions after the animation.
- endSourceLocation - Point
- The absolute position of the source port after the animation.
- endTargetLocation - Point
- The absolute position of the target port after the animation.
- preferredDuration - TimeSpan
- The preferred duration of the animation in milliseconds.
See Also
createGraphAnimation
(graph: IGraph, targetNodeLayouts?: IMapper<INode,IRectangle>, targetBendLocations?: IMapper<IEdge,yfiles.geometry.IPoint[]>, targetPortLocations?: IMapper<IPort,IPortLocationModelParameter>, targetLayoutParameters?: IMapper<ILabel,ILabelModelParameter>, preferredDuration?: TimeSpan) : IAnimationCreates a new IAnimation that animates the given layout of all types of graph items.
Parameters
A map of options to pass to the method.
- graph - IGraph
- The graph for which the layout should be animated.
- targetNodeLayouts - IMapper<INode,IRectangle>
- The node layouts after the animation.
- targetBendLocations - IMapper<IEdge,yfiles.geometry.IPoint[]>
- The bend locations after the animation, for each edge the points are interpreted as the position of the bends along the edge in the given order.
- targetPortLocations - IMapper<IPort,IPortLocationModelParameter>
- The IPortLocationModelParameters for each IPort in the graph that will be morphed.
- targetLayoutParameters - IMapper<ILabel,ILabelModelParameter>
- The label model parameters for each label after the animation.
- preferredDuration - TimeSpan
- The preferred duration of the animation in milliseconds. The default is 500 milliseconds.
See Also
createLabelAnimation
(graph: IGraph, label: ILabel, targetLayoutParameter: ILabelModelParameter, preferredDuration: TimeSpan) : IAnimationCreates a new IAnimation that animates the given label from its current layout linearly to the layout given by the targetLayoutParameter.
Remarks
targetLayoutParameter to the label at the end of the animation.Parameters
A map of options to pass to the method.
- graph - IGraph
- The graph that contains the labels.
- label - ILabel
- The label to animate the parameter of.
- targetLayoutParameter - ILabelModelParameter
- The target parameter of the label.
- preferredDuration - TimeSpan
- The preferred duration of the animation.
Returns
- ↪IAnimation
- A new instance of IAnimation.
See Also
createLayoutAnimation
(graph: IGraph, layoutGraph: CopiedLayoutGraph, preferredDuration: TimeSpan) : IAnimationCreates a new IAnimation instance that animates the current graph to the layout given by a CopiedLayoutGraph instance.
Remarks
Parameters
A map of options to pass to the method.
- graph - IGraph
- the graph for which the layout should be animated
- layoutGraph - CopiedLayoutGraph
- the CopiedLayoutGraph that contains all target layout information
- preferredDuration - TimeSpan
- the preferred duration of the animation
Examples
const adapter = new LayoutGraphAdapter(graph)
const layoutGraph = adapter.createCopiedLayoutGraph()
const layout = new OrthogonalLayout()
layout.applyLayout(layoutGraph)
const morphAnimation = IAnimation.createLayoutAnimation(
graph,
layoutGraph,
TimeSpan.fromSeconds(1)
)See Also
Class.ensure(LayoutExecutor) More information.createNodeAnimation
(graph: IGraph, node: INode, targetLayout: IRectangle, preferredDuration: TimeSpan) : IAnimationCreates a new IAnimation that animates the given node from its current layout to the new given targetLayout.
Parameters
A map of options to pass to the method.
- graph - IGraph
- The graph the animated node belongs to.
- node - INode
- The node whose layout to animate.
- targetLayout - IRectangle
- The expected node layout after the animation.
- preferredDuration - TimeSpan
- The preferred duration of the animation.
Returns
- ↪IAnimation
- A new instance of IAnimation.
See Also
Creates an IAnimation according to the composite design pattern that animates multiple animations in parallel.
Remarks
Parameters
A map of options to pass to the method.
- animations - IEnumerable<IAnimation>
- The animations to run in parallel.
- synchronized - boolean
- Whether all child animations should be adjusted to have the same (maximum) preferredDuration. By default this is enabled.
Returns
- ↪IAnimation
- A new instance that is the composite of the given animations.
See Also
createPathAnimation
(path: GeneralPath, animationPoint: IMutablePoint, preferredDuration: TimeSpan) : IAnimationCreates a new instance of an IAnimation that animates the given IMutablePoint along a path.
Parameters
A map of options to pass to the method.
- path - GeneralPath
- The path to animate the point along.
- animationPoint - IMutablePoint
- The mutable point instance that will be manipulated by the animation.
- preferredDuration - TimeSpan
- The preferred duration of the animation.
See Also
createPortAnimation
(graph: IGraph, port: IPort, targetLocationParameter: IPortLocationModelParameter, preferredDuration: TimeSpan) : IAnimationCreates a new IAnimation that animates the given port from its current location to the new location given by the targetLocationParameter.
Remarks
targetLocationParameter to the port at the end of the animation.Parameters
A map of options to pass to the method.
- graph - IGraph
- The graph that contains the port.
- port - IPort
- The port to animate.
- targetLocationParameter - IPortLocationModelParameter
- The parameter to linearly interpolate to.
- preferredDuration - TimeSpan
- The preferred duration of this animation.
Returns
- ↪IAnimation
- A new instance of IAnimation.
See Also
Creates an IAnimation that animates multiple animations in sequence.
Remarks
animations runs in sequence one after another. The duration of the sequential animation is the sum of its child animation durations.Parameters
A map of options to pass to the method.
- animations - IEnumerable<IAnimation>
- The animations to run in sequence.
Returns
- ↪IAnimation
- A new sequential animation from the given animations.
See Also
Creates a new IAnimation for the given table that animates the table and its stripes.
Remarks
Note that only the sizes of leaf stripes, i.e. those without child stripes, are considered. The sizes of a stripe with children is implicitly determined by its contents.
For more control of the animation, implement a custom TableAnimation and override method createStripeAnimation.
Parameters
A map of options to pass to the method.
- table - ITable
- The table to animate.
- columnLayout - number[]
- The sizes of the leaf columns, in natural order.
- rowLayout - number[]
- The sizes of the leaf rows, in natural order.
Class.ensure(Table) More information.Creates an animation for the given delegate and preferredDuration.
Parameters
A map of options to pass to the method.
- callback - function(number):void
- The callback to use for the animation steps.
Signature Details
function(time: number)A callback method for animations.This can be used in animate as a simpler alternative to implementing IAnimation. The interface offers more flexibility for reusable animations as well as lifecycle management (initialize, cleanUp) and a preferred duration. But if the intent is to just run a simple one-off animation, animation callback is a useful alternative.Parameters
- time - number
- The current (relative) animation time which is a double between 0.0 for the start of the animation and 1.0 for the end of the animation.
- duration - TimeSpan
- The duration that the animation should last.
Returns
- ↪IAnimation
- A new animation that will use the
callbackto perform the actions.