LgGridImageColumn

LgGridImageColumn<TItem> affiche une image à partir d'une URL ou d'un chemin calculé à partir de la valeur liée.

<Columns Context="item">
    <LgGridImageColumn @bind-Value="item.PictureUrl"
                       Title="#Picture"
                       AlternativeText="#PictureAlt"
                       ImageWidth="48px"
                       ImageHeight="48px" />
</Columns>

• Package NuGet : Lagoon.UI.GridView

Les paramètres communs sont documentés dans LgGridBaseColumn.

Paramètres spécifiques

Nom	Type	Défaut	Description
AlternativeText	string	null	Texte alternatif de l'image.
ImageHeight	string	"100%"	Hauteur CSS de l'image.
ImageWidth	string	"100%"	Largeur CSS de l'image.
UrlPrefix	string	null	Préfixe d'URL, par exemple "/api/images/".
UrlSuffix	string	null	Suffixe d'URL.
Tooltip	string	null	Infobulle affichée sur l'image.
TooltipIsHtml	bool	false	Indique si le tooltip contient du HTML.

Utilisation

Images depuis une URL complète ou composée

GridImageColumnPage.razor

@inherits LgPage

<LgGridView StateId="orders-image-column" Items="_orders" Title="#OrdersGridTitle">
    <Columns Context="item">
        <LgGridImageColumn @bind-Value="item.PictureId"
                           Title="#Picture"
                           AlternativeText="#PictureAlt"
                           UrlPrefix="https://picsum.photos/id/"
                           UrlSuffix="/120/80"
                           ImageWidth="120px"
                           ImageHeight="80px"
                           Tooltip="#OpenPicture" />
        <LgGridImageColumn @bind-Value="item.PictureUrl"
                           Title="#PictureUrl"
                           AlternativeText="#PictureAlt"
                           ImageWidth="48px"
                           ImageHeight="48px" />
    </Columns>
</LgGridView>

UrlPrefix et UrlSuffix encadrent la valeur liée pour composer une URL ; si la valeur contient déjà l'URL complète, laissez-les vides.

Filtre

Aucun filtre intégré.

Référence complète

Fiche générée depuis les sources : Référence API — LgGridImageColumn.

Composants liés

• LgGridView — la grille de données qui héberge la colonne.
• LgGridTextColumn — colonne de base et paramètres communs hérités.
• LgDocument — affichage d'images et de documents protégés par l'authentification.