Fijación de columnas de cuadrícula

Utilice la fijación de columnas de cuadrícula como mecanismo para fijar las primeras columnas de una cuadrícula desplazable a la izquierda. Ahora, cuando el usuario se desplaza, todas las demás columnas se mueven hacia la izquierda y hacia la derecha, excepto las que están fijadas. Las columnas fijadas siempre aparecen encima de las desplazables. La fijación de columnas de cuadrícula es visualmente idéntica a la Ignite UI for Angular

Grid Column Pinning Demo

Header Cell Feature

Para indicar que una columna se puede fijar, use la anulación Column Pinning de la celda del encabezado de la cuadrícula para esa columna en Sketch y cambie el valor predeterminado de No fijado a Fijado. Para lograr lo mismo en Figma, debe ir a la celda Encabezado, seleccionar la capa Column Pinning del panel de capas y luego establecer la propiedad Feature en Fijada en el panel de propiedades. En Adobe XD, la capa Column Pinning utiliza el paradigma Component States para permitirle cambiar fácilmente entre estados. Esto es lo que marca la columna como fijable en lo que respecta a la generación de código.

La fijación de columnas integrada se puede utilizar a través de la barra de herramientas de la cuadrícula que, de forma predeterminada, contiene un botón (combinado con un menú desplegable combinado) que le permite configurar el estado de fijación de las columnas para toda la cuadrícula.

Custom Column Pinning

También es posible agregar una acción de fijación personalizada en la celda del encabezado de la cuadrícula. En Sketch esto se puede lograr usando las anulaciones Feature Left o Feature Right y configurándolas en Icon Template. De esta manera, aparecerá un icono para indicar que la columna está fijada y puede cambiar su estado de fijar a desanclar desde la anulación de icono. En Figma, el método es idéntico, debe ir a la capa Celda de encabezado, seleccionar la capa Feature Left o Feature Right y cambiar su propiedad Type de None a Icon Template. Por supuesto, probablemente también desee reorganizar el orden de las columnas para que las fijadas aparezcan primero cuando se mira de izquierda a derecha.

Cell Right Border

La columna fijada más a la derecha debe tener su Right Border anulado para indicar Pinned Line tanto para el encabezado como para todas las celdas del cuerpo de la columna. Esto se muestra en la imagen a continuación para todas las celdas de la segunda columna desde que el Asunto está fijado.

Additional Resources

Tema relacionado:

• Red

Nuestra comunidad es activa y siempre da la bienvenida a nuevas ideas.