Class DialogAnimationSettings

A class used for configuring the animation properties in the SfDialog component.

Inheritance

System.Object

SfBaseComponent

DialogAnimationSettings

Implements

System.IAsyncDisposable

Inherited Members

SfBaseComponent.DisposeAsync()

Namespace: Syncfusion.Blazor.Toolkit.Popups

Assembly: Syncfusion.Blazor.Toolkit.dll

Syntax

public class DialogAnimationSettings : SfBaseComponent, IAsyncDisposable

Remarks

The DialogAnimationSettings class allows you to customize the animation behavior when opening and closing dialogs. You can configure properties such as delay, duration, and animation effects to create smooth transitions and enhance user experience. The animation settings are applied uniformly to both the show and hide operations of the dialog.

Examples

In the following example, change the animation effect and delay time while opening the dialog.

@using Syncfusion.Blazor.Toolkit.Popups
<SfDialog Width="500px" @bind-Visible="Visibility">
  <DialogTemplates>
    <Content>
        <p>
           Dialog content
          </p>
      </Content>
  </DialogTemplates>
    <DialogAnimationSettings Delay="400" Effect="DialogEffect.SlideTop">
   </DialogAnimationSettings>
  </SfDialog>
 @code {
  private bool Visibility { get; set; } = true;
 }

Constructors

DialogAnimationSettings()

Declaration

public DialogAnimationSettings()

Properties

Delay

Gets or sets the delay in milliseconds before the animation begins.

Declaration

public double Delay { get; set; }

Property Value

Type	Description
System.Double	A numeric value representing the delay time in milliseconds before the animation starts. The default value is `0`.

Remarks

The delay setting affects both opening and closing animations of the dialog. A higher delay value will create a longer pause before the animation begins. This can be useful for creating staggered effects or synchronizing animations with other UI elements.

Duration

Gets or sets the duration in milliseconds that the animation takes to open or close the SfDialog.

Declaration

public double Duration { get; set; }

Property Value

Type	Description
System.Double	A numeric value representing the time in milliseconds for the animation to complete. The default value is `400`.

Remarks

The duration controls how fast or slow the animation plays. A shorter duration creates faster animations, while a longer duration creates slower, more gradual transitions. The same duration is used for both opening and closing animations. Setting this to 0 will effectively disable the animation transition.

Effect

Gets or sets the animation effect that should be used when opening and closing the SfDialog.

Declaration

public DialogEffect Effect { get; set; }

Property Value

Type	Description
DialogEffect	A DialogEffect enumeration value that specifies the animation effect. The default value is Fade. The available animation effects are: Fade - Gradual opacity transition FadeZoom - Combined fade and zoom effect FlipLeftDown - Flip animation from left to down FlipLeftUp - Flip animation from left to up FlipRightDown - Flip animation from right to down FlipRightUp - Flip animation from right to up FlipXDown - Horizontal flip with downward motion FlipXUp - Horizontal flip with upward motion FlipYLeft - Vertical flip with leftward motion FlipYRight - Vertical flip with rightward motion SlideBottom - Slide in/out from bottom SlideLeft - Slide in/out from left SlideRight - Slide in/out from right SlideTop - Slide in/out from top Zoom - Scale-based zoom effect None - No animation effect

Remarks

The animation effect determines the visual transition style when the dialog appears or disappears. Each effect has both an opening and closing variation - for example, Fade will use 'FadeIn' when opening and 'FadeOut' when closing. The slide effects will animate from/to the specified direction. Setting this to None will disable animations entirely.

Implements

System.IAsyncDisposable