Vis et helt team på liten plass. Overlappende avatarer slås sammen til et +n-merke når flere enn grensen din vises.
Hvorfor det hjelper
- Overlappende avatarer
- +n for resten
- Tips med navn
Hvor det passer
- Prosjekter
- Team
- Delte elementer
Eksempel
<Stack Direction="StackDirection.Column" Align="flex-start">
<AvatarGroup Items="_people" Label="Project members" />
<AvatarGroup Items="_people" Max="2" Size="Size.Small" Label="Project members (short)" />
<AvatarGroup Items="_people.Take(3)" Size="Size.Large" Label="Three members" />
</Stack>
@code {
private readonly AvatarItem[] _people =
[
new("Ada Lovelace"), new("Grace Hopper"), new("Linus Torvalds"), new("Margaret Hamilton"), new("Alan Turing"), new("Barbara Liskov")
];
}Et kort utdrag. Legg til @using RayCraft.Blazor.Components på siden din, og bruk en interaktiv gjengivelsesmodus.
Inkludert i RayCraft Free. Fungerende eksempler finnes i GitHub-arkiv (MIT); det inneholder eksempel- og demokode, ikke bibliotekets kode.