Angular Toast - animation

Configures UI component visibility animations. This object contains two fields: show and hide.

Selector: dxo-animation
Type:

Object

The following code shows default values of the object depending on the device type:

Desktop, iOS
Android
{
    show: {
        type: 'fade',
        duration: 400,
        from: 0,
        to: 1
    },
    hide: {
        type: 'fade',
        duration: 400,
        from: 1,
        to: 0
    }
}
{
    show: {
        type: 'slide',
        duration: 200,
        from: {
            position: {
                my: 'top',
                at: 'bottom',
                of: window
            }
        }
    },
    hide: {
        type: 'slide',
        duration: 200,
        to: {
            position: {
                my: 'top',
                at: 'bottom',
                of: window
            }
        }
    }
}

Set the animation object to null or undefined to disable animations.

hide

An object that defines the animation properties used when the UI component is being hidden.

Selector: dxo-hide
Type:

AnimationConfig

Default Value: { type: 'fade', duration: 400, to: 0 }

show

An object that defines the animation properties used when the UI component is being shown.

Selector: dxo-show
Type:

AnimationConfig

Default Value: { type: 'fade', duration: 400, from: 0, to: 1 }