Methods

This section describes the methods provided by the DevExpress.animationPresets object.

applyChanges()

Applies the changes made in the animation repository.

The animation repository is a non-simple collection of animation presets. This is a device-dependent collection where the presets that you register are sorted by devices so that the getPreset(name) method returns the animation configuration that is specific to the current device. Thus, adding of an animation preset to the animation repository includes not just the registration but an update of the total collection as well. So, not to waist time on the collection update each time a preset is registered in it, the repository exposes the applyChanges() method. Call this method after you registered all the required animation presets so that the repository update is then performed once.

clear(name)

Deletes the specified animation or clears all the animation repository, if an animation name is not passed.

Parameters:
name:

String

The name of the animation to delete from the animation repository.

NOTE
If you need to have predefined animations in the repository and delete only custom animations, call the resetToDefaults() method instead.

getPreset(name)

Returns the configuration of the animation found in the animation repository by the specified name for the current device.

Parameters:
name:

String

The name of the requested animation configuration.

Note that several animation configurations can be registered in the animationPresets repository by a single name, because they are targeted for different devices. When you call the getPreset(name) method, the configuration registered for the current device will be returned.

registerDefaultPresets()

Registers predefined animations in the animation repository.

By default, the animation repository includes predefined animations. You may need to call this method in case you deleted them by the clear(name) method.

NOTE
The changes performed by this method are not applied to the repository automatically. You should also call the applyChanges() method then. But consider calling the latter method once after you made all the required changes so that the update the repository does not take much time.

registerPreset(name, config)

Adds the specified animation preset to the animation repository by the specified name.

Parameters:
name:

String

The name by which the preset is added to the animation repository.

config:

Object

An object defining the animation preset to be registered.

Object structure:
animation:

animationConfig

A configuration object for the registered animation preset.

device:

Device

An object defining the target devices for which the animation preset is registered.

The animation repository allows you to store common animations that can be used for different elements in an application/site. These common animations are the presets that are registered by certain names. These presets can define the same animation, thus they have the same name, but be targeted for different devices, thus they have different animation configurations. Here is an example of an iOS-specific animation preset registered by the "my-animation" name.

JavaScript
DevExpress.animationPresets.registerPreset('my-animation', {
    device: { platform: 'ios' },
    animation: {
        //iOS-specific animation configuration
    }
});

If you do not specify the device field of the preset, the preset will be used on any device.

JavaScript
DevExpress.animationPresets.registerPreset('my-animation', {
    animation: {
        //common animation configuration 
    }
});

The following request will return the iOS-specific animation configuration when the application is running on an iOS device and the common animation configuration on any other device.

JavaScript
DevExpress.animationPresets.getPreset('my-animation');

You can register several animation presets common for all devices and then use them to register device specific presets under another name. Here is an example where the default presets are used to register another preset with a specific animation configurations used in iOS and on desktop.

JavaScript
DevExpress.animationPresets.registerPreset( 'view-content-change', { animation: 'slide' } );
DevExpress.animationPresets.registerPreset('view-content-change', { animation: 'ios7-slide', device: { platform: 'ios' } } );
DevExpress.animationPresets.registerPreset('view-content-change', { animation: 'fade', device: { deviceType: 'desktop', platform: 'generic' } } );
NOTE
The changes performed by the registerPreset(name, config) method are not applied to the animation repository automatically. You should also call the applyChanges() method then. But consider calling the latter method once after you made all the required changes, because a single update of the repository takes less time then the updates performed each time you make a change.

resetToDefaults()

Resets all the changes made in the animation repository.

Initially, the animation repository includes a set of predefined animations. You can add custom animations as well. If you need to clear the repository from custom animations and leave only predefined ones, call the resetToDefaults method. It will clear the repository and register the predefined animations applying all these changes once.