ValueIndicatorBase.Animation Property

Provides access to the animation object that allows you to customize animation for the current value indicator.

Namespace: DevExpress.Xpf.Gauges

Assembly: DevExpress.Xpf.Gauges.v20.2.dll

NuGet Packages: DevExpress.WindowsDesktop.Wpf.Gauges, DevExpress.Wpf.Gauges

Declaration

C#

public IndicatorAnimation Animation { get; set; }

VB.NET

Public Property Animation As IndicatorAnimation

Property Value

Type	Description
IndicatorAnimation	An IndicatorAnimation object.

Remarks

Using the IndicatorAnimation object returned by the Animation property, you can change an animation’s duration and easing function via its IndicatorAnimation.Duration and IndicatorAnimation.EasingFunction properties, as well as turn the animation on or off for the current value indicator (via the AnimationBase.Enable property).

Example

This example demonstrates how to use animation effects in DXGauges.

To activate animation, set the GaugeControlBase.EnableAnimation property to True. After that, it becomes possible to customize the animation’s duration and easing function via its IndicatorAnimation.Duration and IndicatorAnimation.EasingFunction properties.

View Example

MainWindow.xaml (C#)

<Window x:Class="DXGauges_Animation.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:dxga="http://schemas.devexpress.com/winfx/2008/xaml/gauges"
        Title="MainWindow" Height="350" Width="525" >
    <Grid>
        <!--region #EnableAnimation-->
        <dxga:CircularGaugeControl EnableAnimation="True">
        <!--endregion #EnableAnimation-->
            <dxga:CircularGaugeControl.Scales>
                <dxga:ArcScale>
                    <dxga:ArcScale.Needles>
                        <!--region #EnableEditing-->
                        <dxga:ArcScaleNeedle IsInteractive="True">
                        <!--endregion #EnableEditing-->
                            <dxga:ArcScaleNeedle.Animation>
                                <dxga:IndicatorAnimation Duration="00:00:02.0000000">
                                    <dxga:IndicatorAnimation.EasingFunction>
                                        <BounceEase/>
                                    </dxga:IndicatorAnimation.EasingFunction>
                                </dxga:IndicatorAnimation>
                            </dxga:ArcScaleNeedle.Animation>
                        </dxga:ArcScaleNeedle>
                    </dxga:ArcScale.Needles>
                </dxga:ArcScale>
            </dxga:CircularGaugeControl.Scales>
        </dxga:CircularGaugeControl>
    </Grid>
</Window>

MainWindow.xaml (VB.NET)

<Window x:Class="DXGauges_Animation.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:dxga="http://schemas.devexpress.com/winfx/2008/xaml/gauges"
        Title="MainWindow" Height="350" Width="525" >
    <Grid>
        <!--#region #EnableAnimation-->
        <dxga:CircularGaugeControl EnableAnimation="True">
        <!--#endregion #EnableAnimation-->
            <dxga:CircularGaugeControl.Scales>
                <dxga:ArcScale>
                    <dxga:ArcScale.Needles>
                        <!--#region #EnableEditing-->
                        <dxga:ArcScaleNeedle IsInteractive="True">
                        <!--#endregion #EnableEditing-->
                            <dxga:ArcScaleNeedle.Animation>
                                <dxga:IndicatorAnimation Duration="00:00:02.0000000">
                                    <dxga:IndicatorAnimation.EasingFunction>
                                        <BounceEase/>
                                    </dxga:IndicatorAnimation.EasingFunction>
                                </dxga:IndicatorAnimation>
                            </dxga:ArcScaleNeedle.Animation>
                        </dxga:ArcScaleNeedle>
                    </dxga:ArcScale.Needles>
                </dxga:ArcScale>
            </dxga:CircularGaugeControl.Scales>
        </dxga:CircularGaugeControl>
    </Grid>
</Window>

Related GitHub Examples

The following code snippet (auto-collected from DevExpress Examples) contains a reference to the Animation property.

Note

The algorithm used to collect these code examples remains a work in progress. Accordingly, the links and snippets below may produce inaccurate results. If you encounter an issue with code examples below, please use the feedback form on this page to report the issue.

XAML

pivotgridcontrol-and-gaugecontrol-integration-e3332/CS/PivotGauges/MainWindow.xaml#L81

<dxga:ArcScaleNeedle Value="{Binding TotalValue}" IsInteractive="True">
    <dxga:ArcScaleNeedle.Animation>
        <dxga:IndicatorAnimation />