Je souhaite afficher les images miniatures dans une grille.Vaadin 8.2.0: Comment aligner verticalement l'image dans la cellule
Ceci est mon code approprié (simplifié):
addColumnVisibilityChangeListener(event -> {
if (ID_THUMBNAIL.equals(event.getColumn().getId())) {
if (event.isHidden()) {
setBodyRowHeight(-1);
} else {
setBodyRowHeight(130);
}
// needed to force rendering of current values
getDataProvider().refreshAll();
}
});
// rescale returns a (cached) ExternalResource, image is 120x120px max
// aspect ratio is preserved, so at least width or height is 120px
grid.addColumn(this::rescale, new ImageRenderer<>(this::showImage))
.setCaption(ID_THUMBNAIL)
.setStyleGenerator(r -> ID_THUMBNAIL)
.setWidth(131);
Le CSS est:
.asset-grid td.thumbnail {
// height is set bij Vaadin Grid
padding: 5px;
text-align: center !important;
}
.asset-grid td.thumbnail img {
vertical-align: middle !important;
}
Tout fonctionne, sauf l'alignement vertical de l'image miniature. Il est affiché en haut de la cellule. J'ai essayé plusieurs paramètres, mais rien ne fonctionne.
Avez-vous essayé annonce d: "affichage: table-cellule; "à .asset-grille td.thumbnail? – 1011sophie
Juste essayé, pas de différence – rmuller
J'ai quelques solutions de contournement de travail, mais il dépeend sur la façon dont vous définissez la hauteur de la ligne.Il serait donc utile si vous pouviez fournir un [sscce] (http://sscce.org) afin que nous puissions prendre en compte tous les éléments – Morfic