Estilo Dinámico 25.00
En webforJ 25 y superior, es posible estilizar filas y celdas individuales en la Tabla utilizando nombres de partes personalizadas. Estos nombres se pueden asignar dinámicamente según la lógica de tu aplicación, dándote un control detallado sobre la apariencia de la tabla.
Estilo de filas
El método setRowPartProvider() asigna nombres de partes a filas enteras según el ítem de datos que contienen. Esto te permite resaltar filas completas que cumplen con condiciones específicas, por ejemplo, alternando colores de fondo para filas pares.
Estos nombres de estilo se pueden dirigir utilizando el selector ::part() en tu CSS.
El selector ::part() es una característica especial de CSS que te permite estilizar elementos dentro del shadow DOM de un componente, siempre que esos elementos expongan un atributo part. Esto es especialmente útil para estilizar partes internas de los componentes de webforJ, como filas o celdas en una tabla.
Para más información sobre cómo funcionan las partes de sombra y cómo definirlas y dirigirlas, consulta la sección Styling.
Mostrar Código
- Java
Estilo de celdas
El método setCellPartProvider() estiliza celdas individuales según el ítem de datos y la columna a la que pertenecen. Esto lo hace ideal para resaltar valores específicos, como señalar edades que superan un umbral o entradas no válidas.
Al igual que las partes de fila, las partes de celda se definen por un nombre y se dirigen utilizando el selector ::part().
Mostrar Código
- Java
Reacción a actualizaciones de datos
Si tu aplicación modifica datos programáticamente, como actualizar la edad de un usuario, la tabla reevaluará y reaplicará automáticamente cualquier estilo de fila o celda asociado una vez que el ítem actualizado se comprometa en el repositorio.
En esta demostración, las celdas en la columna Edad se estilizan en función de un umbral: las edades superiores a 30 aparecen en verde, mientras que las edades de 30 o menos aparecen en rojo. Al hacer clic en el botón, se alterna la edad de Alice entre 28 y 31, lo que activa el setCellPartProvider para reaplicar el estilo apropiado cuando los datos se comprometen.
Mostrar Código
- Java
Filas a rayas
Habilita colores de fondo alternos para las filas para mejorar la legibilidad:
// Aplicar estilo de filas a rayas
table.setStriped(true);
Bordes
Configura qué bordes se muestran alrededor de la Table, columnas y filas:
// Habilitar todos los bordes
table.setBordersVisible(EnumSet.of(Table.Border.AROUND, Table.Border.COLUMNS, Table.Border.ROWS));
// Eliminar todos los bordes
table.setBordersVisible(EnumSet.noneOf(Table.Border.class));
La demostración a continuación muestra una forma simple de alinear la apariencia visual de tu Table con el resto de tu aplicación utilizando setStriped() y setBordersVisible().
Mostrar Código
- Java
Para obtener información sobre cómo usar el patrón Repository para gestionar y consultar colecciones, consulta los artículos sobre el Repository.