[!Note] Please note that this control has been deprecated and replaced with the Grid component, and as such, we recommend migrating to that control. This will not be receiving any new features, bug fixes will be deprioritized. For help or questions on migrating your codebase to the Data Grid, please contact support.
Blazor Grid Column Animations
La Ignite UI for Blazor admite la animación de columnas durante eventos como ocultar o mover columnas. Cuando se configura la animación de columnas en la cuadrícula de datos Blazor, se activará la animación correspondiente para todas las celdas de esa columna.
Blazor Grid Column Animations Example
Animation Properties
Cada propiedad de animación de columna se enumera y describe a continuación:
ColumnAddingAnimationMode: Cuando se añade una columna, tienes la opción de que el encabezado de columna y sus celdas se deslicen desde la izquierda, derecha, arriba o abajo. También hay opciones para que aparezca con fundido y deslizamiento.ColumnExchangingAnimationMode: Cuando se intercambia una columna, tienes la opción de que el encabezado de columna intercambiado y sus celdas se deslicen hacia la izquierda, derecha, arriba o abajo. También hay opciones para que se desvanezca y que se desvanezca y se desvanezca.ColumnHidingAnimationMode: Cuando una columna está oculta, tienes la opción de que el encabezado de columna y sus celdas se deslicen hacia la izquierda, derecha, arriba o abajo. También hay opciones para que se desvanezca y se desvíe y se desvanezca hacia afuera.ColumnMovingAnimationMode: Cuando se mueve una columna, tienes la opción de que el encabezado de columna y sus celdas se deslicen por encima.ColumnPropertyUpdatingAnimationMode: Cuando cambia la propiedad de una columna, tienes la opción de que esa propiedad cambie interpolando o interpolando profundamente su cambio.ColumnShowingAnimationMode: Cuando se añade una columna, tienes la opción de que el encabezado de columna y sus celdas se deslicen desde la izquierda, derecha, arriba o abajo. También hay opciones para que aparezca con fundido y deslizamiento.
Code Snippet
A continuación se demuestra la implementación de cada una de las animaciones de columna descritas en este tema:
<IgbDataGrid Height="100%" Width="100%"
DataSource="DataSource"
ColumnAddingAnimationMode="ColumnShowingAnimationMode.SlideFromLeft"
ColumnExchangingAnimationMode="ColumnExchangingAnimationMode.SlideToRight"
ColumnHidingAnimationMode="ColumnHidingAnimationMode.SlideToTopAndFadeOut"
ColumnMovingAnimationMode="ColumnMovingAnimationMode.SlideOver"
ColumnPropertyUpdatingAnimationMode="ColumnPropertyUpdatingAnimationMode.Interpolate"
ColumnShowingAnimationMode="ColumnShowingAnimationMode.SlideFromBottomAndFadeIn" />