How to: Implement a Custom Series Animation

• Jun 21, 2019
• 2 minutes to read

To implement a custom series animation for series views supported by the Cartesian (XY) diagram, design a class derived from the XYSeriesAnimationBase class and override the base class SeriesAnimationBase.ApplyState method. The following objects are passed to this method as parameters.

• SceneModifier sceneModifier - this object allows you to apply the required transformations to your series.
• Rectangle diagramBounds - this object specifies bounds of the diagram on which an animated series is drawn.
• float progress - this value specifies the current progress of the animation.

XYSeriesZoomAndRotateAnimation.cs

using DevExpress.XtraCharts;
using System.Drawing;

namespace XYSeriesCustomAnimationSample {
    class XYSeriesRotateAndZoomAnimation : XYSeriesAnimationBase {
        const int defaultRotationCount = 1;

        int rotationCount = defaultRotationCount;
        public int RotationCount {
            get { return rotationCount; }
            set { rotationCount = value; }
        }

        public override void ApplyState(SceneModifier modifier, Rectangle diagramBounds, float progress) {
            float currentWidth = diagramBounds.Width * progress;
            float currentHeight = diagramBounds.Height * progress;

            float diagramCenterX = diagramBounds.X + diagramBounds.Width / 2.0f;
            float diagramCenterY = diagramBounds.Y + diagramBounds.Height / 2.0f;

            float dx = (currentWidth - diagramBounds.Width) / 2;
            float dy = (currentHeight - diagramBounds.Height) / 2;

            modifier.Translate(-dx, -dy);
            modifier.Scale(progress, progress);

            modifier.Translate(diagramCenterX, diagramCenterY);
            modifier.Rotate(progress * 360 * RotationCount);
            modifier.Translate(-diagramCenterX, -diagramCenterY);
        }

        protected override ChartElement CreateObjectForClone() {
            return new XYSeriesRotateAndZoomAnimation();
        }
    }
}

XYSeriesZoomAndRotateAnimation.vb

Imports DevExpress.XtraCharts
Imports System.Drawing

Namespace XYSeriesCustomAnimationSample
    Friend Class XYSeriesRotateAndZoomAnimation
        Inherits XYSeriesAnimationBase

        Private Const defaultRotationCount As Integer = 1


        Private rotationCount_Renamed As Integer = defaultRotationCount
        Public Property RotationCount() As Integer
            Get
                Return rotationCount_Renamed
            End Get
            Set(ByVal value As Integer)
                rotationCount_Renamed = value
            End Set
        End Property

        Public Overrides Sub ApplyState(ByVal modifier As SceneModifier, ByVal diagramBounds As Rectangle, ByVal progress As Single)
            Dim currentWidth As Single = diagramBounds.Width * progress
            Dim currentHeight As Single = diagramBounds.Height * progress

            Dim diagramCenterX As Single = diagramBounds.X + diagramBounds.Width / 2.0F
            Dim diagramCenterY As Single = diagramBounds.Y + diagramBounds.Height / 2.0F

            Dim dx As Single = (currentWidth - diagramBounds.Width) / 2
            Dim dy As Single = (currentHeight - diagramBounds.Height) / 2

            modifier.Translate(-dx, -dy)
            modifier.Scale(progress, progress)

            modifier.Translate(diagramCenterX, diagramCenterY)
            modifier.Rotate(progress * 360 * RotationCount)
            modifier.Translate(-diagramCenterX, -diagramCenterY)
        End Sub

        Protected Overrides Function CreateObjectForClone() As ChartElement
            Return New XYSeriesRotateAndZoomAnimation()
        End Function
    End Class
End Namespace